@devalok/shilp-sutra-karm 0.16.0 → 0.17.0

package/dist/_chunks/task-detail-panel.js

@@ -1,480 +1,483 @@
 "use client";
-import { jsxs as s, jsx as t, Fragment as xe } from "react/jsx-runtime";
-import * as p from "react";
-import { cn as N } from "@devalok/shilp-sutra/ui/lib/utils";
-import { Sheet as Me, SheetContent as Fe, SheetTitle as Be } from "@devalok/shilp-sutra/ui/sheet";
-import { VisuallyHidden as ze } from "@devalok/shilp-sutra/ui/visually-hidden";
-import { Skeleton as O } from "@devalok/shilp-sutra/ui/skeleton";
-import { Progress as qe, Tabs as Ye, TabsList as Ke, TabsTrigger as U } from "@devalok/shilp-sutra/ui";
-import { Avatar as j, AvatarImage as V, AvatarFallback as $ } from "@devalok/shilp-sutra/ui/avatar";
-import { Popover as oe, PopoverTrigger as de, PopoverContent as ce } from "@devalok/shilp-sutra/ui/popover";
-import { IconColumns3 as We, IconChevronDown as Je, IconCheck as fe, IconUser as Qe, IconUsers as Ue, IconX as Y, IconPlus as H, IconFlag as be, IconCalendarEvent as ge, IconTag as Ne, IconEye as ye, IconSquareCheck as Xe, IconSquare as Ze, IconListCheck as ve, IconMessage as we, IconGitPullRequest as Z, IconMessageCircle as Ie, IconSend as et, IconUpload as tt, IconExternalLink as st, IconDownload as rt, IconTrash as nt, IconPaperclip as ee, IconFile as me, IconPhoto as it, IconFileText as lt, IconFileCode as at, IconFileSpreadsheet as ot, IconFileZip as dt, IconActivity as te, IconCircleCheck as ct, IconUserMinus as mt, IconUserPlus as ut, IconArrowRight as pt, IconEdit as ht } from "@tabler/icons-react";
-import { getInitials as G } from "@devalok/shilp-sutra/composed/lib/string-utils";
-import { MemberPicker as X } from "@devalok/shilp-sutra/composed/member-picker";
-import { EmptyState as M } from "@devalok/shilp-sutra/composed/empty-state";
-import { Badge as xt } from "@devalok/shilp-sutra/ui/badge";
-import { RichTextViewer as ft, RichTextEditor as bt } from "@devalok/shilp-sutra/composed/rich-text-editor";
-import { Dialog as gt, DialogTrigger as Nt, DialogContent as yt, DialogHeader as vt, DialogTitle as wt, DialogDescription as It, DialogFooter as Dt, DialogClose as ue } from "@devalok/shilp-sutra/ui/dialog";
+import { jsxs as t, jsx as e, Fragment as be } from "react/jsx-runtime";
+import * as o from "react";
+import { cn as p } from "@devalok/shilp-sutra/ui/lib/utils";
+import { Sheet as ts, SheetContent as rs, SheetTitle as as } from "@devalok/shilp-sutra/ui/sheet";
+import { VisuallyHidden as ns } from "@devalok/shilp-sutra/ui/visually-hidden";
+import { Skeleton as L } from "@devalok/shilp-sutra/ui/skeleton";
+import { Progress as cs, Tabs as ls, TabsList as is, TabsTrigger as Z } from "@devalok/shilp-sutra/ui";
+import { Avatar as j, AvatarImage as H, AvatarFallback as G } from "@devalok/shilp-sutra/ui/avatar";
+import { Popover as de, PopoverTrigger as ue, PopoverContent as me } from "@devalok/shilp-sutra/ui/popover";
+import { IconColumns3 as os, IconChevronDown as ds, IconCheck as xe, IconUser as us, IconUsers as ms, IconX as W, IconPlus as $, IconFlag as Ne, IconCalendarEvent as ve, IconTag as ye, IconEye as we, IconSquareCheck as fs, IconSquare as hs, IconListCheck as Ie, IconMessage as Ce, IconGitPullRequest as se, IconMessageCircle as De, IconSend as ps, IconUpload as gs, IconExternalLink as bs, IconDownload as xs, IconTrash as Ns, IconPaperclip as te, IconFile as fe, IconPhoto as vs, IconFileText as ys, IconFileCode as ws, IconFileSpreadsheet as Is, IconFileZip as Cs, IconActivity as re, IconCircleCheck as Ds, IconUserMinus as Es, IconUserPlus as Ts, IconArrowRight as Rs, IconEdit as As } from "@tabler/icons-react";
+import { getInitials as B } from "@devalok/shilp-sutra/composed/lib/string-utils";
+import { MemberPicker as ee } from "@devalok/shilp-sutra/composed/member-picker";
+import { EmptyState as F } from "@devalok/shilp-sutra/composed/empty-state";
+import { Badge as Ss } from "@devalok/shilp-sutra/ui/badge";
+import { RichTextViewer as ks, RichTextEditor as Ps } from "@devalok/shilp-sutra/composed/rich-text-editor";
+import { formatRelativeTime as Ls } from "@devalok/shilp-sutra/ui/lib/date-utils";
+import { Dialog as Os, DialogTrigger as _s, DialogContent as Vs, DialogHeader as js, DialogTitle as Hs, DialogDescription as Gs, DialogFooter as $s, DialogClose as he } from "@devalok/shilp-sutra/ui/dialog";
 import { Button as pe } from "@devalok/shilp-sutra/ui/button";
-const Et = {
+const Bs = {
   LOW: "Low",
   MEDIUM: "Medium",
   HIGH: "High",
   URGENT: "Urgent"
-}, De = {
-  LOW: "bg-[var(--color-category-slate)]",
-  MEDIUM: "bg-[var(--color-warning)]",
-  HIGH: "bg-[var(--color-error)]",
-  URGENT: "bg-[var(--color-error)]"
-}, Tt = {
+}, Ee = {
+  LOW: "bg-category-slate-9",
+  MEDIUM: "bg-warning-9",
+  HIGH: "bg-error-9",
+  URGENT: "bg-error-9"
+}, Fs = {
   PENDING: { color: "warning", label: "Pending" },
   APPROVED: { color: "success", label: "Approved" },
   CHANGES_REQUESTED: { color: "brand", label: "Changes Requested" },
   REJECTED: { color: "error", label: "Rejected" }
-}, Ct = ["LOW", "MEDIUM", "HIGH", "URGENT"];
-function _({
+}, zs = ["LOW", "MEDIUM", "HIGH", "URGENT"];
+function O({
   icon: n,
-  label: e,
-  children: b,
-  className: x
+  label: s,
+  children: g,
+  className: h
 }) {
-  return /* @__PURE__ */ s(
+  return /* @__PURE__ */ t(
     "div",
     {
-      className: N(
+      className: p(
         "flex items-center gap-ds-04 py-ds-03",
-        x
+        h
       ),
       children: [
-        /* @__PURE__ */ s("div", { className: "flex w-[120px] shrink-0 items-center gap-ds-03 text-text-placeholder", children: [
-          /* @__PURE__ */ t(n, { className: "h-ico-sm w-ico-sm", stroke: 1.5 }),
-          /* @__PURE__ */ t("span", { className: "text-ds-sm", children: e })
+        /* @__PURE__ */ t("div", { className: "flex w-[120px] shrink-0 items-center gap-ds-03 text-surface-fg-subtle", children: [
+          /* @__PURE__ */ e(n, { className: "h-ico-sm w-ico-sm", stroke: 1.5 }),
+          /* @__PURE__ */ e("span", { className: "text-ds-sm", children: s })
         ] }),
-        /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: b })
+        /* @__PURE__ */ e("div", { className: "flex-1 min-w-0", children: g })
       ]
     }
   );
 }
-function Rt({ priority: n }) {
-  return /* @__PURE__ */ s("div", { className: "flex items-center gap-ds-02b", children: [
-    /* @__PURE__ */ t("div", { className: N("h-2 w-2 rounded-ds-full", De[n]) }),
-    /* @__PURE__ */ t("span", { className: "text-ds-md text-text-primary", children: Et[n] || n })
+function qs({ priority: n }) {
+  return /* @__PURE__ */ t("div", { className: "flex items-center gap-ds-02b", children: [
+    /* @__PURE__ */ e("div", { className: p("h-2 w-2 rounded-ds-full", Ee[n]) }),
+    /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg", children: Bs[n] || n })
   ] });
 }
-const Ee = p.forwardRef(
+const Te = o.forwardRef(
   function({
-    task: e,
-    columns: b,
-    members: x,
-    onUpdate: d,
-    onAssign: c,
-    onUnassign: g,
+    task: s,
+    columns: g,
+    members: h,
+    onUpdate: b,
+    onAssign: m,
+    onUnassign: y,
     className: D,
-    readOnly: f = !1,
-    editableFields: m,
-    renderPriorityIndicator: y,
-    renderDatePicker: I,
-    onConfirmVisibilityChange: v
-  }, a) {
-    const [w, o] = p.useState(""), [l, h] = p.useState(!1), u = e.assignees.map((i) => i.user.id), E = p.useMemo(
-      () => x.map((i) => ({ id: i.id, name: i.name, avatar: i.image ?? void 0 })),
-      [x]
-    ), T = (i) => {
-      d("columnId", i);
-    }, R = (i) => {
-      d("ownerId", i === e.ownerId ? null : i);
-    }, A = (i) => {
-      u.includes(i) ? g(i) : c(i);
-    }, S = (i) => {
-      d("priority", i);
-    }, P = (i) => {
-      d("dueDate", i ? i.toISOString() : null);
-    }, k = () => {
-      const i = w.trim();
-      i && !e.labels.includes(i) && d("labels", [...e.labels, i]), o(""), h(!1);
-    }, K = (i) => {
-      d("labels", e.labels.filter((J) => J !== i));
-    }, W = () => {
-      const i = e.visibility === "INTERNAL" ? "EVERYONE" : "INTERNAL";
-      if (i === "EVERYONE" && v) {
-        v();
+    readOnly: x = !1,
+    editableFields: d,
+    renderPriorityIndicator: C,
+    renderDatePicker: N,
+    onConfirmVisibilityChange: w,
+    ...I
+  }, l) {
+    const [v, i] = o.useState(""), [c, f] = o.useState(!1), u = s.assignees.map((a) => a.user.id), E = o.useMemo(
+      () => h.map((a) => ({ id: a.id, name: a.name, avatar: a.image ?? void 0 })),
+      [h]
+    ), T = (a) => {
+      b("columnId", a);
+    }, S = (a) => {
+      b("ownerId", a === s.ownerId ? null : a);
+    }, _ = (a) => {
+      u.includes(a) ? y(a) : m(a);
+    }, R = (a) => {
+      b("priority", a);
+    }, k = (a) => {
+      b("dueDate", a ? a.toISOString() : null);
+    }, z = () => {
+      const a = v.trim();
+      a && !s.labels.includes(a) && b("labels", [...s.labels, a]), i(""), f(!1);
+    }, J = (a) => {
+      b("labels", s.labels.filter((Q) => Q !== a));
+    }, M = () => {
+      const a = s.visibility === "INTERNAL" ? "EVERYONE" : "INTERNAL";
+      if (a === "EVERYONE" && w) {
+        w();
         return;
       }
-      d("visibility", i);
-    }, F = y || Rt;
-    return /* @__PURE__ */ s("div", { ref: a, className: N("space-y-ds-01", D), children: [
-      /* @__PURE__ */ t(_, { icon: We, label: "Column", children: f && !(m != null && m.includes("columnId")) ? /* @__PURE__ */ t("span", { className: "px-ds-03 py-ds-02 text-ds-md text-text-primary", children: e.column.name }) : /* @__PURE__ */ s(oe, { children: [
-        /* @__PURE__ */ t(de, { asChild: !0, children: /* @__PURE__ */ s(
+      b("visibility", a);
+    }, q = C || qs;
+    return /* @__PURE__ */ t("div", { ref: l, className: p("space-y-ds-01", D), ...I, children: [
+      /* @__PURE__ */ e(O, { icon: os, label: "Column", children: x && !(d != null && d.includes("columnId")) ? /* @__PURE__ */ e("span", { className: "px-ds-03 py-ds-02 text-ds-md text-surface-fg", children: s.column.name }) : /* @__PURE__ */ t(de, { children: [
+        /* @__PURE__ */ e(ue, { asChild: !0, children: /* @__PURE__ */ t(
           "button",
           {
             type: "button",
-            className: "inline-flex items-center gap-ds-02b rounded-ds-md px-ds-03 py-ds-02 text-ds-md text-text-primary transition-colors hover:bg-field",
+            className: "inline-flex items-center gap-ds-02b rounded-ds-md px-ds-03 py-ds-02 text-ds-md text-surface-fg transition-colors hover:bg-surface-3",
             children: [
-              /* @__PURE__ */ t("span", { children: e.column.name }),
-              /* @__PURE__ */ t(Je, { className: "h-3 w-3 text-text-placeholder" })
+              /* @__PURE__ */ e("span", { children: s.column.name }),
+              /* @__PURE__ */ e(ds, { className: "h-3 w-3 text-surface-fg-subtle" })
             ]
           }
         ) }),
-        /* @__PURE__ */ t(
-          ce,
+        /* @__PURE__ */ e(
+          me,
           {
-            className: "w-[180px] border-border bg-layer-01 p-ds-02",
+            className: "w-[180px] border-surface-border-strong bg-surface-1 p-ds-02",
             align: "start",
             sideOffset: 4,
-            children: b.map((i) => /* @__PURE__ */ s(
+            children: g.map((a) => /* @__PURE__ */ t(
               "button",
               {
                 type: "button",
-                onClick: () => T(i.id),
-                className: N(
+                onClick: () => T(a.id),
+                className: p(
                   "flex w-full items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b text-left text-ds-md transition-colors",
-                  "hover:bg-field",
-                  i.id === e.columnId ? "text-interactive" : "text-text-primary"
+                  "hover:bg-surface-3",
+                  a.id === s.columnId ? "text-accent-11" : "text-surface-fg"
                 ),
                 children: [
-                  i.name,
-                  i.id === e.columnId && /* @__PURE__ */ t(fe, { className: "ml-auto h-ico-sm w-ico-sm" })
+                  a.name,
+                  a.id === s.columnId && /* @__PURE__ */ e(xe, { className: "ml-auto h-ico-sm w-ico-sm" })
                 ]
               },
-              i.id
+              a.id
             ))
           }
         )
       ] }) }),
-      !f && /* @__PURE__ */ t(_, { icon: Qe, label: "Owner", children: /* @__PURE__ */ t(
-        X,
+      !x && /* @__PURE__ */ e(O, { icon: us, label: "Owner", children: /* @__PURE__ */ e(
+        ee,
         {
           members: E,
-          selectedIds: e.ownerId ? [e.ownerId] : [],
-          onSelect: R,
-          children: /* @__PURE__ */ t(
+          selectedIds: s.ownerId ? [s.ownerId] : [],
+          onSelect: S,
+          children: /* @__PURE__ */ e(
             "button",
             {
               type: "button",
-              className: "inline-flex items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02 transition-colors hover:bg-field",
-              children: e.owner ? /* @__PURE__ */ s(xe, { children: [
-                /* @__PURE__ */ s(j, { className: "h-ico-md w-ico-md", children: [
-                  e.owner.image && /* @__PURE__ */ t(V, { src: e.owner.image, alt: e.owner.name }),
-                  /* @__PURE__ */ t($, { className: "bg-layer-03 text-ds-xs font-semibold text-text-on-color", children: G(e.owner.name) })
+              className: "inline-flex items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02 transition-colors hover:bg-surface-3",
+              children: s.owner ? /* @__PURE__ */ t(be, { children: [
+                /* @__PURE__ */ t(j, { className: "h-ico-md w-ico-md", children: [
+                  s.owner.image && /* @__PURE__ */ e(H, { src: s.owner.image, alt: s.owner.name }),
+                  /* @__PURE__ */ e(G, { className: "bg-surface-3 text-ds-xs font-semibold text-accent-fg", children: B(s.owner.name) })
                 ] }),
-                /* @__PURE__ */ t("span", { className: "text-ds-md text-text-primary", children: e.owner.name })
-              ] }) : /* @__PURE__ */ t("span", { className: "text-ds-md text-text-placeholder", children: "No owner" })
+                /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg", children: s.owner.name })
+              ] }) : /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg-subtle", children: "No owner" })
             }
           )
         }
       ) }),
-      /* @__PURE__ */ t(_, { icon: Ue, label: "Assignees", children: /* @__PURE__ */ s("div", { className: "flex flex-wrap items-center gap-ds-02b", children: [
-        e.assignees.map((i) => /* @__PURE__ */ s(
+      /* @__PURE__ */ e(O, { icon: ms, label: "Assignees", children: /* @__PURE__ */ t("div", { className: "flex flex-wrap items-center gap-ds-02b", children: [
+        s.assignees.map((a) => /* @__PURE__ */ t(
           "div",
           {
-            className: "inline-flex items-center gap-ds-02 rounded-ds-full bg-layer-02 py-ds-01 pl-ds-01 pr-ds-03",
+            className: "inline-flex items-center gap-ds-02 rounded-ds-full bg-surface-2 py-ds-01 pl-ds-01 pr-ds-03",
             children: [
-              /* @__PURE__ */ s(j, { className: "h-ico-sm w-ico-sm", children: [
-                i.user.image && /* @__PURE__ */ t(V, { src: i.user.image, alt: i.user.name }),
-                /* @__PURE__ */ t($, { className: "bg-layer-03 text-ds-xs font-semibold text-text-on-color", children: G(i.user.name) })
+              /* @__PURE__ */ t(j, { className: "h-ico-sm w-ico-sm", children: [
+                a.user.image && /* @__PURE__ */ e(H, { src: a.user.image, alt: a.user.name }),
+                /* @__PURE__ */ e(G, { className: "bg-surface-3 text-ds-xs font-semibold text-accent-fg", children: B(a.user.name) })
               ] }),
-              /* @__PURE__ */ t("span", { className: "text-ds-sm text-text-secondary", children: i.user.name.split(" ")[0] }),
-              !f && /* @__PURE__ */ t(
+              /* @__PURE__ */ e("span", { className: "text-ds-sm text-surface-fg-muted", children: a.user.name.split(" ")[0] }),
+              !x && /* @__PURE__ */ e(
                 "button",
                 {
                   type: "button",
-                  onClick: () => g(i.user.id),
-                  className: "ml-ds-01 rounded-ds-full p-ds-01 transition-colors hover:bg-field",
-                  "aria-label": `Remove ${i.user.name}`,
-                  children: /* @__PURE__ */ t(Y, { className: "h-ds-03 w-ds-03 text-text-placeholder" })
+                  onClick: () => y(a.user.id),
+                  className: "ml-ds-01 rounded-ds-full p-ds-01 transition-colors hover:bg-surface-3",
+                  "aria-label": `Remove ${a.user.name}`,
+                  children: /* @__PURE__ */ e(W, { className: "h-ds-03 w-ds-03 text-surface-fg-subtle" })
                 }
               )
             ]
           },
-          i.user.id
+          a.user.id
         )),
-        !f && /* @__PURE__ */ t(
-          X,
+        !x && /* @__PURE__ */ e(
+          ee,
           {
             members: E,
             selectedIds: u,
-            onSelect: A,
+            onSelect: _,
             multiple: !0,
-            children: /* @__PURE__ */ t(
+            children: /* @__PURE__ */ e(
               "button",
               {
                 type: "button",
-                className: "inline-flex h-ico-md w-ico-md items-center justify-center rounded-ds-full border border-dashed border-border-subtle transition-colors hover:bg-field hover:border-text-placeholder",
+                className: "inline-flex h-ico-md w-ico-md items-center justify-center rounded-ds-full border border-dashed border-surface-border transition-colors hover:bg-surface-3 hover:border-surface-border",
                 "aria-label": "Add assignee",
-                children: /* @__PURE__ */ t(H, { className: "h-3 w-3 text-text-placeholder" })
+                children: /* @__PURE__ */ e($, { className: "h-3 w-3 text-surface-fg-subtle" })
               }
             )
           }
         ),
-        f && e.assignees.length === 0 && /* @__PURE__ */ t("span", { className: "text-ds-md text-text-placeholder", children: "None" })
+        x && s.assignees.length === 0 && /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg-subtle", children: "None" })
       ] }) }),
-      /* @__PURE__ */ t(_, { icon: be, label: "Priority", children: /* @__PURE__ */ s(oe, { children: [
-        /* @__PURE__ */ t(de, { asChild: !0, children: /* @__PURE__ */ t(
+      /* @__PURE__ */ e(O, { icon: Ne, label: "Priority", children: /* @__PURE__ */ t(de, { children: [
+        /* @__PURE__ */ e(ue, { asChild: !0, children: /* @__PURE__ */ e(
           "button",
           {
             type: "button",
-            className: "rounded-ds-md px-ds-03 py-ds-02 transition-colors hover:bg-field",
-            children: /* @__PURE__ */ t(F, { priority: e.priority })
+            className: "rounded-ds-md px-ds-03 py-ds-02 transition-colors hover:bg-surface-3",
+            children: /* @__PURE__ */ e(q, { priority: s.priority })
           }
         ) }),
-        /* @__PURE__ */ t(
-          ce,
+        /* @__PURE__ */ e(
+          me,
           {
-            className: "w-[160px] border-border bg-layer-01 p-ds-02",
+            className: "w-[160px] border-surface-border-strong bg-surface-1 p-ds-02",
             align: "start",
             sideOffset: 4,
-            children: Ct.map((i) => /* @__PURE__ */ t(
+            children: zs.map((a) => /* @__PURE__ */ e(
               "button",
               {
                 type: "button",
-                onClick: () => S(i),
-                className: N(
+                onClick: () => R(a),
+                className: p(
                   "flex w-full items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b transition-colors",
-                  "hover:bg-field",
-                  i === e.priority && "bg-field"
+                  "hover:bg-surface-3",
+                  a === s.priority && "bg-surface-3"
                 ),
-                children: /* @__PURE__ */ t(F, { priority: i })
+                children: /* @__PURE__ */ e(q, { priority: a })
               },
-              i
+              a
             ))
           }
         )
       ] }) }),
-      /* @__PURE__ */ t(_, { icon: ge, label: "Due Date", children: /* @__PURE__ */ s("div", { className: "flex items-center gap-ds-02", children: [
-        I ? I({
-          value: e.dueDate ? new Date(e.dueDate) : null,
-          onChange: P,
+      /* @__PURE__ */ e(O, { icon: ve, label: "Due Date", children: /* @__PURE__ */ t("div", { className: "flex items-center gap-ds-02", children: [
+        N ? N({
+          value: s.dueDate ? new Date(s.dueDate) : null,
+          onChange: k,
           placeholder: "No due date",
-          className: "h-ds-xs-plus border-none bg-transparent px-ds-03 text-ds-md hover:bg-field"
-        }) : /* @__PURE__ */ t(
+          className: "h-ds-xs-plus border-none bg-transparent px-ds-03 text-ds-md hover:bg-surface-3"
+        }) : /* @__PURE__ */ e(
           "input",
           {
             type: "date",
-            value: e.dueDate ? new Date(e.dueDate).toISOString().split("T")[0] : "",
-            onChange: (i) => P(i.target.value ? new Date(i.target.value) : null),
+            value: s.dueDate ? new Date(s.dueDate).toISOString().split("T")[0] : "",
+            onChange: (a) => k(a.target.value ? new Date(a.target.value) : null),
             "aria-label": "Due date",
-            className: "h-ds-xs-plus border-none bg-transparent px-ds-03 text-ds-md text-text-primary outline-none hover:bg-field rounded-ds-md"
+            className: "h-ds-xs-plus border-none bg-transparent px-ds-03 text-ds-md text-surface-fg outline-none hover:bg-surface-3 rounded-ds-md"
           }
         ),
-        e.dueDate && /* @__PURE__ */ t(
+        s.dueDate && /* @__PURE__ */ e(
           "button",
           {
             type: "button",
-            onClick: () => P(null),
-            className: "rounded-ds-md p-ds-02 transition-colors hover:bg-field",
+            onClick: () => k(null),
+            className: "rounded-ds-md p-ds-02 transition-colors hover:bg-surface-3",
             "aria-label": "Clear due date",
-            children: /* @__PURE__ */ t(Y, { className: "h-3 w-3 text-text-placeholder" })
+            children: /* @__PURE__ */ e(W, { className: "h-3 w-3 text-surface-fg-subtle" })
           }
         )
       ] }) }),
-      /* @__PURE__ */ t(_, { icon: Ne, label: "Labels", children: /* @__PURE__ */ s("div", { className: "flex flex-wrap items-center gap-ds-02b", children: [
-        e.labels.map((i) => /* @__PURE__ */ s(
+      /* @__PURE__ */ e(O, { icon: ye, label: "Labels", children: /* @__PURE__ */ t("div", { className: "flex flex-wrap items-center gap-ds-02b", children: [
+        s.labels.map((a) => /* @__PURE__ */ t(
           "span",
           {
-            className: "inline-flex items-center gap-ds-02 rounded-ds-full bg-interactive/10 px-ds-03 py-ds-01 text-ds-sm font-medium text-interactive",
+            className: "inline-flex items-center gap-ds-02 rounded-ds-full bg-accent-2 px-ds-03 py-ds-01 text-ds-sm font-medium text-accent-11",
             children: [
-              i,
-              !f && /* @__PURE__ */ t(
+              a,
+              !x && /* @__PURE__ */ e(
                 "button",
                 {
                   type: "button",
-                  onClick: () => K(i),
-                  className: "rounded-ds-full p-ds-01 transition-colors hover:bg-field",
-                  "aria-label": `Remove label ${i}`,
-                  children: /* @__PURE__ */ t(Y, { className: "h-ds-03 w-ds-03" })
+                  onClick: () => J(a),
+                  className: "rounded-ds-full p-ds-01 transition-colors hover:bg-surface-3",
+                  "aria-label": `Remove label ${a}`,
+                  children: /* @__PURE__ */ e(W, { className: "h-ds-03 w-ds-03" })
                 }
               )
             ]
           },
-          i
+          a
         )),
-        !f && (l ? /* @__PURE__ */ t("div", { className: "inline-flex items-center gap-ds-02", children: /* @__PURE__ */ t(
+        !x && (c ? /* @__PURE__ */ e("div", { className: "inline-flex items-center gap-ds-02", children: /* @__PURE__ */ e(
           "input",
           {
             type: "text",
-            value: w,
-            onChange: (i) => o(i.target.value),
+            value: v,
+            onChange: (a) => i(a.target.value),
             "aria-label": "New label name",
-            onKeyDown: (i) => {
-              i.key === "Enter" && k(), i.key === "Escape" && (h(!1), o(""));
+            onKeyDown: (a) => {
+              a.key === "Enter" && z(), a.key === "Escape" && (f(!1), i(""));
             },
-            onBlur: k,
+            onBlur: z,
             placeholder: "Label name",
-            className: "h-5 w-20 rounded border border-border bg-transparent px-ds-02b text-ds-sm text-text-primary outline-none placeholder:text-text-placeholder focus:border-border-subtle",
+            className: "h-5 w-20 rounded border border-surface-border-strong bg-transparent px-ds-02b text-ds-sm text-surface-fg outline-none placeholder:text-surface-fg-subtle focus:border-surface-border",
             autoFocus: !0
           }
-        ) }) : /* @__PURE__ */ t(
+        ) }) : /* @__PURE__ */ e(
           "button",
           {
             type: "button",
-            onClick: () => h(!0),
-            className: "inline-flex h-ico-md w-ico-md items-center justify-center rounded-ds-full border border-dashed border-border-subtle transition-colors hover:bg-field hover:border-text-placeholder",
+            onClick: () => f(!0),
+            className: "inline-flex h-ico-md w-ico-md items-center justify-center rounded-ds-full border border-dashed border-surface-border transition-colors hover:bg-surface-3 hover:border-surface-border",
             "aria-label": "Add label",
-            children: /* @__PURE__ */ t(H, { className: "h-3 w-3 text-text-placeholder" })
+            children: /* @__PURE__ */ e($, { className: "h-3 w-3 text-surface-fg-subtle" })
           }
         )),
-        f && e.labels.length === 0 && /* @__PURE__ */ t("span", { className: "text-ds-md text-text-placeholder", children: "None" })
+        x && s.labels.length === 0 && /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg-subtle", children: "None" })
       ] }) }),
-      !f && /* @__PURE__ */ t(_, { icon: ye, label: "Visibility", children: /* @__PURE__ */ s(
+      !x && /* @__PURE__ */ e(O, { icon: we, label: "Visibility", children: /* @__PURE__ */ t(
         "button",
         {
           type: "button",
-          onClick: W,
-          className: N(
+          onClick: M,
+          className: p(
             "inline-flex items-center gap-ds-02b rounded-ds-full px-ds-03 py-ds-01 text-ds-sm font-semibold tracking-wide transition-colors",
-            e.visibility === "EVERYONE" ? "bg-success-surface text-text-success" : "bg-layer-02 text-text-tertiary"
+            s.visibility === "EVERYONE" ? "bg-success-3 text-success-11" : "bg-surface-2 text-surface-fg-subtle"
           ),
           children: [
-            /* @__PURE__ */ t(
+            /* @__PURE__ */ e(
               "span",
               {
-                className: N(
+                className: p(
                   "h-ds-02b w-ds-02b rounded-ds-full",
-                  e.visibility === "EVERYONE" ? "bg-success" : "bg-icon-disabled"
+                  s.visibility === "EVERYONE" ? "bg-success-9" : "bg-disabled"
                 )
               }
             ),
-            e.visibility === "EVERYONE" ? "Everyone" : "Internal"
+            s.visibility === "EVERYONE" ? "Everyone" : "Internal"
           ]
         }
       ) })
     ] });
   }
 );
-Ee.displayName = "TaskProperties";
-const Te = p.forwardRef(
+Te.displayName = "TaskProperties";
+const Re = o.forwardRef(
   function({
-    subtasks: e,
-    terminalColumnId: b,
-    onCreateSubtask: x,
-    onToggleSubtask: d,
-    onClickSubtask: c,
-    className: g,
-    readOnly: D = !1
-  }, f) {
-    const [m, y] = p.useState(""), [I, v] = p.useState(!1), a = p.useRef(null), w = e.filter(
+    subtasks: s,
+    terminalColumnId: g,
+    onCreateSubtask: h,
+    onToggleSubtask: b,
+    onClickSubtask: m,
+    className: y,
+    readOnly: D = !1,
+    ...x
+  }, d) {
+    const [C, N] = o.useState(""), [w, I] = o.useState(!1), l = o.useRef(null), v = s.filter(
       (u) => {
         var E;
-        return ((E = u.column) == null ? void 0 : E.isTerminal) || u.columnId === b;
+        return ((E = u.column) == null ? void 0 : E.isTerminal) || u.columnId === g;
       }
-    ).length, o = e.length, l = () => {
-      const u = m.trim();
-      u && (x(u), y(""));
-    }, h = (u) => {
-      u.key === "Enter" && (u.preventDefault(), l()), u.key === "Escape" && (v(!1), y(""));
+    ).length, i = s.length, c = () => {
+      const u = C.trim();
+      u && (h(u), N(""));
+    }, f = (u) => {
+      u.key === "Enter" && (u.preventDefault(), c()), u.key === "Escape" && (I(!1), N(""));
     };
-    return p.useEffect(() => {
-      I && a.current && a.current.focus();
-    }, [I]), /* @__PURE__ */ s("div", { ref: f, className: N("flex flex-col", g), children: [
-      o > 0 && /* @__PURE__ */ s("div", { className: "mb-ds-05 flex items-center gap-ds-04", children: [
-        /* @__PURE__ */ t(qe, { value: o > 0 ? w / o * 100 : 0, className: "h-ds-02b" }),
-        /* @__PURE__ */ s("span", { className: "shrink-0 text-ds-sm font-medium text-text-placeholder", children: [
-          w,
+    return o.useEffect(() => {
+      w && l.current && l.current.focus();
+    }, [w]), /* @__PURE__ */ t("div", { ref: d, className: p("flex flex-col", y), ...x, children: [
+      i > 0 && /* @__PURE__ */ t("div", { className: "mb-ds-05 flex items-center gap-ds-04", children: [
+        /* @__PURE__ */ e(cs, { value: i > 0 ? v / i * 100 : 0, className: "h-ds-02b" }),
+        /* @__PURE__ */ t("span", { className: "shrink-0 text-ds-sm font-medium text-surface-fg-subtle", children: [
+          v,
           "/",
-          o
+          i
         ] })
       ] }),
-      e.length > 0 ? /* @__PURE__ */ t("div", { className: "space-y-ds-01", children: e.map((u) => {
-        var R, A;
-        const E = ((R = u.column) == null ? void 0 : R.isTerminal) || u.columnId === b, T = (A = u.assignees[0]) == null ? void 0 : A.user;
-        return /* @__PURE__ */ s(
+      s.length > 0 ? /* @__PURE__ */ e("div", { className: "space-y-ds-01", children: s.map((u) => {
+        var S, _;
+        const E = ((S = u.column) == null ? void 0 : S.isTerminal) || u.columnId === g, T = (_ = u.assignees[0]) == null ? void 0 : _.user;
+        return /* @__PURE__ */ t(
           "div",
           {
             role: "button",
             tabIndex: 0,
-            className: N(
+            className: p(
               "group flex items-center gap-ds-03 rounded-ds-lg px-ds-03 py-ds-02b transition-colors",
-              "hover:bg-field cursor-pointer"
+              "hover:bg-surface-3 cursor-pointer"
             ),
-            onClick: () => c == null ? void 0 : c(u.id),
-            onKeyDown: (S) => {
-              (S.key === "Enter" || S.key === " ") && (S.preventDefault(), c == null || c(u.id));
+            onClick: () => m == null ? void 0 : m(u.id),
+            onKeyDown: (R) => {
+              (R.key === "Enter" || R.key === " ") && (R.preventDefault(), m == null || m(u.id));
             },
             children: [
-              /* @__PURE__ */ t(
+              /* @__PURE__ */ e(
                 "button",
                 {
                   type: "button",
-                  onClick: (S) => {
-                    S.stopPropagation(), D || d(u.id, !E);
+                  onClick: (R) => {
+                    R.stopPropagation(), D || b(u.id, !E);
                   },
-                  className: N(
+                  className: p(
                     "shrink-0 rounded p-ds-01 transition-colors",
-                    D ? "cursor-default" : "hover:bg-layer-02"
+                    D ? "cursor-default" : "hover:bg-surface-2"
                   ),
-                  children: E ? /* @__PURE__ */ t(Xe, { className: "h-ico-sm w-ico-sm text-interactive", stroke: 1.5 }) : /* @__PURE__ */ t(Ze, { className: "h-ico-sm w-ico-sm text-text-placeholder", stroke: 1.5 })
+                  children: E ? /* @__PURE__ */ e(fs, { className: "h-ico-sm w-ico-sm text-accent-11", stroke: 1.5 }) : /* @__PURE__ */ e(hs, { className: "h-ico-sm w-ico-sm text-surface-fg-subtle", stroke: 1.5 })
                 }
               ),
-              /* @__PURE__ */ t(
+              /* @__PURE__ */ e(
                 "div",
                 {
-                  className: N(
+                  className: p(
                     "h-2 w-2 shrink-0 rounded-ds-full",
-                    De[u.priority]
+                    Ee[u.priority]
                   )
                 }
               ),
-              /* @__PURE__ */ t(
+              /* @__PURE__ */ e(
                 "span",
                 {
-                  className: N(
+                  className: p(
                     "flex-1 truncate text-ds-md",
-                    E ? "text-text-placeholder line-through" : "text-text-primary"
+                    E ? "text-surface-fg-subtle line-through" : "text-surface-fg"
                   ),
                   children: u.title
                 }
               ),
-              T && /* @__PURE__ */ s(j, { className: "h-ico-md w-ico-md shrink-0", children: [
-                T.image && /* @__PURE__ */ t(V, { src: T.image, alt: T.name }),
-                /* @__PURE__ */ t($, { className: "bg-layer-03 text-ds-xs font-semibold text-text-on-color", children: G(T.name) })
+              T && /* @__PURE__ */ t(j, { className: "h-ico-md w-ico-md shrink-0", children: [
+                T.image && /* @__PURE__ */ e(H, { src: T.image, alt: T.name }),
+                /* @__PURE__ */ e(G, { className: "bg-surface-3 text-ds-xs font-semibold text-accent-fg", children: B(T.name) })
               ] })
             ]
           },
           u.id
         );
-      }) }) : !I && /* @__PURE__ */ t(
-        M,
+      }) }) : !w && /* @__PURE__ */ e(
+        F,
         {
-          icon: /* @__PURE__ */ t(ve, {}),
+          icon: /* @__PURE__ */ e(Ie, {}),
           title: "No subtasks",
           description: "Break this task into smaller pieces",
           compact: !0
         }
       ),
-      !D && (I ? /* @__PURE__ */ s("div", { className: "mt-ds-03 flex items-center gap-ds-03 rounded-ds-lg border border-border bg-layer-01 shadow-01 px-ds-04 py-ds-03", children: [
-        /* @__PURE__ */ t(
+      !D && (w ? /* @__PURE__ */ t("div", { className: "mt-ds-03 flex items-center gap-ds-03 rounded-ds-lg border border-surface-border-strong bg-surface-1 shadow-01 px-ds-04 py-ds-03", children: [
+        /* @__PURE__ */ e(
           "input",
           {
-            ref: a,
+            ref: l,
             type: "text",
-            value: m,
-            onChange: (u) => y(u.target.value),
-            onKeyDown: h,
+            value: C,
+            onChange: (u) => N(u.target.value),
+            onKeyDown: f,
             onBlur: () => {
-              m.trim() || v(!1);
+              C.trim() || I(!1);
             },
             placeholder: "Subtask title...",
-            className: "flex-1 bg-transparent text-ds-md text-text-primary placeholder:text-text-placeholder outline-none"
+            className: "flex-1 bg-transparent text-ds-md text-surface-fg placeholder:text-surface-fg-subtle outline-none"
           }
         ),
-        /* @__PURE__ */ t(
+        /* @__PURE__ */ e(
           "button",
           {
             type: "button",
-            onClick: l,
-            disabled: !m.trim(),
-            className: "inline-flex h-6 items-center gap-ds-02 rounded-ds-md bg-interactive px-ds-03 text-ds-sm font-semibold text-text-on-color transition-colors hover:bg-interactive-hover disabled:opacity-[0.38]",
+            onClick: c,
+            disabled: !C.trim(),
+            className: "inline-flex h-6 items-center gap-ds-02 rounded-ds-md bg-accent-9 px-ds-03 text-ds-sm font-semibold text-accent-fg transition-colors hover:bg-accent-10 disabled:opacity-action-disabled",
             children: "Add"
           }
         )
-      ] }) : /* @__PURE__ */ s(
+      ] }) : /* @__PURE__ */ t(
         "button",
         {
           type: "button",
-          onClick: () => v(!0),
-          className: "mt-ds-03 inline-flex items-center gap-ds-02b rounded-ds-lg px-ds-03 py-ds-02b text-ds-md text-text-placeholder transition-colors hover:bg-field hover:text-text-secondary",
+          onClick: () => I(!0),
+          className: "mt-ds-03 inline-flex items-center gap-ds-02b rounded-ds-lg px-ds-03 py-ds-02b text-ds-md text-surface-fg-subtle transition-colors hover:bg-surface-3 hover:text-surface-fg-muted",
           children: [
-            /* @__PURE__ */ t(H, { className: "h-ico-sm w-ico-sm", stroke: 1.5 }),
+            /* @__PURE__ */ e($, { className: "h-ico-sm w-ico-sm", stroke: 1.5 }),
             "Add subtask"
           ]
         }
@@ -482,8 +485,8 @@ const Te = p.forwardRef(
     ] });
   }
 );
-Te.displayName = "SubtasksTab";
-function At(n) {
+Re.displayName = "SubtasksTab";
+function Ys(n) {
   return new Date(n).toLocaleDateString("en-IN", {
     month: "short",
     day: "numeric",
@@ -491,144 +494,145 @@ function At(n) {
     minute: "2-digit"
   });
 }
-const St = [
-  { status: "APPROVED", label: "Approve", icon: fe },
-  { status: "CHANGES_REQUESTED", label: "Request Changes", icon: we },
-  { status: "REJECTED", label: "Reject", icon: Y }
-], Ce = p.forwardRef(
+const Ks = [
+  { status: "APPROVED", label: "Approve", icon: xe },
+  { status: "CHANGES_REQUESTED", label: "Request Changes", icon: Ce },
+  { status: "REJECTED", label: "Reject", icon: W }
+], Ae = o.forwardRef(
   function({
-    reviews: e,
-    members: b,
-    onRequestReview: x,
-    onUpdateStatus: d,
-    className: c
-  }, g) {
-    const [D, f] = p.useState({}), [m, y] = p.useState(null), I = p.useMemo(
-      () => b.map((a) => ({ id: a.id, name: a.name, avatar: a.image ?? void 0 })),
-      [b]
-    ), v = (a, w) => {
-      d(a, w, D[a]), f((o) => {
-        const l = { ...o };
-        return delete l[a], l;
-      }), y(null);
+    reviews: s,
+    members: g,
+    onRequestReview: h,
+    onUpdateStatus: b,
+    className: m,
+    ...y
+  }, D) {
+    const [x, d] = o.useState({}), [C, N] = o.useState(null), w = o.useMemo(
+      () => g.map((l) => ({ id: l.id, name: l.name, avatar: l.image ?? void 0 })),
+      [g]
+    ), I = (l, v) => {
+      b(l, v, x[l]), d((i) => {
+        const c = { ...i };
+        return delete c[l], c;
+      }), N(null);
     };
-    return /* @__PURE__ */ s("div", { ref: g, className: N("flex flex-col", c), children: [
-      e.length > 0 ? /* @__PURE__ */ t("div", { className: "space-y-ds-04", children: e.map((a) => {
-        const w = Tt[a.status], o = m === a.id;
-        return /* @__PURE__ */ s(
+    return /* @__PURE__ */ t("div", { ref: D, className: p("flex flex-col", m), ...y, children: [
+      s.length > 0 ? /* @__PURE__ */ e("div", { className: "space-y-ds-04", children: s.map((l) => {
+        const v = Fs[l.status], i = C === l.id;
+        return /* @__PURE__ */ t(
           "div",
           {
-            className: "rounded-ds-lg border border-border bg-layer-01 shadow-01 p-ds-04",
+            className: "rounded-ds-lg border border-surface-border-strong bg-surface-1 shadow-01 p-ds-04",
             children: [
-              /* @__PURE__ */ s("div", { className: "flex items-center gap-ds-03", children: [
-                /* @__PURE__ */ s(j, { className: "h-ds-xs w-ds-xs shrink-0", children: [
-                  a.reviewer.image && /* @__PURE__ */ t(
-                    V,
+              /* @__PURE__ */ t("div", { className: "flex items-center gap-ds-03", children: [
+                /* @__PURE__ */ t(j, { className: "h-ds-xs w-ds-xs shrink-0", children: [
+                  l.reviewer.image && /* @__PURE__ */ e(
+                    H,
                     {
-                      src: a.reviewer.image,
-                      alt: a.reviewer.name
+                      src: l.reviewer.image,
+                      alt: l.reviewer.name
                     }
                   ),
-                  /* @__PURE__ */ t($, { className: "bg-layer-03 text-ds-xs font-semibold text-text-on-color", children: G(a.reviewer.name) })
+                  /* @__PURE__ */ e(G, { className: "bg-surface-3 text-ds-xs font-semibold text-accent-fg", children: B(l.reviewer.name) })
                 ] }),
-                /* @__PURE__ */ s("div", { className: "flex-1 min-w-0", children: [
-                  /* @__PURE__ */ t("span", { className: "text-ds-md font-medium text-text-primary", children: a.reviewer.name }),
-                  /* @__PURE__ */ s("span", { className: "ml-ds-03 text-ds-sm text-text-placeholder", children: [
+                /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: [
+                  /* @__PURE__ */ e("span", { className: "text-ds-md font-medium text-surface-fg", children: l.reviewer.name }),
+                  /* @__PURE__ */ t("span", { className: "ml-ds-03 text-ds-sm text-surface-fg-subtle", children: [
                     "requested by ",
-                    a.requestedBy.name
+                    l.requestedBy.name
                   ] })
                 ] }),
-                /* @__PURE__ */ t(
-                  xt,
+                /* @__PURE__ */ e(
+                  Ss,
                   {
-                    color: w.color,
-                    children: w.label
+                    color: v.color,
+                    children: v.label
                   }
                 )
               ] }),
-              a.feedback && /* @__PURE__ */ t("div", { className: "mt-ds-03 rounded-ds-md bg-layer-02 px-ds-04 py-ds-03", children: /* @__PURE__ */ t("p", { className: "text-ds-sm text-text-secondary", children: a.feedback }) }),
-              a.status === "PENDING" && /* @__PURE__ */ t("div", { className: "mt-ds-03", children: o ? /* @__PURE__ */ s("div", { className: "space-y-ds-03", children: [
-                /* @__PURE__ */ t(
+              l.feedback && /* @__PURE__ */ e("div", { className: "mt-ds-03 rounded-ds-md bg-surface-2 px-ds-04 py-ds-03", children: /* @__PURE__ */ e("p", { className: "text-ds-sm text-surface-fg-muted", children: l.feedback }) }),
+              l.status === "PENDING" && /* @__PURE__ */ e("div", { className: "mt-ds-03", children: i ? /* @__PURE__ */ t("div", { className: "space-y-ds-03", children: [
+                /* @__PURE__ */ e(
                   "textarea",
                   {
-                    value: D[a.id] || "",
-                    onChange: (l) => f((h) => ({
-                      ...h,
-                      [a.id]: l.target.value
+                    value: x[l.id] || "",
+                    onChange: (c) => d((f) => ({
+                      ...f,
+                      [l.id]: c.target.value
                     })),
                     placeholder: "Add feedback (optional)...",
                     rows: 2,
-                    className: "w-full resize-none rounded-ds-md border border-border bg-transparent px-ds-03 py-ds-03 text-ds-sm text-text-primary placeholder:text-text-placeholder outline-none focus:border-border-subtle"
+                    className: "w-full resize-none rounded-ds-md border border-surface-border-strong bg-transparent px-ds-03 py-ds-03 text-ds-sm text-surface-fg placeholder:text-surface-fg-subtle outline-none focus:border-surface-border"
                   }
                 ),
-                /* @__PURE__ */ s("div", { className: "flex items-center gap-ds-02b", children: [
-                  St.map((l) => {
-                    const h = l.icon;
-                    return /* @__PURE__ */ s(
+                /* @__PURE__ */ t("div", { className: "flex items-center gap-ds-02b", children: [
+                  Ks.map((c) => {
+                    const f = c.icon;
+                    return /* @__PURE__ */ t(
                       "button",
                       {
                         type: "button",
-                        onClick: () => v(a.id, l.status),
-                        className: N(
+                        onClick: () => I(l.id, c.status),
+                        className: p(
                           "inline-flex items-center gap-ds-02 rounded-ds-md px-ds-03 py-ds-02 text-ds-sm font-semibold transition-colors",
-                          l.status === "APPROVED" && "bg-success-surface text-text-success hover:opacity-[0.9]",
-                          l.status === "CHANGES_REQUESTED" && "bg-warning-surface text-text-warning hover:opacity-[0.9]",
-                          l.status === "REJECTED" && "bg-error-surface text-text-error hover:opacity-[0.9]"
+                          c.status === "APPROVED" && "bg-success-3 text-success-11 hover:opacity-90",
+                          c.status === "CHANGES_REQUESTED" && "bg-warning-3 text-warning-11 hover:opacity-90",
+                          c.status === "REJECTED" && "bg-error-3 text-error-11 hover:opacity-90"
                         ),
                         children: [
-                          /* @__PURE__ */ t(h, { className: "h-3 w-3", stroke: 2 }),
-                          l.label
+                          /* @__PURE__ */ e(f, { className: "h-3 w-3", stroke: 2 }),
+                          c.label
                         ]
                       },
-                      l.status
+                      c.status
                     );
                   }),
-                  /* @__PURE__ */ t(
+                  /* @__PURE__ */ e(
                     "button",
                     {
                       type: "button",
-                      onClick: () => y(null),
-                      className: "ml-auto text-ds-sm text-text-placeholder hover:text-text-secondary",
+                      onClick: () => N(null),
+                      className: "ml-auto text-ds-sm text-surface-fg-subtle hover:text-surface-fg-muted",
                       children: "Cancel"
                     }
                   )
                 ] })
-              ] }) : /* @__PURE__ */ t(
+              ] }) : /* @__PURE__ */ e(
                 "button",
                 {
                   type: "button",
-                  onClick: () => y(a.id),
-                  className: "text-ds-sm font-medium text-interactive transition-colors hover:underline",
+                  onClick: () => N(l.id),
+                  className: "text-ds-sm font-medium text-accent-11 transition-colors hover:underline",
                   children: "Respond"
                 }
               ) }),
-              /* @__PURE__ */ t("p", { className: "mt-ds-03 text-ds-xs text-text-placeholder", children: At(a.createdAt) })
+              /* @__PURE__ */ e("p", { className: "mt-ds-03 text-ds-xs text-surface-fg-subtle", children: Ys(l.createdAt) })
             ]
           },
-          a.id
+          l.id
         );
-      }) }) : /* @__PURE__ */ t(
-        M,
+      }) }) : /* @__PURE__ */ e(
+        F,
         {
-          icon: /* @__PURE__ */ t(Z, {}),
+          icon: /* @__PURE__ */ e(se, {}),
           title: "No reviews yet",
           description: "Request a review from a team member",
           compact: !0
         }
       ),
-      /* @__PURE__ */ t(
-        X,
+      /* @__PURE__ */ e(
+        ee,
         {
-          members: I,
+          members: w,
           selectedIds: [],
-          onSelect: (a) => x(a),
-          children: /* @__PURE__ */ s(
+          onSelect: (l) => h(l),
+          children: /* @__PURE__ */ t(
             "button",
             {
               type: "button",
-              className: "mt-ds-04 inline-flex items-center gap-ds-02b rounded-ds-lg px-ds-03 py-ds-02b text-ds-md text-text-placeholder transition-colors hover:bg-field hover:text-text-secondary",
+              className: "mt-ds-04 inline-flex items-center gap-ds-02b rounded-ds-lg px-ds-03 py-ds-02b text-ds-md text-surface-fg-subtle transition-colors hover:bg-surface-3 hover:text-surface-fg-muted",
               children: [
-                /* @__PURE__ */ t(H, { className: "h-ico-sm w-ico-sm", stroke: 1.5 }),
+                /* @__PURE__ */ e($, { className: "h-ico-sm w-ico-sm", stroke: 1.5 }),
                 "Request Review"
               ]
             }
@@ -638,17 +642,17 @@ const St = [
     ] });
   }
 );
-Ce.displayName = "ReviewTab";
-function Pt(n) {
-  const e = new Date(n), x = (/* @__PURE__ */ new Date()).getTime() - e.getTime(), d = Math.floor(x / 6e4), c = Math.floor(d / 60), g = Math.floor(c / 24);
-  return d < 1 ? "Just now" : d < 60 ? `${d}m ago` : c < 24 ? `${c}h ago` : g < 7 ? `${g}d ago` : e.toLocaleDateString("en-IN", {
+Ae.displayName = "ReviewTab";
+function Se(n) {
+  const s = new Date(n), h = (/* @__PURE__ */ new Date()).getTime() - s.getTime();
+  return Math.floor(h / 864e5) < 7 ? Ls(n) : s.toLocaleDateString("en-IN", {
     month: "short",
     day: "numeric",
     hour: "numeric",
     minute: "2-digit"
   });
 }
-function Lt(n) {
+function Ws(n) {
   return n.authorType === "INTERNAL" && n.internalAuthor ? n.internalAuthor : n.authorType === "CLIENT" && n.clientAuthor ? {
     id: n.clientAuthor.id,
     name: n.clientAuthor.name,
@@ -656,106 +660,107 @@ function Lt(n) {
     image: null
   } : { id: n.authorId, name: "Unknown", image: null };
 }
-function Ot(n) {
+function Js(n) {
   return n.replace(/<[^>]*>/g, "");
 }
-const Re = p.forwardRef(
+const ke = o.forwardRef(
   function({
-    comments: e,
-    taskVisibility: b,
-    onPostComment: x,
-    className: d,
-    clientMode: c = !1,
-    richText: g = !0,
+    comments: s,
+    taskVisibility: g,
+    onPostComment: h,
+    className: b,
+    clientMode: m = !1,
+    richText: y = !0,
     renderEditor: D,
-    renderViewer: f
-  }, m) {
-    const [y, I] = p.useState(""), v = p.useRef(null), a = D ?? (g ? (l) => /* @__PURE__ */ t(
-      bt,
+    renderViewer: x,
+    ...d
+  }, C) {
+    const [N, w] = o.useState(""), I = o.useRef(null), l = D ?? (y ? (c) => /* @__PURE__ */ e(
+      Ps,
       {
-        content: l.content,
-        onChange: l.onChange,
-        placeholder: l.placeholder,
+        content: c.content,
+        onChange: c.onChange,
+        placeholder: c.placeholder,
         editable: !0,
         className: "min-h-[80px]"
       }
-    ) : void 0), w = f ?? (g ? (l) => /* @__PURE__ */ t(ft, { content: l.content, className: l.className }) : void 0), o = () => {
-      const l = y.trim();
-      l.replace(/<[^>]*>/g, "").trim() && (x(l, c ? "CLIENT" : "INTERNAL"), I(""));
+    ) : void 0), v = x ?? (y ? (c) => /* @__PURE__ */ e(ks, { content: c.content, className: c.className }) : void 0), i = () => {
+      const c = N.trim();
+      c.replace(/<[^>]*>/g, "").trim() && (h(c, m ? "CLIENT" : "INTERNAL"), w(""));
     };
-    return p.useEffect(() => {
-      v.current && (v.current.scrollTop = v.current.scrollHeight);
-    }, [e.length]), /* @__PURE__ */ s("div", { ref: m, className: N("flex flex-col", d), children: [
-      e.length > 0 ? /* @__PURE__ */ t(
+    return o.useEffect(() => {
+      I.current && (I.current.scrollTop = I.current.scrollHeight);
+    }, [s.length]), /* @__PURE__ */ t("div", { ref: C, className: p("flex flex-col", b), ...d, children: [
+      s.length > 0 ? /* @__PURE__ */ e(
         "div",
         {
-          ref: v,
+          ref: I,
           className: "flex-1 space-y-ds-05 overflow-y-auto",
-          children: e.map((l) => {
-            const h = Lt(l), u = l.authorType === "CLIENT";
-            return /* @__PURE__ */ s("div", { className: "flex gap-ds-03", children: [
-              /* @__PURE__ */ s(j, { className: "h-ds-xs-plus w-ds-xs-plus shrink-0 mt-ds-01", children: [
-                h.image && /* @__PURE__ */ t(V, { src: h.image, alt: h.name }),
-                /* @__PURE__ */ t(
-                  $,
+          children: s.map((c) => {
+            const f = Ws(c), u = c.authorType === "CLIENT";
+            return /* @__PURE__ */ t("div", { className: "flex gap-ds-03", children: [
+              /* @__PURE__ */ t(j, { className: "h-ds-xs-plus w-ds-xs-plus shrink-0 mt-ds-01", children: [
+                f.image && /* @__PURE__ */ e(H, { src: f.image, alt: f.name }),
+                /* @__PURE__ */ e(
+                  G,
                   {
-                    className: N(
+                    className: p(
                       "text-ds-xs font-semibold",
                       /* avatar initials — below scale, leave as-is */
-                      u ? "bg-warning-surface text-text-warning" : "bg-layer-03 text-text-on-color"
+                      u ? "bg-warning-3 text-warning-11" : "bg-surface-3 text-accent-fg"
                     ),
-                    children: G(h.name)
+                    children: B(f.name)
                   }
                 )
               ] }),
-              /* @__PURE__ */ s("div", { className: "flex-1 min-w-0", children: [
-                /* @__PURE__ */ s("div", { className: "flex items-baseline gap-ds-03", children: [
-                  /* @__PURE__ */ t("span", { className: "text-ds-md font-medium text-text-primary", children: h.name }),
-                  c ? !u && /* @__PURE__ */ t("span", { className: "rounded bg-layer-03 px-ds-02 py-px text-ds-xs font-semibold uppercase tracking-wider text-text-on-color", children: "Team" }) : u && /* @__PURE__ */ t("span", { className: "rounded bg-warning-surface px-ds-02 py-px text-ds-xs font-semibold uppercase tracking-wider text-text-warning", children: "Client" }),
-                  /* @__PURE__ */ t("span", { className: "text-ds-sm text-text-placeholder", children: Pt(l.createdAt) })
+              /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: [
+                /* @__PURE__ */ t("div", { className: "flex items-baseline gap-ds-03", children: [
+                  /* @__PURE__ */ e("span", { className: "text-ds-md font-medium text-surface-fg", children: f.name }),
+                  m ? !u && /* @__PURE__ */ e("span", { className: "rounded bg-surface-3 px-ds-02 py-px text-ds-xs font-semibold uppercase tracking-wider text-accent-fg", children: "Team" }) : u && /* @__PURE__ */ e("span", { className: "rounded bg-warning-3 px-ds-02 py-px text-ds-xs font-semibold uppercase tracking-wider text-warning-11", children: "Client" }),
+                  /* @__PURE__ */ e("span", { className: "text-ds-sm text-surface-fg-subtle", children: Se(c.createdAt) })
                 ] }),
-                /* @__PURE__ */ t("div", { className: "mt-ds-02", children: w ? w({
-                  content: l.content,
+                /* @__PURE__ */ e("div", { className: "mt-ds-02", children: v ? v({
+                  content: c.content,
                   className: "[&_.ProseMirror]:!min-h-0 [&_.ProseMirror]:!p-0"
-                }) : /* @__PURE__ */ t("p", { className: "text-ds-md text-text-secondary whitespace-pre-wrap", children: Ot(l.content) }) })
+                }) : /* @__PURE__ */ e("p", { className: "text-ds-md text-surface-fg-muted whitespace-pre-wrap", children: Js(c.content) }) })
               ] })
-            ] }, l.id);
+            ] }, c.id);
           })
         }
-      ) : /* @__PURE__ */ t(
-        M,
+      ) : /* @__PURE__ */ e(
+        F,
         {
-          icon: /* @__PURE__ */ t(Ie, {}),
+          icon: /* @__PURE__ */ e(De, {}),
           title: "No comments yet",
           description: "Start a conversation about this task",
           compact: !0
         }
       ),
-      /* @__PURE__ */ s("div", { className: "mt-ds-05 space-y-ds-03", children: [
-        b === "EVERYONE" && !c && /* @__PURE__ */ t("p", { className: "text-ds-xs text-text-warning", children: "This task is visible to clients. Comments may be seen by external users." }),
-        a ? a({
-          content: y,
-          onChange: I,
+      /* @__PURE__ */ t("div", { className: "mt-ds-05 space-y-ds-03", children: [
+        g === "EVERYONE" && !m && /* @__PURE__ */ e("p", { className: "text-ds-xs text-warning-11", children: "This task is visible to clients. Comments may be seen by external users." }),
+        l ? l({
+          content: N,
+          onChange: w,
           placeholder: "Write a comment..."
-        }) : /* @__PURE__ */ t(
+        }) : /* @__PURE__ */ e(
           "textarea",
           {
-            value: y,
-            onChange: (l) => I(l.target.value),
+            value: N,
+            onChange: (c) => w(c.target.value),
             placeholder: "Write a comment...",
             rows: 3,
-            className: "w-full resize-none rounded-ds-md border border-border bg-transparent px-ds-04 py-ds-03 text-ds-md text-text-primary placeholder:text-text-placeholder outline-none focus:border-border-subtle"
+            className: "w-full resize-none rounded-ds-md border border-surface-border-strong bg-transparent px-ds-04 py-ds-03 text-ds-md text-surface-fg placeholder:text-surface-fg-subtle outline-none focus:border-surface-border"
           }
         ),
-        /* @__PURE__ */ t("div", { className: "flex justify-end", children: /* @__PURE__ */ s(
+        /* @__PURE__ */ e("div", { className: "flex justify-end", children: /* @__PURE__ */ t(
           "button",
           {
             type: "button",
-            onClick: o,
-            disabled: !y.replace(/<[^>]*>/g, "").trim(),
-            className: "inline-flex items-center gap-ds-02b rounded-ds-lg bg-interactive px-ds-04 py-ds-02b text-ds-sm font-semibold text-text-on-color transition-colors hover:bg-interactive-hover disabled:opacity-[0.38] disabled:cursor-not-allowed",
+            onClick: i,
+            disabled: !N.replace(/<[^>]*>/g, "").trim(),
+            className: "inline-flex items-center gap-ds-02b rounded-ds-lg bg-accent-9 px-ds-04 py-ds-02b text-ds-sm font-semibold text-accent-fg transition-colors hover:bg-accent-10 disabled:opacity-action-disabled disabled:cursor-not-allowed",
             children: [
-              /* @__PURE__ */ t(et, { className: "h-ico-sm w-ico-sm", stroke: 2 }),
+              /* @__PURE__ */ e(ps, { className: "h-ico-sm w-ico-sm", stroke: 2 }),
               "Comment"
             ]
           }
@@ -764,169 +769,170 @@ const Re = p.forwardRef(
     ] });
   }
 );
-Re.displayName = "ConversationTab";
-function _t(n) {
-  if (!n) return me;
-  const e = n.toLowerCase();
-  return ["jpg", "jpeg", "png", "gif", "svg", "webp", "bmp"].includes(e) ? it : ["pdf", "doc", "docx", "txt", "rtf"].includes(e) ? lt : ["js", "ts", "jsx", "tsx", "py", "rb", "go", "rs", "html", "css", "json"].includes(e) ? at : ["xls", "xlsx", "csv"].includes(e) ? ot : ["zip", "tar", "gz", "rar", "7z"].includes(e) ? dt : me;
+ke.displayName = "ConversationTab";
+function Ms(n) {
+  if (!n) return fe;
+  const s = n.toLowerCase();
+  return ["jpg", "jpeg", "png", "gif", "svg", "webp", "bmp"].includes(s) ? vs : ["pdf", "doc", "docx", "txt", "rtf"].includes(s) ? ys : ["js", "ts", "jsx", "tsx", "py", "rb", "go", "rs", "html", "css", "json"].includes(s) ? ws : ["xls", "xlsx", "csv"].includes(s) ? Is : ["zip", "tar", "gz", "rar", "7z"].includes(s) ? Cs : fe;
 }
-function kt(n) {
+function Qs(n) {
   return new Date(n).toLocaleDateString("en-IN", {
     month: "short",
     day: "numeric",
     year: "numeric"
   });
 }
-const Ae = p.forwardRef(
+const Pe = o.forwardRef(
   function({
-    files: e,
-    onUpload: b,
-    onDelete: x,
-    isUploading: d = !1,
-    className: c,
-    readOnly: g = !1
-  }, D) {
-    const f = p.useRef(null), [m, y] = p.useState(!1), I = (o) => {
-      var h;
-      const l = (h = o.target.files) == null ? void 0 : h[0];
-      l && b(l), f.current && (f.current.value = "");
-    }, v = (o) => {
-      var h;
-      o.preventDefault(), y(!1);
-      const l = (h = o.dataTransfer.files) == null ? void 0 : h[0];
-      l && b(l);
-    }, a = (o) => {
-      o.preventDefault(), y(!0);
-    }, w = () => {
-      y(!1);
+    files: s,
+    onUpload: g,
+    onDelete: h,
+    isUploading: b = !1,
+    className: m,
+    readOnly: y = !1,
+    ...D
+  }, x) {
+    const d = o.useRef(null), [C, N] = o.useState(!1), w = (i) => {
+      var f;
+      const c = (f = i.target.files) == null ? void 0 : f[0];
+      c && g(c), d.current && (d.current.value = "");
+    }, I = (i) => {
+      var f;
+      i.preventDefault(), N(!1);
+      const c = (f = i.dataTransfer.files) == null ? void 0 : f[0];
+      c && g(c);
+    }, l = (i) => {
+      i.preventDefault(), N(!0);
+    }, v = () => {
+      N(!1);
     };
-    return /* @__PURE__ */ s("div", { ref: D, className: N("flex flex-col", c), children: [
-      !g && /* @__PURE__ */ s(
+    return /* @__PURE__ */ t("div", { ref: x, className: p("flex flex-col", m), ...D, children: [
+      !y && /* @__PURE__ */ t(
         "div",
         {
           role: "region",
           "aria-label": "File upload drop zone",
-          onDrop: v,
-          onDragOver: a,
-          onDragLeave: w,
-          className: N(
+          onDrop: I,
+          onDragOver: l,
+          onDragLeave: v,
+          className: p(
             "rounded-ds-lg border-2 border-dashed transition-colors",
-            m ? "border-interactive bg-interactive/5" : "border-border"
+            C ? "border-accent-7 bg-accent-1" : "border-surface-border-strong"
           ),
           children: [
-            /* @__PURE__ */ s("div", { className: "flex flex-col items-center gap-ds-03 py-ds-06", children: [
-              /* @__PURE__ */ t("div", { className: "flex h-ds-sm-plus w-ds-sm-plus items-center justify-center rounded-ds-lg bg-layer-02", children: /* @__PURE__ */ t(
-                tt,
+            /* @__PURE__ */ t("div", { className: "flex flex-col items-center gap-ds-03 py-ds-06", children: [
+              /* @__PURE__ */ e("div", { className: "flex h-ds-sm-plus w-ds-sm-plus items-center justify-center rounded-ds-lg bg-surface-2", children: /* @__PURE__ */ e(
+                gs,
                 {
-                  className: "h-ico-sm w-ico-sm text-text-placeholder",
+                  className: "h-ico-sm w-ico-sm text-surface-fg-subtle",
                   stroke: 1.5
                 }
               ) }),
-              /* @__PURE__ */ s("div", { className: "text-center", children: [
-                /* @__PURE__ */ t(
+              /* @__PURE__ */ t("div", { className: "text-center", children: [
+                /* @__PURE__ */ e(
                   "button",
                   {
                     type: "button",
                     onClick: () => {
-                      var o;
-                      return (o = f.current) == null ? void 0 : o.click();
+                      var i;
+                      return (i = d.current) == null ? void 0 : i.click();
                     },
-                    disabled: d,
-                    className: "text-ds-md font-medium text-interactive transition-colors hover:underline disabled:opacity-[0.38]",
-                    children: d ? "Uploading..." : "Click to upload"
+                    disabled: b,
+                    className: "text-ds-md font-medium text-accent-11 transition-colors hover:underline disabled:opacity-action-disabled",
+                    children: b ? "Uploading..." : "Click to upload"
                   }
                 ),
-                /* @__PURE__ */ s("span", { className: "text-ds-md text-text-placeholder", children: [
+                /* @__PURE__ */ t("span", { className: "text-ds-md text-surface-fg-subtle", children: [
                   " ",
                   "or drag and drop"
                 ] })
               ] })
             ] }),
-            /* @__PURE__ */ t(
+            /* @__PURE__ */ e(
               "input",
               {
-                ref: f,
+                ref: d,
                 type: "file",
-                onChange: I,
+                onChange: w,
                 className: "hidden"
               }
             )
           ]
         }
       ),
-      e.length > 0 ? /* @__PURE__ */ t("div", { className: "mt-ds-05 space-y-ds-02", children: e.map((o) => {
-        const l = _t(o.fileType);
-        return /* @__PURE__ */ s(
+      s.length > 0 ? /* @__PURE__ */ e("div", { className: "mt-ds-05 space-y-ds-02", children: s.map((i) => {
+        const c = Ms(i.fileType);
+        return /* @__PURE__ */ t(
           "div",
           {
-            className: "group flex items-center gap-ds-04 rounded-ds-lg px-ds-03 py-ds-03 transition-colors hover:bg-field",
+            className: "group flex items-center gap-ds-04 rounded-ds-lg px-ds-03 py-ds-03 transition-colors hover:bg-surface-3",
             children: [
-              /* @__PURE__ */ t("div", { className: "flex h-ds-sm w-ds-sm shrink-0 items-center justify-center rounded-ds-lg bg-layer-02", children: /* @__PURE__ */ t(
-                l,
+              /* @__PURE__ */ e("div", { className: "flex h-ds-sm w-ds-sm shrink-0 items-center justify-center rounded-ds-lg bg-surface-2", children: /* @__PURE__ */ e(
+                c,
                 {
-                  className: "h-ico-sm w-ico-sm text-text-tertiary",
+                  className: "h-ico-sm w-ico-sm text-surface-fg-subtle",
                   stroke: 1.5
                 }
               ) }),
-              /* @__PURE__ */ s("div", { className: "flex-1 min-w-0", children: [
-                /* @__PURE__ */ t("p", { className: "truncate text-ds-md font-medium text-text-primary", children: o.title }),
-                /* @__PURE__ */ s("p", { className: "text-ds-sm text-text-placeholder", children: [
-                  kt(o.createdAt),
-                  /* @__PURE__ */ t("span", { className: "mx-ds-02b", children: "by" }),
-                  o.uploadedBy.name
+              /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: [
+                /* @__PURE__ */ e("p", { className: "truncate text-ds-md font-medium text-surface-fg", children: i.title }),
+                /* @__PURE__ */ t("p", { className: "text-ds-sm text-surface-fg-subtle", children: [
+                  Qs(i.createdAt),
+                  /* @__PURE__ */ e("span", { className: "mx-ds-02b", children: "by" }),
+                  i.uploadedBy.name
                 ] })
               ] }),
-              /* @__PURE__ */ s("div", { className: "flex items-center gap-ds-02 opacity-0 transition-opacity group-hover:opacity-100", children: [
-                o.externalUrl && /* @__PURE__ */ t(
+              /* @__PURE__ */ t("div", { className: "flex items-center gap-ds-02 opacity-0 transition-opacity group-hover:opacity-100", children: [
+                i.externalUrl && /* @__PURE__ */ e(
                   "a",
                   {
-                    href: o.externalUrl,
+                    href: i.externalUrl,
                     target: "_blank",
                     rel: "noopener noreferrer",
-                    className: "inline-flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md transition-colors hover:bg-layer-02",
-                    title: o.externalLabel ?? "Open externally",
-                    children: /* @__PURE__ */ t(st, { className: "h-ico-sm w-ico-sm text-text-tertiary" })
+                    className: "inline-flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md transition-colors hover:bg-surface-2",
+                    title: i.externalLabel ?? "Open externally",
+                    children: /* @__PURE__ */ e(bs, { className: "h-ico-sm w-ico-sm text-surface-fg-subtle" })
                   }
                 ),
-                o.downloadUrl && /* @__PURE__ */ t(
+                i.downloadUrl && /* @__PURE__ */ e(
                   "a",
                   {
-                    href: /^https?:\/\//.test(o.downloadUrl) ? o.downloadUrl : "#",
+                    href: /^https?:\/\//.test(i.downloadUrl) ? i.downloadUrl : "#",
                     target: "_blank",
                     rel: "noopener noreferrer",
-                    className: "inline-flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md transition-colors hover:bg-layer-02",
+                    className: "inline-flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md transition-colors hover:bg-surface-2",
                     title: "Download",
-                    children: /* @__PURE__ */ t(rt, { className: "h-ico-sm w-ico-sm text-text-tertiary" })
+                    children: /* @__PURE__ */ e(xs, { className: "h-ico-sm w-ico-sm text-surface-fg-subtle" })
                   }
                 ),
-                !g && /* @__PURE__ */ s(gt, { children: [
-                  /* @__PURE__ */ t(Nt, { asChild: !0, children: /* @__PURE__ */ t(
+                !y && /* @__PURE__ */ t(Os, { children: [
+                  /* @__PURE__ */ e(_s, { asChild: !0, children: /* @__PURE__ */ e(
                     "button",
                     {
                       type: "button",
-                      className: "inline-flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md transition-colors hover:bg-error-surface",
-                      title: "Delete",
-                      children: /* @__PURE__ */ t(nt, { className: "h-ico-sm w-ico-sm text-text-error" })
+                      className: "inline-flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md transition-colors hover:bg-error-3",
+                      "aria-label": "Delete file",
+                      children: /* @__PURE__ */ e(Ns, { className: "h-ico-sm w-ico-sm text-error-11" })
                     }
                   ) }),
-                  /* @__PURE__ */ s(yt, { children: [
-                    /* @__PURE__ */ s(vt, { children: [
-                      /* @__PURE__ */ t(wt, { children: "Delete file?" }),
-                      /* @__PURE__ */ s(It, { children: [
+                  /* @__PURE__ */ t(Vs, { children: [
+                    /* @__PURE__ */ t(js, { children: [
+                      /* @__PURE__ */ e(Hs, { children: "Delete file?" }),
+                      /* @__PURE__ */ t(Gs, { children: [
                         '"',
-                        o.title,
+                        i.title,
                         '" will be permanently deleted. This cannot be undone.'
                       ] })
                     ] }),
-                    /* @__PURE__ */ s(Dt, { children: [
-                      /* @__PURE__ */ t(ue, { asChild: !0, children: /* @__PURE__ */ t(pe, { variant: "outline", size: "sm", children: "Cancel" }) }),
-                      /* @__PURE__ */ t(ue, { asChild: !0, children: /* @__PURE__ */ t(
+                    /* @__PURE__ */ t($s, { children: [
+                      /* @__PURE__ */ e(he, { asChild: !0, children: /* @__PURE__ */ e(pe, { variant: "outline", size: "sm", children: "Cancel" }) }),
+                      /* @__PURE__ */ e(he, { asChild: !0, children: /* @__PURE__ */ e(
                         pe,
                         {
                           variant: "solid",
                           color: "error",
                           size: "sm",
-                          onClick: () => x(o.id),
+                          onClick: () => h(i.id),
                           children: "Delete"
                         }
                       ) })
@@ -936,12 +942,12 @@ const Ae = p.forwardRef(
               ] })
             ]
           },
-          o.id
+          i.id
         );
-      }) }) : /* @__PURE__ */ t("div", { className: "mt-ds-03", children: /* @__PURE__ */ t(
-        M,
+      }) }) : /* @__PURE__ */ e("div", { className: "mt-ds-03", children: /* @__PURE__ */ e(
+        F,
         {
-          icon: /* @__PURE__ */ t(ee, {}),
+          icon: /* @__PURE__ */ e(te, {}),
           title: "No files attached",
           description: "Upload files to share with your team",
           compact: !0
@@ -950,383 +956,399 @@ const Ae = p.forwardRef(
     ] });
   }
 );
-Ae.displayName = "FilesTab";
-const jt = {
+Pe.displayName = "FilesTab";
+const Us = {
   "task.created": {
-    icon: H,
-    color: "text-success-text",
-    dotColor: "bg-success",
+    icon: $,
+    color: "text-success-11",
+    dotColor: "bg-success-9",
     getDescription: () => "created this task"
   },
   "task.updated": {
-    icon: ht,
-    color: "text-category-slate-text",
-    dotColor: "bg-category-slate",
+    icon: As,
+    color: "text-category-slate-11",
+    dotColor: "bg-category-slate-9",
     getDescription: (n) => {
-      const e = n.metadata;
-      return (e == null ? void 0 : e.field) === "title" ? "updated the title" : (e == null ? void 0 : e.field) === "description" ? "updated the description" : (e == null ? void 0 : e.field) === "priority" ? `changed priority to ${(e == null ? void 0 : e.newValue) || "unknown"}` : (e == null ? void 0 : e.field) === "dueDate" ? "updated the due date" : (e == null ? void 0 : e.field) === "labels" ? "updated labels" : "updated this task";
+      const s = n.metadata;
+      return (s == null ? void 0 : s.field) === "title" ? "updated the title" : (s == null ? void 0 : s.field) === "description" ? "updated the description" : (s == null ? void 0 : s.field) === "priority" ? `changed priority to ${(s == null ? void 0 : s.newValue) || "unknown"}` : (s == null ? void 0 : s.field) === "dueDate" ? "updated the due date" : (s == null ? void 0 : s.field) === "labels" ? "updated labels" : "updated this task";
     }
   },
   "task.moved": {
-    icon: pt,
-    color: "text-warning-text",
-    dotColor: "bg-warning",
+    icon: Rs,
+    color: "text-warning-11",
+    dotColor: "bg-warning-9",
     getDescription: (n) => {
-      const e = n.metadata, b = (e == null ? void 0 : e.fromColumn) || "unknown", x = (e == null ? void 0 : e.toColumn) || "unknown";
-      return `moved from ${b} to ${x}`;
+      const s = n.metadata, g = (s == null ? void 0 : s.fromColumn) || "unknown", h = (s == null ? void 0 : s.toColumn) || "unknown";
+      return `moved from ${g} to ${h}`;
     }
   },
   "task.assigned": {
-    icon: ut,
-    color: "text-category-cyan-text",
-    dotColor: "bg-category-cyan",
+    icon: Ts,
+    color: "text-category-cyan-11",
+    dotColor: "bg-category-cyan-9",
     getDescription: (n) => {
-      const e = n.metadata;
-      return `assigned ${(e == null ? void 0 : e.assigneeName) || "a user"}`;
+      const s = n.metadata;
+      return `assigned ${(s == null ? void 0 : s.assigneeName) || "a user"}`;
     }
   },
   "task.unassigned": {
-    icon: mt,
-    color: "text-text-secondary",
-    dotColor: "bg-icon-disabled",
+    icon: Es,
+    color: "text-surface-fg-muted",
+    dotColor: "bg-disabled",
     getDescription: (n) => {
-      const e = n.metadata;
-      return `removed ${(e == null ? void 0 : e.assigneeName) || "a user"}`;
+      const s = n.metadata;
+      return `removed ${(s == null ? void 0 : s.assigneeName) || "a user"}`;
     }
   },
   "task.commented": {
-    icon: we,
-    color: "text-interactive",
-    dotColor: "bg-interactive",
+    icon: Ce,
+    color: "text-accent-11",
+    dotColor: "bg-accent-9",
     getDescription: () => "added a comment"
   },
   "task.file_uploaded": {
-    icon: ee,
-    color: "text-category-indigo-text",
-    dotColor: "bg-category-indigo",
+    icon: te,
+    color: "text-category-indigo-11",
+    dotColor: "bg-category-indigo-9",
     getDescription: (n) => {
-      const e = n.metadata;
-      return `uploaded ${(e == null ? void 0 : e.fileName) || "a file"}`;
+      const s = n.metadata;
+      return `uploaded ${(s == null ? void 0 : s.fileName) || "a file"}`;
     }
   },
   "task.review_requested": {
-    icon: Z,
-    color: "text-warning-text",
-    dotColor: "bg-warning",
+    icon: se,
+    color: "text-warning-11",
+    dotColor: "bg-warning-9",
     getDescription: (n) => {
-      const e = n.metadata;
-      return `requested review from ${(e == null ? void 0 : e.reviewerName) || "a reviewer"}`;
+      const s = n.metadata;
+      return `requested review from ${(s == null ? void 0 : s.reviewerName) || "a reviewer"}`;
     }
   },
   "task.review_completed": {
-    icon: ct,
-    color: "text-success-text",
-    dotColor: "bg-success",
+    icon: Ds,
+    color: "text-success-11",
+    dotColor: "bg-success-9",
     getDescription: (n) => {
-      const e = n.metadata;
-      return `${(e == null ? void 0 : e.status) || "reviewed"} the task`;
+      const s = n.metadata;
+      return `${(s == null ? void 0 : s.status) || "reviewed"} the task`;
     }
   },
   "task.visibility_changed": {
-    icon: ye,
-    color: "text-text-tertiary",
-    dotColor: "bg-icon-secondary",
+    icon: we,
+    color: "text-surface-fg-subtle",
+    dotColor: "bg-surface-fg-subtle",
     getDescription: (n) => {
-      const e = n.metadata;
-      return `changed visibility to ${(e == null ? void 0 : e.visibility) || "unknown"}`;
+      const s = n.metadata;
+      return `changed visibility to ${(s == null ? void 0 : s.visibility) || "unknown"}`;
     }
   },
   "task.priority_changed": {
-    icon: be,
-    color: "text-error-text",
-    dotColor: "bg-error",
+    icon: Ne,
+    color: "text-error-11",
+    dotColor: "bg-error-9",
     getDescription: (n) => {
-      const e = n.metadata;
-      return `changed priority to ${(e == null ? void 0 : e.priority) || "unknown"}`;
+      const s = n.metadata;
+      return `changed priority to ${(s == null ? void 0 : s.priority) || "unknown"}`;
     }
   },
   "task.labels_changed": {
-    icon: Ne,
-    color: "text-category-amber-text",
-    dotColor: "bg-category-amber",
+    icon: ye,
+    color: "text-category-amber-11",
+    dotColor: "bg-category-amber-9",
     getDescription: () => "updated labels"
   },
   "task.due_date_changed": {
-    icon: ge,
-    color: "text-warning-text",
-    dotColor: "bg-warning",
+    icon: ve,
+    color: "text-warning-11",
+    dotColor: "bg-warning-9",
     getDescription: (n) => {
-      const e = n.metadata;
-      return e != null && e.dueDate ? `set due date to ${e.dueDate}` : "updated the due date";
+      const s = n.metadata;
+      return s != null && s.dueDate ? `set due date to ${s.dueDate}` : "updated the due date";
     }
   }
-}, Vt = {
-  icon: te,
-  color: "text-text-placeholder",
-  dotColor: "bg-icon-disabled",
+}, Xs = {
+  icon: re,
+  color: "text-surface-fg-subtle",
+  dotColor: "bg-disabled",
   getDescription: (n) => n.action
 };
-function $t(n) {
-  const e = new Date(n), x = (/* @__PURE__ */ new Date()).getTime() - e.getTime(), d = Math.floor(x / 6e4), c = Math.floor(d / 60), g = Math.floor(c / 24);
-  return d < 1 ? "Just now" : d < 60 ? `${d}m ago` : c < 24 ? `${c}h ago` : g < 7 ? `${g}d ago` : e.toLocaleDateString("en-IN", {
-    month: "short",
-    day: "numeric",
-    hour: "numeric",
-    minute: "2-digit"
-  });
-}
-function Ht(n) {
-  const e = n.metadata;
-  return e != null && e.actorName ? e.actorName : n.actorType === "SYSTEM" ? "System" : n.actorType === "AGENT" ? "AI Agent" : "Someone";
+function Zs(n) {
+  const s = n.metadata;
+  return s != null && s.actorName ? s.actorName : n.actorType === "SYSTEM" ? "System" : n.actorType === "AGENT" ? "AI Agent" : "Someone";
 }
-const Se = p.forwardRef(
-  function({ activities: e, className: b }, x) {
-    return e.length === 0 ? /* @__PURE__ */ t(
-      M,
+const Le = o.forwardRef(
+  function({ activities: s, className: g, ...h }, b) {
+    return s.length === 0 ? /* @__PURE__ */ e(
+      F,
       {
-        ref: x,
-        icon: /* @__PURE__ */ t(te, {}),
+        ref: b,
+        icon: /* @__PURE__ */ e(re, {}),
         title: "No activity yet",
         description: "Actions on this task will appear here",
         compact: !0,
-        className: b
+        className: g,
+        ...h
       }
-    ) : /* @__PURE__ */ s("div", { ref: x, className: N("relative", b), children: [
-      /* @__PURE__ */ t("div", { className: "absolute left-[11px] top-2 bottom-2 w-px bg-border" }),
-      /* @__PURE__ */ t("div", { className: "space-y-ds-05", children: e.map((d) => {
-        const c = jt[d.action] || Vt, g = c.icon, D = Ht(d), f = c.getDescription(d);
-        return /* @__PURE__ */ s("div", { className: "relative flex gap-ds-04 pl-0", children: [
-          /* @__PURE__ */ t("div", { className: "relative z-raised flex h-[22px] w-[22px] shrink-0 items-center justify-center rounded-ds-full bg-layer-01", children: /* @__PURE__ */ t(
+    ) : /* @__PURE__ */ t("div", { ref: b, className: p("relative", g), ...h, children: [
+      /* @__PURE__ */ e("div", { className: "absolute left-[11px] top-2 bottom-2 w-px bg-surface-border" }),
+      /* @__PURE__ */ e("div", { className: "space-y-ds-05", children: s.map((m) => {
+        const y = Us[m.action] || Xs, D = y.icon, x = Zs(m), d = y.getDescription(m);
+        return /* @__PURE__ */ t("div", { className: "relative flex gap-ds-04 pl-0", children: [
+          /* @__PURE__ */ e("div", { className: "relative z-raised flex h-[22px] w-[22px] shrink-0 items-center justify-center rounded-ds-full bg-surface-1", children: /* @__PURE__ */ e(
             "div",
             {
-              className: N(
-                "flex h-ico-md w-ico-md items-center justify-center rounded-ds-full bg-layer-02"
+              className: p(
+                "flex h-ico-md w-ico-md items-center justify-center rounded-ds-full bg-surface-2"
               ),
-              children: /* @__PURE__ */ t(
-                g,
+              children: /* @__PURE__ */ e(
+                D,
                 {
-                  className: N("h-3 w-3", c.color),
+                  className: p("h-3 w-3", y.color),
                   stroke: 2
                 }
               )
             }
           ) }),
-          /* @__PURE__ */ s("div", { className: "flex-1 min-w-0 pt-ds-01", children: [
-            /* @__PURE__ */ s("p", { className: "text-ds-sm", children: [
-              /* @__PURE__ */ t("span", { className: "font-medium text-text-primary", children: D }),
-              /* @__PURE__ */ s("span", { className: "text-text-tertiary", children: [
+          /* @__PURE__ */ t("div", { className: "flex-1 min-w-0 pt-ds-01", children: [
+            /* @__PURE__ */ t("p", { className: "text-ds-sm", children: [
+              /* @__PURE__ */ e("span", { className: "font-medium text-surface-fg", children: x }),
+              /* @__PURE__ */ t("span", { className: "text-surface-fg-subtle", children: [
                 " ",
-                f
+                d
               ] })
             ] }),
-            /* @__PURE__ */ t("p", { className: "mt-ds-01 text-ds-xs text-text-placeholder", children: $t(d.timestamp) })
+            /* @__PURE__ */ e("p", { className: "mt-ds-01 text-ds-xs text-surface-fg-subtle", children: Se(m.timestamp) })
           ] })
-        ] }, d.id);
+        ] }, m.id);
       }) })
     ] });
   }
 );
-Se.displayName = "ActivityTab";
-const he = [
-  { id: "subtasks", label: "Subtasks", icon: ve },
-  { id: "review", label: "Review", icon: Z },
-  { id: "conversation", label: "Conversation", icon: Ie },
-  { id: "files", label: "Files", icon: ee },
-  { id: "activity", label: "Activity", icon: te }
+Le.displayName = "ActivityTab";
+const ge = [
+  { id: "subtasks", label: "Subtasks", icon: Ie },
+  { id: "review", label: "Review", icon: se },
+  { id: "conversation", label: "Conversation", icon: De },
+  { id: "files", label: "Files", icon: te },
+  { id: "activity", label: "Activity", icon: re }
 ];
-function Gt() {
-  return /* @__PURE__ */ s("div", { className: "space-y-ds-06 p-ds-06", children: [
-    /* @__PURE__ */ t(O, { className: "h-ds-xs-plus w-3/4 bg-field" }),
-    /* @__PURE__ */ t("div", { className: "space-y-ds-04", children: Array.from({ length: 6 }).map((n, e) => /* @__PURE__ */ s("div", { className: "flex items-center gap-ds-04", children: [
-      /* @__PURE__ */ t(O, { className: "h-[16px] w-[120px] bg-field" }),
-      /* @__PURE__ */ t(O, { className: "h-[16px] flex-1 bg-field" })
-    ] }, e)) }),
-    /* @__PURE__ */ t("div", { className: "flex gap-ds-05 border-b border-border pb-ds-03", children: Array.from({ length: 5 }).map((n, e) => /* @__PURE__ */ t(O, { className: "h-[12px] w-[64px] bg-field" }, e)) }),
-    /* @__PURE__ */ s("div", { className: "space-y-ds-04", children: [
-      /* @__PURE__ */ t(O, { className: "h-ds-md w-full bg-field" }),
-      /* @__PURE__ */ t(O, { className: "h-ds-md w-full bg-field" }),
-      /* @__PURE__ */ t(O, { className: "h-ds-md w-4/5 bg-field" })
+function et() {
+  return /* @__PURE__ */ t("div", { className: "space-y-ds-06 p-ds-06", children: [
+    /* @__PURE__ */ e(L, { className: "h-ds-xs-plus w-3/4 bg-surface-3" }),
+    /* @__PURE__ */ e("div", { className: "space-y-ds-04", children: Array.from({ length: 6 }).map((n, s) => /* @__PURE__ */ t("div", { className: "flex items-center gap-ds-04", children: [
+      /* @__PURE__ */ e(L, { className: "h-[16px] w-[120px] bg-surface-3" }),
+      /* @__PURE__ */ e(L, { className: "h-[16px] flex-1 bg-surface-3" })
+    ] }, s)) }),
+    /* @__PURE__ */ e("div", { className: "flex gap-ds-05 border-b border-surface-border-strong pb-ds-03", children: Array.from({ length: 5 }).map((n, s) => /* @__PURE__ */ e(L, { className: "h-[12px] w-[64px] bg-surface-3" }, s)) }),
+    /* @__PURE__ */ t("div", { className: "space-y-ds-04", children: [
+      /* @__PURE__ */ e(L, { className: "h-ds-md w-full bg-surface-3" }),
+      /* @__PURE__ */ e(L, { className: "h-ds-md w-full bg-surface-3" }),
+      /* @__PURE__ */ e(L, { className: "h-ds-md w-4/5 bg-surface-3" })
     ] })
   ] });
 }
-const Mt = p.forwardRef(function({
-  task: e,
-  loading: b = !1,
-  open: x,
-  onOpenChange: d,
-  columns: c,
-  members: g,
+const st = o.forwardRef(function({
+  task: s,
+  loading: g = !1,
+  open: h,
+  onOpenChange: b,
+  columns: m,
+  members: y,
   activities: D = [],
-  enrichedComments: f,
-  clientMode: m = !1,
-  clientEditableFields: y = ["priority", "dueDate"],
-  headerSlot: I,
-  extraTabs: v = [],
-  onTitleUpdate: a,
-  onPropertyUpdate: w,
-  onAssign: o,
-  onUnassign: l,
-  onCreateSubtask: h,
-  onToggleSubtask: u,
-  onRequestReview: E,
-  onUpdateReviewStatus: T,
-  onPostComment: R,
-  onUploadFile: A,
-  onUploadDeliverable: S,
-  onDeleteFile: P,
+  enrichedComments: x,
+  clientMode: d = !1,
+  clientEditableFields: C = ["priority", "dueDate"],
+  headerSlot: N,
+  extraTabs: w = [],
+  onTitleUpdate: I,
+  onPropertyUpdate: l,
+  onAssign: v,
+  onUnassign: i,
+  onCreateSubtask: c,
+  onToggleSubtask: f,
+  onRequestReview: u,
+  onUpdateReviewStatus: E,
+  onPostComment: T,
+  onUploadFile: S,
+  onUploadDeliverable: _,
+  onDeleteFile: R,
   onTabChange: k,
-  renderEditor: K,
-  renderViewer: W,
-  renderPriorityIndicator: F,
-  renderDatePicker: i,
-  isUploading: J = !1
-}, Pe) {
-  var ie, le, ae;
-  const [L, se] = p.useState(m ? "conversation" : "subtasks"), [Q, B] = p.useState(!1), [re, z] = p.useState(""), q = p.useRef(null);
-  p.useEffect(() => {
-    e && (z(e.title), B(!1));
-  }, [e == null ? void 0 : e.id]), p.useEffect(() => {
-    x && se(m ? "conversation" : "subtasks");
-  }, [x, m]);
-  const Le = (r) => {
-    se(r), k == null || k(r);
-  }, ne = () => {
-    B(!1);
-    const r = re.trim();
-    r && r !== (e == null ? void 0 : e.title) ? a == null || a(r) : e && z(e.title);
-  }, Oe = (r) => {
-    r.key === "Enter" && (r.preventDefault(), ne()), r.key === "Escape" && (B(!1), e && z(e.title));
+  renderEditor: z,
+  renderViewer: J,
+  renderPriorityIndicator: M,
+  renderDatePicker: q,
+  isUploading: a = !1,
+  className: Q,
+  ...Oe
+}, _e) {
+  var le, ie, oe;
+  const [P, ae] = o.useState(d ? "conversation" : "subtasks"), [U, V] = o.useState(!1), [ne, Y] = o.useState(""), K = o.useRef(null);
+  o.useEffect(() => {
+    s && (Y(s.title), V(!1));
+  }, [s == null ? void 0 : s.id]), o.useEffect(() => {
+    h && ae(d ? "conversation" : "subtasks");
+  }, [h, d]);
+  const Ve = o.useCallback((r) => {
+    ae(r), k == null || k(r);
+  }, [k]), je = o.useCallback((r, A) => {
+    d && !C.includes(r) || l == null || l(r, A);
+  }, [d, C, l]), He = o.useCallback((r) => {
+    v == null || v(r);
+  }, [v]), Ge = o.useCallback((r) => {
+    i == null || i(r);
+  }, [i]), $e = o.useCallback((r) => {
+    c == null || c(r);
+  }, [c]), Be = o.useCallback((r, A) => {
+    f == null || f(r, A);
+  }, [f]), Fe = o.useCallback((r) => {
+    u == null || u(r);
+  }, [u]), ze = o.useCallback((r, A, ss) => {
+    E == null || E(r, A, ss);
+  }, [E]), qe = o.useCallback((r, A) => {
+    T == null || T(r, A);
+  }, [T]), Ye = o.useCallback((r, A) => {
+    S == null || S(r, A);
+  }, [S]), Ke = o.useCallback((r) => {
+    R == null || R(r);
+  }, [R]), X = o.useCallback((...r) => {
+  }, []), We = o.useCallback((r, A) => {
+  }, []), ce = () => {
+    V(!1);
+    const r = ne.trim();
+    r && r !== (s == null ? void 0 : s.title) ? I == null || I(r) : s && Y(s.title);
+  }, Je = (r) => {
+    r.key === "Enter" && (r.preventDefault(), ce()), r.key === "Escape" && (V(!1), s && Y(s.title));
   };
-  p.useEffect(() => {
-    Q && q.current && (q.current.focus(), q.current.select());
-  }, [Q]);
-  const _e = (ie = c.find((r) => r.isTerminal)) == null ? void 0 : ie.id, ke = ((le = c.find((r) => r.isDefault)) == null ? void 0 : le.id) || ((ae = c[0]) == null ? void 0 : ae.id) || "", je = m ? he.filter((r) => r.id === "conversation") : he, Ve = v.filter((r) => r.position === "before"), $e = v.filter((r) => r.position !== "before"), He = f || (e == null ? void 0 : e.comments) || [];
-  return /* @__PURE__ */ t(Me, { open: x, onOpenChange: d, children: /* @__PURE__ */ s(
-    Fe,
+  o.useEffect(() => {
+    U && K.current && (K.current.focus(), K.current.select());
+  }, [U]);
+  const Me = (le = m.find((r) => r.isTerminal)) == null ? void 0 : le.id, Qe = ((ie = m.find((r) => r.isDefault)) == null ? void 0 : ie.id) || ((oe = m[0]) == null ? void 0 : oe.id) || "", Ue = d ? ge.filter((r) => r.id === "conversation") : ge, Xe = w.filter((r) => r.position === "before"), Ze = w.filter((r) => r.position !== "before"), es = x || (s == null ? void 0 : s.comments) || [];
+  return /* @__PURE__ */ e(ts, { open: h, onOpenChange: b, children: /* @__PURE__ */ t(
+    rs,
     {
-      ref: Pe,
+      ref: _e,
       side: "right",
-      className: N(
+      className: p(
         /* intentional: task detail side panel takes 40% of screen, min 380px for form usability */
         "w-full sm:max-w-none sm:w-[40%] min-w-[380px] p-0",
         "flex flex-col overflow-hidden",
-        "border-l border-border bg-layer-01"
+        "border-l border-surface-border-strong bg-surface-1",
+        Q
       ),
+      ...Oe,
       children: [
-        /* @__PURE__ */ t(ze, { children: /* @__PURE__ */ t(Be, { children: (e == null ? void 0 : e.title) || "Task Details" }) }),
-        b || !e ? /* @__PURE__ */ t(Gt, {}) : /* @__PURE__ */ s(xe, { children: [
-          /* @__PURE__ */ s("div", { className: "shrink-0 border-b border-border px-ds-06 pb-ds-05 pt-ds-06", children: [
-            !m && Q ? /* @__PURE__ */ t(
+        /* @__PURE__ */ e(ns, { children: /* @__PURE__ */ e(as, { children: (s == null ? void 0 : s.title) || "Task Details" }) }),
+        g || !s ? /* @__PURE__ */ e(et, {}) : /* @__PURE__ */ t(be, { children: [
+          /* @__PURE__ */ t("div", { className: "shrink-0 border-b border-surface-border-strong px-ds-06 pb-ds-05 pt-ds-06", children: [
+            !d && U ? /* @__PURE__ */ e(
               "input",
               {
-                ref: q,
+                ref: K,
                 type: "text",
-                value: re,
-                onChange: (r) => z(r.target.value),
-                onBlur: ne,
-                onKeyDown: Oe,
-                className: "w-full bg-transparent text-ds-lg font-semibold text-text-primary outline-none"
+                value: ne,
+                onChange: (r) => Y(r.target.value),
+                onBlur: ce,
+                onKeyDown: Je,
+                className: "w-full bg-transparent text-ds-lg font-semibold text-surface-fg outline-none"
+              }
+            ) : /* @__PURE__ */ e(
+              "h2",
+              {
+                onClick: d ? void 0 : () => V(!0),
+                ...!d && {
+                  role: "button",
+                  tabIndex: 0,
+                  onKeyDown: (r) => {
+                    (r.key === "Enter" || r.key === " ") && (r.preventDefault(), V(!0));
+                  }
+                },
+                className: p(
+                  "text-ds-lg font-semibold text-surface-fg",
+                  !d && "cursor-text hover:text-accent-11 transition-colors"
+                ),
+                children: s.title
               }
-            ) : (
-              // eslint-disable-next-line jsx-a11y/click-events-have-key-events
-              /* @__PURE__ */ t(
-                "h2",
-                {
-                  onClick: m ? void 0 : () => B(!0),
-                  className: N(
-                    "text-ds-lg font-semibold text-text-primary",
-                    !m && "cursor-text hover:text-interactive transition-colors"
-                  ),
-                  children: e.title
-                }
-              )
             ),
-            e.parentTaskId && /* @__PURE__ */ t("p", { className: "mt-ds-02 text-ds-sm text-text-placeholder", children: "Subtask" }),
-            I && /* @__PURE__ */ t("div", { className: "mt-ds-03 flex items-center gap-ds-03", children: I })
+            s.parentTaskId && /* @__PURE__ */ e("p", { className: "mt-ds-02 text-ds-sm text-surface-fg-subtle", children: "Subtask" }),
+            N && /* @__PURE__ */ e("div", { className: "mt-ds-03 flex items-center gap-ds-03", children: N })
           ] }),
-          /* @__PURE__ */ s("div", { className: "flex-1 overflow-y-auto", children: [
-            /* @__PURE__ */ t("div", { className: "border-b border-border px-ds-06 py-ds-05", children: /* @__PURE__ */ t(
-              Ee,
+          /* @__PURE__ */ t("div", { className: "flex-1 overflow-y-auto", children: [
+            /* @__PURE__ */ e("div", { className: "border-b border-surface-border-strong px-ds-06 py-ds-05", children: /* @__PURE__ */ e(
+              Te,
               {
-                task: e,
-                columns: c,
-                members: g,
-                onUpdate: (r, C) => {
-                  m && !y.includes(r) || w == null || w(r, C);
-                },
-                onAssign: (r) => o == null ? void 0 : o(r),
-                onUnassign: (r) => l == null ? void 0 : l(r),
-                readOnly: m,
-                editableFields: m ? y : void 0,
-                renderPriorityIndicator: F,
-                renderDatePicker: i
+                task: s,
+                columns: m,
+                members: y,
+                onUpdate: je,
+                onAssign: He,
+                onUnassign: Ge,
+                readOnly: d,
+                editableFields: d ? C : void 0,
+                renderPriorityIndicator: M,
+                renderDatePicker: q
               }
             ) }),
-            /* @__PURE__ */ t("div", { className: "sticky top-0 z-raised bg-layer-01 px-ds-06", children: /* @__PURE__ */ t(Ye, { value: L, onValueChange: Le, children: /* @__PURE__ */ s(Ke, { variant: "line", children: [
-              Ve.map((r) => /* @__PURE__ */ s(U, { value: r.id, children: [
-                r.icon && /* @__PURE__ */ t("span", { className: "[&>svg]:h-ico-sm [&>svg]:w-ico-sm shrink-0", children: r.icon }),
+            /* @__PURE__ */ e("div", { className: "sticky top-0 z-raised bg-surface-1 px-ds-06", children: /* @__PURE__ */ e(ls, { value: P, onValueChange: Ve, children: /* @__PURE__ */ t(is, { variant: "line", children: [
+              Xe.map((r) => /* @__PURE__ */ t(Z, { value: r.id, children: [
+                r.icon && /* @__PURE__ */ e("span", { className: "[&>svg]:h-ico-sm [&>svg]:w-ico-sm shrink-0", children: r.icon }),
                 r.label
               ] }, r.id)),
-              je.map((r) => /* @__PURE__ */ s(U, { value: r.id, children: [
-                /* @__PURE__ */ t(r.icon, { className: "h-ico-sm w-ico-sm", stroke: 1.5 }),
+              Ue.map((r) => /* @__PURE__ */ t(Z, { value: r.id, children: [
+                /* @__PURE__ */ e(r.icon, { className: "h-ico-sm w-ico-sm", stroke: 1.5 }),
                 r.label
               ] }, r.id)),
-              $e.map((r) => /* @__PURE__ */ s(U, { value: r.id, children: [
-                r.icon && /* @__PURE__ */ t("span", { className: "[&>svg]:h-ico-sm [&>svg]:w-ico-sm shrink-0", children: r.icon }),
+              Ze.map((r) => /* @__PURE__ */ t(Z, { value: r.id, children: [
+                r.icon && /* @__PURE__ */ e("span", { className: "[&>svg]:h-ico-sm [&>svg]:w-ico-sm shrink-0", children: r.icon }),
                 r.label
               ] }, r.id))
             ] }) }) }),
-            /* @__PURE__ */ s("div", { className: "px-ds-06 py-ds-05", children: [
-              L === "subtasks" && /* @__PURE__ */ t(
-                Te,
+            /* @__PURE__ */ t("div", { className: "px-ds-06 py-ds-05", children: [
+              P === "subtasks" && /* @__PURE__ */ e(
+                Re,
                 {
-                  subtasks: e.subtasks ?? [],
-                  terminalColumnId: _e,
-                  projectId: e.projectId,
-                  parentTaskId: e.id,
-                  defaultColumnId: ke,
-                  onCreateSubtask: m ? () => {
-                  } : (r) => h == null ? void 0 : h(r),
-                  onToggleSubtask: m ? () => {
-                  } : (r, C) => u == null ? void 0 : u(r, C),
-                  readOnly: m
+                  subtasks: s.subtasks ?? [],
+                  terminalColumnId: Me,
+                  projectId: s.projectId,
+                  parentTaskId: s.id,
+                  defaultColumnId: Qe,
+                  onCreateSubtask: d ? X : $e,
+                  onToggleSubtask: d ? We : Be,
+                  readOnly: d
                 }
               ),
-              L === "review" && !m && /* @__PURE__ */ t(
-                Ce,
+              P === "review" && !d && /* @__PURE__ */ e(
+                Ae,
                 {
-                  reviews: e.reviewRequests,
-                  members: g,
-                  onRequestReview: (r) => E == null ? void 0 : E(r),
-                  onUpdateStatus: (r, C, Ge) => T == null ? void 0 : T(r, C, Ge)
+                  reviews: s.reviewRequests,
+                  members: y,
+                  onRequestReview: Fe,
+                  onUpdateStatus: ze
                 }
               ),
-              L === "conversation" && /* @__PURE__ */ t(
-                Re,
+              P === "conversation" && /* @__PURE__ */ e(
+                ke,
                 {
-                  comments: He,
-                  taskVisibility: e.visibility,
-                  onPostComment: (r, C) => R == null ? void 0 : R(r, C),
-                  clientMode: m,
-                  renderEditor: K,
-                  renderViewer: W
+                  comments: es,
+                  taskVisibility: s.visibility,
+                  onPostComment: qe,
+                  clientMode: d,
+                  renderEditor: z,
+                  renderViewer: J
                 }
               ),
-              L === "files" && /* @__PURE__ */ t(
-                Ae,
+              P === "files" && /* @__PURE__ */ e(
+                Pe,
                 {
-                  files: e.files ?? [],
-                  onUpload: m ? () => {
-                  } : (r, C) => A == null ? void 0 : A(r, C),
-                  onDelete: m ? () => {
-                  } : (r) => P == null ? void 0 : P(r),
-                  isUploading: J,
-                  readOnly: m
+                  files: s.files ?? [],
+                  onUpload: d ? X : Ye,
+                  onDelete: d ? X : Ke,
+                  isUploading: a,
+                  readOnly: d
                 }
               ),
-              L === "activity" && /* @__PURE__ */ t(Se, { activities: D }),
-              v.map(
-                (r) => L === r.id ? /* @__PURE__ */ t(p.Fragment, { children: r.content }, r.id) : null
+              P === "activity" && /* @__PURE__ */ e(Le, { activities: D }),
+              w.map(
+                (r) => P === r.id ? /* @__PURE__ */ e(o.Fragment, { children: r.content }, r.id) : null
               )
             ] })
           ] })
@@ -1335,13 +1357,13 @@ const Mt = p.forwardRef(function({
     }
   ) });
 });
-Mt.displayName = "TaskDetailPanel";
+st.displayName = "TaskDetailPanel";
 export {
-  Se as A,
-  Re as C,
-  Ae as F,
-  Ce as R,
-  Te as S,
-  Mt as T,
-  Ee as a
+  Le as A,
+  ke as C,
+  Pe as F,
+  Ae as R,
+  Re as S,
+  st as T,
+  Te as a
 };