@devalok/shilp-sutra-karm 0.20.2 → 0.21.0

package/dist/tasks/index.js

@@ -1,17 +1,17 @@
 "use client";
-import { jsx as e, jsxs as c, Fragment as E } from "react/jsx-runtime";
-import * as i from "react";
+import { jsx as e, jsxs as i, Fragment as E } from "react/jsx-runtime";
+import * as c from "react";
 import { cn as p } from "@devalok/shilp-sutra/ui/lib/utils";
 import { Tabs as J, TabsList as ee, TabsTrigger as se, TabsContent as te } from "@devalok/shilp-sutra/ui";
-import { Skeleton as v } from "@devalok/shilp-sutra/ui/skeleton";
+import { Skeleton as w } from "@devalok/shilp-sutra/ui/skeleton";
 import { P as ae } from "../_chunks/task-detail-panel.js";
-import { c as We, A as qe, d as ze, C as Qe, e as Ue, f as Xe, g as Ze, F as Je, M as es, h as ss, i as ts, j as as, k as rs, l as ns, R as cs, m as is, n as ls, o as os, p as ds, S as us, T as fs, a as ms, b as ps, V as gs } from "../_chunks/task-detail-panel.js";
+import { c as We, A as qe, d as ze, C as Qe, e as Ue, f as Xe, g as Ze, F as Je, M as es, h as ss, i as ts, j as as, k as rs, l as ns, R as is, m as cs, n as os, o as ds, p as ls, S as us, T as fs, a as ms, b as ps, V as hs } from "../_chunks/task-detail-panel.js";
 import { Avatar as M, AvatarImage as O, AvatarFallback as A } from "@devalok/shilp-sutra/ui/avatar";
 import { MemberPicker as _ } from "@devalok/shilp-sutra/composed/member-picker";
 import { getInitials as L } from "@devalok/shilp-sutra/composed/lib/string-utils";
-import { IconChevronDown as F, IconCheck as V, IconArrowDown as re, IconMinus as ne, IconArrowUp as ce, IconAlertTriangleFilled as ie, IconX as B, IconPlus as j, IconCalendarEvent as le, IconLock as oe, IconWorld as de } from "@tabler/icons-react";
+import { IconChevronDown as F, IconCheck as V, IconArrowDown as re, IconMinus as ne, IconArrowUp as ie, IconAlertTriangleFilled as ce, IconX as B, IconPlus as j, IconCalendarEvent as oe, IconLock as de, IconWorld as le } from "@tabler/icons-react";
 import { Popover as T, PopoverTrigger as P, PopoverContent as C } from "@devalok/shilp-sutra/ui/popover";
-import { Dialog as ue, DialogContent as fe, DialogHeader as me, DialogTitle as pe, DialogDescription as ge, DialogFooter as he, DialogClose as be } from "@devalok/shilp-sutra/ui/dialog";
+import { Dialog as ue, DialogContent as fe, DialogHeader as me, DialogTitle as pe, DialogDescription as he, DialogFooter as ge, DialogClose as be } from "@devalok/shilp-sutra/ui/dialog";
 import { Button as Y } from "@devalok/shilp-sutra/ui/button";
 function H(r) {
   return null;
@@ -39,32 +39,32 @@ function G({
   value: r,
   editable: s = !1,
   onUpdate: n,
-  subtask: l = !1,
+  subtask: o = !1,
   className: f
 }) {
-  const [u, h] = i.useState(!1), [o, t] = i.useState(r), m = i.useRef(null);
-  i.useEffect(() => {
+  const [u, g] = c.useState(!1), [d, t] = c.useState(r), m = c.useRef(null);
+  c.useEffect(() => {
     u || t(r);
-  }, [r, u]), i.useEffect(() => {
+  }, [r, u]), c.useEffect(() => {
     u && m.current && (m.current.focus(), m.current.select());
   }, [u]);
-  const g = () => {
-    h(!1);
-    const x = o.trim();
+  const h = () => {
+    g(!1);
+    const x = d.trim();
     x && x !== r ? n == null || n(x) : t(r);
   };
-  return /* @__PURE__ */ c("div", { className: f, children: [
-    l && /* @__PURE__ */ e("p", { className: "text-ds-xs text-surface-fg-subtle uppercase tracking-wide mb-ds-01", children: "Subtask" }),
+  return /* @__PURE__ */ i("div", { className: f, children: [
+    o && /* @__PURE__ */ e("p", { className: "text-ds-xs text-surface-fg-subtle uppercase tracking-wide mb-ds-01", children: "Subtask" }),
     s && u ? /* @__PURE__ */ e(
       "input",
       {
         ref: m,
         type: "text",
-        value: o,
+        value: d,
         onChange: (x) => t(x.target.value),
-        onBlur: g,
+        onBlur: h,
         onKeyDown: (x) => {
-          x.key === "Enter" && (x.preventDefault(), g()), x.key === "Escape" && (h(!1), t(r));
+          x.key === "Enter" && (x.preventDefault(), h()), x.key === "Escape" && (g(!1), t(r));
         },
         className: "w-full bg-transparent text-ds-lg font-semibold text-surface-fg outline-none"
       }
@@ -73,7 +73,7 @@ function G({
       {
         type: "button",
         onClick: () => {
-          s && h(!0);
+          s && g(!0);
         },
         className: "w-full cursor-text text-left text-ds-lg font-semibold text-surface-fg transition-colors hover:text-accent-11",
         children: r
@@ -95,9 +95,9 @@ function W({ children: r, className: s }) {
   );
 }
 W.displayName = "TaskPanelProperties";
-function q({ icon: r, label: s, children: n, className: l }) {
-  return /* @__PURE__ */ c("div", { className: p("flex items-center gap-ds-04 py-ds-03", l), children: [
-    /* @__PURE__ */ c("div", { className: "flex items-center gap-ds-03 w-[120px] shrink-0 text-ds-sm text-surface-fg-muted [&>svg]:h-ico-sm [&>svg]:w-ico-sm", children: [
+function q({ icon: r, label: s, children: n, className: o }) {
+  return /* @__PURE__ */ i("div", { className: p("flex items-center gap-ds-04 py-ds-03", o), children: [
+    /* @__PURE__ */ i("div", { className: "flex items-center gap-ds-03 w-[120px] shrink-0 text-ds-sm text-surface-fg-muted [&>svg]:h-ico-sm [&>svg]:w-ico-sm", children: [
       r,
       /* @__PURE__ */ e("span", { children: s })
     ] }),
@@ -109,45 +109,45 @@ function z({
   defaultTab: r,
   onTabChange: s,
   children: n,
-  className: l
+  className: o
 }) {
-  const [f, u] = i.useState(r), h = i.useCallback(
+  const [f, u] = c.useState(r), g = c.useCallback(
     (t) => {
       u(t), s == null || s(t);
     },
     [s]
-  ), o = [];
-  return i.Children.toArray(n).forEach((t) => {
-    i.isValidElement(t) && t.type === xe && o.push(t.props);
-  }), /* @__PURE__ */ c(
+  ), d = [];
+  return c.Children.toArray(n).forEach((t) => {
+    c.isValidElement(t) && t.type === xe && d.push(t.props);
+  }), /* @__PURE__ */ i(
     J,
     {
       value: f,
-      onValueChange: h,
-      className: p("flex flex-col flex-1 min-h-0", l),
+      onValueChange: g,
+      className: p("flex flex-col flex-1 min-h-0", o),
       children: [
-        /* @__PURE__ */ e("div", { className: "sticky top-0 bg-surface-2 z-raised px-ds-06", children: /* @__PURE__ */ e(ee, { variant: "line", children: o.map((t) => /* @__PURE__ */ c(se, { value: t.id, children: [
+        /* @__PURE__ */ e("div", { className: "sticky top-0 bg-surface-raised z-raised px-ds-06", children: /* @__PURE__ */ e(ee, { variant: "line", children: d.map((t) => /* @__PURE__ */ i(se, { value: t.id, children: [
           t.icon && /* @__PURE__ */ e("span", { className: "[&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:stroke-[1.5] shrink-0", children: t.icon }),
           t.label
         ] }, t.id)) }) }),
-        /* @__PURE__ */ e("div", { className: "flex-1 overflow-y-auto px-ds-06 py-ds-05", children: o.map((t) => /* @__PURE__ */ e(te, { value: t.id, className: "mt-0", children: t.children }, t.id)) })
+        /* @__PURE__ */ e("div", { className: "flex-1 overflow-y-auto px-ds-06 py-ds-05", children: d.map((t) => /* @__PURE__ */ e(te, { value: t.id, className: "mt-0", children: t.children }, t.id)) })
       ]
     }
   );
 }
 z.displayName = "TaskPanelTabs";
 function Q({ className: r }) {
-  return /* @__PURE__ */ c("div", { className: p("space-y-ds-06 p-ds-06", r), children: [
-    /* @__PURE__ */ e(v, { 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((s, n) => /* @__PURE__ */ c("div", { className: "flex items-center gap-ds-04", children: [
-      /* @__PURE__ */ e(v, { className: "h-[16px] w-[120px] bg-surface-3" }),
-      /* @__PURE__ */ e(v, { className: "h-[16px] flex-1 bg-surface-3" })
+  return /* @__PURE__ */ i("div", { className: p("space-y-ds-06 p-ds-06", r), children: [
+    /* @__PURE__ */ e(w, { className: "h-ds-xs-plus w-3/4 bg-surface-raised-hover" }),
+    /* @__PURE__ */ e("div", { className: "space-y-ds-04", children: Array.from({ length: 6 }).map((s, n) => /* @__PURE__ */ i("div", { className: "flex items-center gap-ds-04", children: [
+      /* @__PURE__ */ e(w, { className: "h-[16px] w-[120px] bg-surface-raised-hover" }),
+      /* @__PURE__ */ e(w, { className: "h-[16px] flex-1 bg-surface-raised-hover" })
     ] }, n)) }),
-    /* @__PURE__ */ e("div", { className: "flex gap-ds-05 border-b border-surface-border-strong pb-ds-03", children: Array.from({ length: 5 }).map((s, n) => /* @__PURE__ */ e(v, { className: "h-[12px] w-[64px] bg-surface-3" }, n)) }),
-    /* @__PURE__ */ c("div", { className: "space-y-ds-04", children: [
-      /* @__PURE__ */ e(v, { className: "h-ds-md w-full bg-surface-3" }),
-      /* @__PURE__ */ e(v, { className: "h-ds-md w-full bg-surface-3" }),
-      /* @__PURE__ */ e(v, { className: "h-ds-md w-4/5 bg-surface-3" })
+    /* @__PURE__ */ e("div", { className: "flex gap-ds-05 border-b border-surface-border-strong pb-ds-03", children: Array.from({ length: 5 }).map((s, n) => /* @__PURE__ */ e(w, { className: "h-[12px] w-[64px] bg-surface-raised-hover" }, n)) }),
+    /* @__PURE__ */ i("div", { className: "space-y-ds-04", children: [
+      /* @__PURE__ */ e(w, { className: "h-ds-md w-full bg-surface-raised-hover" }),
+      /* @__PURE__ */ e(w, { className: "h-ds-md w-full bg-surface-raised-hover" }),
+      /* @__PURE__ */ e(w, { className: "h-ds-md w-4/5 bg-surface-raised-hover" })
     ] })
   ] });
 }
@@ -160,21 +160,21 @@ const Ke = Object.assign(K, {
   Tabs: z,
   Tab: H,
   Loading: Q
-}), Ne = i.forwardRef(
-  function({ columns: s, value: n, onChange: l, readOnly: f, className: u }, h) {
-    const [o, t] = i.useState(!1), m = s.find((a) => a.id === n), g = (m == null ? void 0 : m.name) ?? "Select column";
-    return f ? /* @__PURE__ */ e("span", { className: p("px-ds-03 py-ds-02 text-ds-md text-surface-fg", u), children: g }) : /* @__PURE__ */ c(T, { open: o, onOpenChange: t, children: [
-      /* @__PURE__ */ e(P, { asChild: !0, children: /* @__PURE__ */ c(
+}), Ne = c.forwardRef(
+  function({ columns: s, value: n, onChange: o, readOnly: f, className: u }, g) {
+    const [d, t] = c.useState(!1), m = s.find((a) => a.id === n), h = (m == null ? void 0 : m.name) ?? "Select column";
+    return f ? /* @__PURE__ */ e("span", { className: p("px-ds-03 py-ds-02 text-ds-md text-surface-fg", u), children: h }) : /* @__PURE__ */ i(T, { open: d, onOpenChange: t, children: [
+      /* @__PURE__ */ e(P, { asChild: !0, children: /* @__PURE__ */ i(
         "button",
         {
-          ref: h,
+          ref: g,
           type: "button",
           className: p(
-            "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",
+            "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-raised-hover",
             u
           ),
           children: [
-            /* @__PURE__ */ e("span", { children: g }),
+            /* @__PURE__ */ e("span", { children: h }),
             /* @__PURE__ */ e(F, { className: "h-3 w-3 text-surface-fg-subtle" })
           ]
         }
@@ -182,19 +182,19 @@ const Ke = Object.assign(K, {
       /* @__PURE__ */ e(
         C,
         {
-          className: "w-[180px] border-surface-border-strong bg-surface-1 p-ds-02",
+          className: "w-[180px] border-surface-border-strong bg-surface-overlay p-ds-02",
           align: "start",
           sideOffset: 4,
-          children: s.map((a) => /* @__PURE__ */ c(
+          children: s.map((a) => /* @__PURE__ */ i(
             "button",
             {
               type: "button",
               onClick: () => {
-                l(a.id), t(!1);
+                o(a.id), t(!1);
               },
               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-surface-3",
+                "hover:bg-surface-raised-hover",
                 a.id === n ? "text-accent-11" : "text-surface-fg"
               ),
               children: [
@@ -211,29 +211,29 @@ const Ke = Object.assign(K, {
 );
 Ne.displayName = "TaskColumnPicker";
 const ye = {
-  URGENT: { icon: ie, className: "text-error-9" },
-  HIGH: { icon: ce, className: "text-warning-9" },
+  URGENT: { icon: ce, className: "text-error-9" },
+  HIGH: { icon: ie, className: "text-warning-9" },
   MEDIUM: { icon: ne, className: "text-surface-fg-muted" },
   LOW: { icon: re, className: "text-surface-fg-subtle" }
 }, ke = ["URGENT", "HIGH", "MEDIUM", "LOW"];
 function I({ priority: r }) {
   const s = ye[r], n = s.icon;
-  return /* @__PURE__ */ c("div", { className: "flex items-center gap-ds-02b", children: [
+  return /* @__PURE__ */ i("div", { className: "flex items-center gap-ds-02b", children: [
     /* @__PURE__ */ e(n, { className: p("h-ico-sm w-ico-sm", s.className) }),
     /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg", children: ae[r] ?? r })
   ] });
 }
-const we = i.forwardRef(
-  function({ value: s, onChange: n, readOnly: l, className: f }, u) {
-    const [h, o] = i.useState(!1);
-    return l ? /* @__PURE__ */ e("div", { className: p("px-ds-03 py-ds-02", f), children: /* @__PURE__ */ e(I, { priority: s }) }) : /* @__PURE__ */ c(T, { open: h, onOpenChange: o, children: [
-      /* @__PURE__ */ e(P, { asChild: !0, children: /* @__PURE__ */ c(
+const ve = c.forwardRef(
+  function({ value: s, onChange: n, readOnly: o, className: f }, u) {
+    const [g, d] = c.useState(!1);
+    return o ? /* @__PURE__ */ e("div", { className: p("px-ds-03 py-ds-02", f), children: /* @__PURE__ */ e(I, { priority: s }) }) : /* @__PURE__ */ i(T, { open: g, onOpenChange: d, children: [
+      /* @__PURE__ */ e(P, { asChild: !0, children: /* @__PURE__ */ i(
         "button",
         {
           ref: u,
           type: "button",
           className: p(
-            "inline-flex items-center gap-ds-02b rounded-ds-md px-ds-03 py-ds-02 transition-colors hover:bg-surface-3",
+            "inline-flex items-center gap-ds-02b rounded-ds-md px-ds-03 py-ds-02 transition-colors hover:bg-surface-raised-hover",
             f
           ),
           children: [
@@ -245,20 +245,20 @@ const we = i.forwardRef(
       /* @__PURE__ */ e(
         C,
         {
-          className: "w-[180px] border-surface-border-strong bg-surface-1 p-ds-02",
+          className: "w-[180px] border-surface-border-strong bg-surface-overlay p-ds-02",
           align: "start",
           sideOffset: 4,
-          children: ke.map((t) => /* @__PURE__ */ c(
+          children: ke.map((t) => /* @__PURE__ */ i(
             "button",
             {
               type: "button",
               onClick: () => {
-                n(t), o(!1);
+                n(t), d(!1);
               },
               className: p(
                 "flex w-full items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b transition-colors",
-                "hover:bg-surface-3",
-                t === s && "bg-surface-3"
+                "hover:bg-surface-raised-hover",
+                t === s && "bg-surface-raised-hover"
               ),
               children: [
                 /* @__PURE__ */ e(I, { priority: t }),
@@ -272,22 +272,22 @@ const we = i.forwardRef(
     ] });
   }
 );
-we.displayName = "TaskPriorityPicker";
-const ve = i.forwardRef(
-  function({ members: s, value: n, onChange: l, placeholder: f = "No owner", readOnly: u, className: h }, o) {
-    const t = s.find((a) => a.id === n) ?? null, m = i.useMemo(
+ve.displayName = "TaskPriorityPicker";
+const we = c.forwardRef(
+  function({ members: s, value: n, onChange: o, placeholder: f = "No owner", readOnly: u, className: g }, d) {
+    const t = s.find((a) => a.id === n) ?? null, m = c.useMemo(
       () => s.map((a) => ({ id: a.id, name: a.name, avatar: a.image ?? void 0 })),
       [s]
-    ), g = i.useCallback(
+    ), h = c.useCallback(
       (a) => {
-        l(a === n ? null : a);
+        o(a === n ? null : a);
       },
-      [l, n]
+      [o, n]
     );
-    return u ? /* @__PURE__ */ e("div", { className: p("inline-flex items-center gap-ds-03 px-ds-03 py-ds-02", h), children: t ? /* @__PURE__ */ c(E, { children: [
-      /* @__PURE__ */ c(M, { className: "h-ico-md w-ico-md", children: [
+    return u ? /* @__PURE__ */ e("div", { className: p("inline-flex items-center gap-ds-03 px-ds-03 py-ds-02", g), children: t ? /* @__PURE__ */ i(E, { children: [
+      /* @__PURE__ */ i(M, { className: "h-ico-md w-ico-md", children: [
         t.image && /* @__PURE__ */ e(O, { src: t.image, alt: t.name }),
-        /* @__PURE__ */ e(A, { className: "bg-surface-3 text-ds-xs font-semibold text-accent-fg", children: L(t.name) })
+        /* @__PURE__ */ e(A, { className: "bg-surface-raised-hover text-ds-xs font-semibold text-surface-fg", children: L(t.name) })
       ] }),
       /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg", children: t.name })
     ] }) : /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg-subtle", children: f }) }) : /* @__PURE__ */ e(
@@ -295,20 +295,20 @@ const ve = i.forwardRef(
       {
         members: m,
         selectedIds: n ? [n] : [],
-        onSelect: g,
+        onSelect: h,
         children: /* @__PURE__ */ e(
           "button",
           {
-            ref: o,
+            ref: d,
             type: "button",
             className: p(
-              "inline-flex items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02 transition-colors hover:bg-surface-3",
-              h
+              "inline-flex items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02 transition-colors hover:bg-surface-raised-hover",
+              g
             ),
-            children: t ? /* @__PURE__ */ c(E, { children: [
-              /* @__PURE__ */ c(M, { className: "h-ico-md w-ico-md", children: [
+            children: t ? /* @__PURE__ */ i(E, { children: [
+              /* @__PURE__ */ i(M, { className: "h-ico-md w-ico-md", children: [
                 t.image && /* @__PURE__ */ e(O, { src: t.image, alt: t.name }),
-                /* @__PURE__ */ e(A, { className: "bg-surface-3 text-ds-xs font-semibold text-accent-fg", children: L(t.name) })
+                /* @__PURE__ */ e(A, { className: "bg-surface-raised-hover text-ds-xs font-semibold text-surface-fg", children: L(t.name) })
               ] }),
               /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg", children: t.name })
             ] }) : /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg-subtle", children: f })
@@ -318,27 +318,27 @@ const ve = i.forwardRef(
     );
   }
 );
-ve.displayName = "TaskMemberPicker";
-const Te = i.forwardRef(
-  function({ members: s, value: n, onAssign: l, onUnassign: f, readOnly: u, className: h }, o) {
-    const t = n.map((a) => a.id), m = i.useMemo(
+we.displayName = "TaskMemberPicker";
+const Te = c.forwardRef(
+  function({ members: s, value: n, onAssign: o, onUnassign: f, readOnly: u, className: g }, d) {
+    const t = n.map((a) => a.id), m = c.useMemo(
       () => s.map((a) => ({ id: a.id, name: a.name, avatar: a.image ?? void 0 })),
       [s]
-    ), g = i.useCallback(
+    ), h = c.useCallback(
       (a) => {
-        t.includes(a) ? f(a) : l(a);
+        t.includes(a) ? f(a) : o(a);
       },
-      [t, l, f]
+      [t, o, f]
     );
-    return /* @__PURE__ */ c("div", { ref: o, className: p("flex flex-wrap items-center gap-ds-02b", h), children: [
-      n.map((a) => /* @__PURE__ */ c(
+    return /* @__PURE__ */ i("div", { ref: d, className: p("flex flex-wrap items-center gap-ds-02b", g), children: [
+      n.map((a) => /* @__PURE__ */ i(
         "div",
         {
-          className: "inline-flex items-center gap-ds-02 rounded-ds-full bg-surface-2 py-ds-01 pl-ds-01 pr-ds-03",
+          className: "inline-flex items-center gap-ds-02 rounded-ds-full bg-surface-raised py-ds-01 pl-ds-01 pr-ds-03",
           children: [
-            /* @__PURE__ */ c(M, { className: "h-ico-sm w-ico-sm", children: [
+            /* @__PURE__ */ i(M, { className: "h-ico-sm w-ico-sm", children: [
               a.image && /* @__PURE__ */ e(O, { src: a.image, alt: a.name }),
-              /* @__PURE__ */ e(A, { className: "bg-surface-3 text-ds-xs font-semibold text-accent-fg", children: L(a.name) })
+              /* @__PURE__ */ e(A, { className: "bg-surface-raised-hover text-ds-xs font-semibold text-surface-fg", children: L(a.name) })
             ] }),
             /* @__PURE__ */ e("span", { className: "text-ds-sm text-surface-fg-muted", children: a.name.split(" ")[0] }),
             !u && /* @__PURE__ */ e(
@@ -346,7 +346,7 @@ const Te = i.forwardRef(
               {
                 type: "button",
                 onClick: () => f(a.id),
-                className: "ml-ds-01 rounded-ds-full p-ds-01 transition-colors hover:bg-surface-3",
+                className: "ml-ds-01 rounded-ds-full p-ds-01 transition-colors hover:bg-surface-raised-hover",
                 "aria-label": `Remove ${a.name}`,
                 children: /* @__PURE__ */ e(B, { className: "h-ds-03 w-ds-03 text-surface-fg-subtle" })
               }
@@ -360,13 +360,13 @@ const Te = i.forwardRef(
         {
           members: m,
           selectedIds: t,
-          onSelect: g,
+          onSelect: h,
           multiple: !0,
           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-surface-border transition-colors hover:bg-surface-3 hover:border-surface-border",
+              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-raised-hover hover:border-surface-border",
               "aria-label": "Add assignee",
               children: /* @__PURE__ */ e(j, { className: "h-3 w-3 text-surface-fg-subtle" })
             }
@@ -386,47 +386,47 @@ function Pe(r) {
   });
 }
 function Ce(r) {
-  const s = r.getFullYear(), n = String(r.getMonth() + 1).padStart(2, "0"), l = String(r.getDate()).padStart(2, "0");
-  return `${s}-${n}-${l}`;
+  const s = r.getFullYear(), n = String(r.getMonth() + 1).padStart(2, "0"), o = String(r.getDate()).padStart(2, "0");
+  return `${s}-${n}-${o}`;
 }
 function De() {
-  const r = /* @__PURE__ */ new Date(), s = r.getDay(), n = s === 0 ? 1 : 8 - s, l = new Date(r);
-  return l.setDate(r.getDate() + n), l;
+  const r = /* @__PURE__ */ new Date(), s = r.getDay(), n = s === 0 ? 1 : 8 - s, o = new Date(r);
+  return o.setDate(r.getDate() + n), o;
 }
 function R(r) {
   const s = /* @__PURE__ */ new Date();
   return s.setDate(s.getDate() + r), s;
 }
-const Ie = i.forwardRef(
-  function({ value: s, onChange: n, presets: l = !0, readOnly: f, className: u }, h) {
-    const [o, t] = i.useState(!1), m = i.useMemo(() => s ? s instanceof Date ? s : new Date(s) : null, [s]), g = m ? Pe(m) : "No date", a = (y) => {
+const Ie = c.forwardRef(
+  function({ value: s, onChange: n, presets: o = !0, readOnly: f, className: u }, g) {
+    const [d, t] = c.useState(!1), m = c.useMemo(() => s ? s instanceof Date ? s : new Date(s) : null, [s]), h = m ? Pe(m) : "No date", a = (y) => {
       n(y), t(!1);
     }, k = (y) => {
       n(y.target.value ? new Date(y.target.value) : null);
     }, x = (y) => {
       y.stopPropagation(), n(null);
     };
-    return f ? /* @__PURE__ */ e("span", { className: p("px-ds-03 py-ds-02 text-ds-md text-surface-fg", u), children: g }) : /* @__PURE__ */ c("div", { className: p("inline-flex items-center gap-ds-02", u), children: [
-      /* @__PURE__ */ c(T, { open: o, onOpenChange: t, children: [
-        /* @__PURE__ */ e(P, { asChild: !0, children: /* @__PURE__ */ c(
+    return f ? /* @__PURE__ */ e("span", { className: p("px-ds-03 py-ds-02 text-ds-md text-surface-fg", u), children: h }) : /* @__PURE__ */ i("div", { className: p("inline-flex items-center gap-ds-02", u), children: [
+      /* @__PURE__ */ i(T, { open: d, onOpenChange: t, children: [
+        /* @__PURE__ */ e(P, { asChild: !0, children: /* @__PURE__ */ i(
           "button",
           {
-            ref: h,
+            ref: g,
             type: "button",
-            className: "inline-flex items-center gap-ds-02b rounded-ds-md px-ds-03 py-ds-02 text-ds-md transition-colors hover:bg-surface-3",
+            className: "inline-flex items-center gap-ds-02b rounded-ds-md px-ds-03 py-ds-02 text-ds-md transition-colors hover:bg-surface-raised-hover",
             children: [
-              /* @__PURE__ */ e(le, { className: "h-ico-sm w-ico-sm text-surface-fg-subtle", stroke: 1.5 }),
-              /* @__PURE__ */ e("span", { className: m ? "text-surface-fg" : "text-surface-fg-subtle", children: g })
+              /* @__PURE__ */ e(oe, { className: "h-ico-sm w-ico-sm text-surface-fg-subtle", stroke: 1.5 }),
+              /* @__PURE__ */ e("span", { className: m ? "text-surface-fg" : "text-surface-fg-subtle", children: h })
             ]
           }
         ) }),
         /* @__PURE__ */ e(
           C,
           {
-            className: "w-[220px] border-surface-border-strong bg-surface-1 p-ds-03",
+            className: "w-[220px] border-surface-border-strong bg-surface-overlay p-ds-03",
             align: "start",
             sideOffset: 4,
-            children: /* @__PURE__ */ c("div", { className: "space-y-ds-03", children: [
+            children: /* @__PURE__ */ i("div", { className: "space-y-ds-03", children: [
               /* @__PURE__ */ e(
                 "input",
                 {
@@ -437,15 +437,15 @@ const Ie = i.forwardRef(
                   className: "w-full rounded-ds-md border border-surface-border-strong bg-transparent px-ds-03 py-ds-02 text-ds-md text-surface-fg outline-none focus:border-accent-7"
                 }
               ),
-              l && /* @__PURE__ */ c("div", { className: "space-y-ds-01", children: [
+              o && /* @__PURE__ */ i("div", { className: "space-y-ds-01", children: [
                 /* @__PURE__ */ e("p", { className: "text-ds-xs font-semibold uppercase tracking-wider text-surface-fg-subtle", children: "Quick select" }),
-                /* @__PURE__ */ c("div", { className: "grid grid-cols-2 gap-ds-02", children: [
+                /* @__PURE__ */ i("div", { className: "grid grid-cols-2 gap-ds-02", children: [
                   /* @__PURE__ */ e(
                     "button",
                     {
                       type: "button",
                       onClick: () => a(/* @__PURE__ */ new Date()),
-                      className: "rounded-ds-md px-ds-03 py-ds-02 text-left text-ds-sm text-surface-fg transition-colors hover:bg-surface-3",
+                      className: "rounded-ds-md px-ds-03 py-ds-02 text-left text-ds-sm text-surface-fg transition-colors hover:bg-surface-raised-hover",
                       children: "Today"
                     }
                   ),
@@ -454,7 +454,7 @@ const Ie = i.forwardRef(
                     {
                       type: "button",
                       onClick: () => a(R(1)),
-                      className: "rounded-ds-md px-ds-03 py-ds-02 text-left text-ds-sm text-surface-fg transition-colors hover:bg-surface-3",
+                      className: "rounded-ds-md px-ds-03 py-ds-02 text-left text-ds-sm text-surface-fg transition-colors hover:bg-surface-raised-hover",
                       children: "Tomorrow"
                     }
                   ),
@@ -463,7 +463,7 @@ const Ie = i.forwardRef(
                     {
                       type: "button",
                       onClick: () => a(De()),
-                      className: "rounded-ds-md px-ds-03 py-ds-02 text-left text-ds-sm text-surface-fg transition-colors hover:bg-surface-3",
+                      className: "rounded-ds-md px-ds-03 py-ds-02 text-left text-ds-sm text-surface-fg transition-colors hover:bg-surface-raised-hover",
                       children: "Next Monday"
                     }
                   ),
@@ -472,7 +472,7 @@ const Ie = i.forwardRef(
                     {
                       type: "button",
                       onClick: () => a(R(7)),
-                      className: "rounded-ds-md px-ds-03 py-ds-02 text-left text-ds-sm text-surface-fg transition-colors hover:bg-surface-3",
+                      className: "rounded-ds-md px-ds-03 py-ds-02 text-left text-ds-sm text-surface-fg transition-colors hover:bg-surface-raised-hover",
                       children: "+7 days"
                     }
                   ),
@@ -481,7 +481,7 @@ const Ie = i.forwardRef(
                     {
                       type: "button",
                       onClick: () => a(R(14)),
-                      className: "rounded-ds-md px-ds-03 py-ds-02 text-left text-ds-sm text-surface-fg transition-colors hover:bg-surface-3",
+                      className: "rounded-ds-md px-ds-03 py-ds-02 text-left text-ds-sm text-surface-fg transition-colors hover:bg-surface-raised-hover",
                       children: "+14 days"
                     }
                   ),
@@ -490,7 +490,7 @@ const Ie = i.forwardRef(
                     {
                       type: "button",
                       onClick: () => a(null),
-                      className: "rounded-ds-md px-ds-03 py-ds-02 text-left text-ds-sm text-surface-fg-subtle transition-colors hover:bg-surface-3",
+                      className: "rounded-ds-md px-ds-03 py-ds-02 text-left text-ds-sm text-surface-fg-subtle transition-colors hover:bg-surface-raised-hover",
                       children: "Clear"
                     }
                   )
@@ -505,7 +505,7 @@ const Ie = i.forwardRef(
         {
           type: "button",
           onClick: x,
-          className: "rounded-ds-md p-ds-02 transition-colors hover:bg-surface-3",
+          className: "rounded-ds-md p-ds-02 transition-colors hover:bg-surface-raised-hover",
           "aria-label": "Clear due date",
           children: /* @__PURE__ */ e(B, { className: "h-3 w-3 text-surface-fg-subtle" })
         }
@@ -514,35 +514,35 @@ const Ie = i.forwardRef(
   }
 );
 Ie.displayName = "TaskDatePicker";
-const Re = i.forwardRef(
-  function({ value: s, onChange: n, availableLabels: l = [], readOnly: f, className: u }, h) {
-    const [o, t] = i.useState(""), [m, g] = i.useState(!1), [a, k] = i.useState(!1), x = i.useRef(null), y = i.useRef(!1), N = i.useMemo(() => {
-      const d = /* @__PURE__ */ new Map();
-      for (const b of l)
-        d.set(b.name, b.color);
-      return d;
-    }, [l]), w = i.useMemo(() => {
-      if (!o.trim()) return [];
-      const d = o.toLowerCase();
-      return l.filter(
-        (b) => b.name.toLowerCase().includes(d) && !s.includes(b.name)
+const Re = c.forwardRef(
+  function({ value: s, onChange: n, availableLabels: o = [], readOnly: f, className: u }, g) {
+    const [d, t] = c.useState(""), [m, h] = c.useState(!1), [a, k] = c.useState(!1), x = c.useRef(null), y = c.useRef(!1), N = c.useMemo(() => {
+      const l = /* @__PURE__ */ new Map();
+      for (const b of o)
+        l.set(b.name, b.color);
+      return l;
+    }, [o]), v = c.useMemo(() => {
+      if (!d.trim()) return [];
+      const l = d.toLowerCase();
+      return o.filter(
+        (b) => b.name.toLowerCase().includes(l) && !s.includes(b.name)
       );
-    }, [o, l, s]), D = (d) => {
-      const b = d.trim();
-      b && !s.includes(b) && n([...s, b]), t(""), g(!1), k(!1);
-    }, U = (d) => {
-      n(s.filter((b) => b !== d));
-    }, X = (d) => {
-      d.key === "Enter" && (d.preventDefault(), w.length > 0 ? D(w[0].name) : D(o)), d.key === "Escape" && (g(!1), t(""), k(!1));
-    }, Z = (d) => {
-      t(d.target.value);
+    }, [d, o, s]), D = (l) => {
+      const b = l.trim();
+      b && !s.includes(b) && n([...s, b]), t(""), h(!1), k(!1);
+    }, U = (l) => {
+      n(s.filter((b) => b !== l));
+    }, X = (l) => {
+      l.key === "Enter" && (l.preventDefault(), v.length > 0 ? D(v[0].name) : D(d)), l.key === "Escape" && (h(!1), t(""), k(!1));
+    }, Z = (l) => {
+      t(l.target.value);
     };
-    return i.useEffect(() => {
-      k(o.trim().length > 0 && w.length > 0);
-    }, [w, o]), /* @__PURE__ */ c("div", { ref: h, className: p("flex flex-wrap items-center gap-ds-02b", u), children: [
-      s.map((d) => {
-        const b = N.get(d);
-        return /* @__PURE__ */ c(
+    return c.useEffect(() => {
+      k(d.trim().length > 0 && v.length > 0);
+    }, [v, d]), /* @__PURE__ */ i("div", { ref: g, className: p("flex flex-wrap items-center gap-ds-02b", u), children: [
+      s.map((l) => {
+        const b = N.get(l);
+        return /* @__PURE__ */ i(
           "span",
           {
             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",
@@ -554,29 +554,29 @@ const Re = i.forwardRef(
                   style: { backgroundColor: b }
                 }
               ),
-              d,
+              l,
               !f && /* @__PURE__ */ e(
                 "button",
                 {
                   type: "button",
-                  onClick: () => U(d),
-                  className: "rounded-ds-full p-ds-01 transition-colors hover:bg-surface-3",
-                  "aria-label": `Remove label ${d}`,
+                  onClick: () => U(l),
+                  className: "rounded-ds-full p-ds-01 transition-colors hover:bg-surface-raised-hover",
+                  "aria-label": `Remove label ${l}`,
                   children: /* @__PURE__ */ e(B, { className: "h-ds-03 w-ds-03" })
                 }
               )
             ]
           },
-          d
+          l
         );
       }),
-      !f && (m ? /* @__PURE__ */ c(T, { open: a, onOpenChange: k, children: [
+      !f && (m ? /* @__PURE__ */ i(T, { open: a, onOpenChange: k, children: [
         /* @__PURE__ */ e(P, { asChild: !0, children: /* @__PURE__ */ e("div", { className: "inline-flex items-center gap-ds-02", children: /* @__PURE__ */ e(
           "input",
           {
             ref: x,
             type: "text",
-            value: o,
+            value: d,
             onChange: Z,
             onKeyDown: X,
             onBlur: () => {
@@ -584,7 +584,7 @@ const Re = i.forwardRef(
                 y.current = !1;
                 return;
               }
-              o.trim() ? D(o) : (g(!1), k(!1));
+              d.trim() ? D(d) : (h(!1), k(!1));
             },
             placeholder: "Label name",
             "aria-label": "New label name",
@@ -592,33 +592,33 @@ const Re = i.forwardRef(
             autoFocus: !0
           }
         ) }) }),
-        w.length > 0 && /* @__PURE__ */ e(
+        v.length > 0 && /* @__PURE__ */ e(
           C,
           {
-            className: "w-[180px] border-surface-border-strong bg-surface-1 p-ds-02",
+            className: "w-[180px] border-surface-border-strong bg-surface-overlay p-ds-02",
             align: "start",
             sideOffset: 4,
-            onOpenAutoFocus: (d) => d.preventDefault(),
-            children: w.map((d) => /* @__PURE__ */ c(
+            onOpenAutoFocus: (l) => l.preventDefault(),
+            children: v.map((l) => /* @__PURE__ */ i(
               "button",
               {
                 type: "button",
                 onMouseDown: (b) => {
-                  b.preventDefault(), y.current = !0, D(d.name);
+                  b.preventDefault(), y.current = !0, D(l.name);
                 },
-                className: "flex w-full items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b text-left text-ds-sm transition-colors hover:bg-surface-3",
+                className: "flex w-full items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b text-left text-ds-sm transition-colors hover:bg-surface-raised-hover",
                 children: [
-                  d.color && /* @__PURE__ */ e(
+                  l.color && /* @__PURE__ */ e(
                     "span",
                     {
                       className: "h-2 w-2 shrink-0 rounded-ds-full",
-                      style: { backgroundColor: d.color }
+                      style: { backgroundColor: l.color }
                     }
                   ),
-                  /* @__PURE__ */ e("span", { className: "text-surface-fg", children: d.name })
+                  /* @__PURE__ */ e("span", { className: "text-surface-fg", children: l.name })
                 ]
               },
-              d.name
+              l.name
             ))
           }
         )
@@ -626,8 +626,8 @@ const Re = i.forwardRef(
         "button",
         {
           type: "button",
-          onClick: () => g(!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",
+          onClick: () => h(!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-raised-hover hover:border-surface-border",
           "aria-label": "Add label",
           children: /* @__PURE__ */ e(j, { className: "h-3 w-3 text-surface-fg-subtle" })
         }
@@ -640,43 +640,43 @@ Re.displayName = "TaskLabelEditor";
 const S = [
   {
     value: "INTERNAL",
-    icon: oe,
+    icon: de,
     label: "Internal",
     description: "Only team members"
   },
   {
     value: "EVERYONE",
-    icon: de,
+    icon: le,
     label: "Everyone",
     description: "Visible to clients"
   }
-], Se = i.forwardRef(
-  function({ value: s, onChange: n, confirmOnPublic: l, readOnly: f, className: u }, h) {
-    const [o, t] = i.useState(!1), [m, g] = i.useState(!1), a = S.find((N) => N.value === s) ?? S[0], k = a.icon, x = (N) => {
+], Se = c.forwardRef(
+  function({ value: s, onChange: n, confirmOnPublic: o, readOnly: f, className: u }, g) {
+    const [d, t] = c.useState(!1), [m, h] = c.useState(!1), a = S.find((N) => N.value === s) ?? S[0], k = a.icon, x = (N) => {
       if (N === s) {
         t(!1);
         return;
       }
-      if (N === "EVERYONE" && l) {
-        t(!1), g(!0);
+      if (N === "EVERYONE" && o) {
+        t(!1), h(!0);
         return;
       }
       n(N), t(!1);
     }, y = () => {
-      n("EVERYONE"), g(!1);
+      n("EVERYONE"), h(!1);
     };
-    return f ? /* @__PURE__ */ c("div", { className: p("inline-flex items-center gap-ds-02b px-ds-03 py-ds-02 text-ds-md text-surface-fg", u), children: [
+    return f ? /* @__PURE__ */ i("div", { className: p("inline-flex items-center gap-ds-02b px-ds-03 py-ds-02 text-ds-md text-surface-fg", u), children: [
       /* @__PURE__ */ e(k, { className: "h-ico-sm w-ico-sm", stroke: 1.5 }),
       /* @__PURE__ */ e("span", { children: a.label })
-    ] }) : /* @__PURE__ */ c(E, { children: [
-      /* @__PURE__ */ c(T, { open: o, onOpenChange: t, children: [
-        /* @__PURE__ */ e(P, { asChild: !0, children: /* @__PURE__ */ c(
+    ] }) : /* @__PURE__ */ i(E, { children: [
+      /* @__PURE__ */ i(T, { open: d, onOpenChange: t, children: [
+        /* @__PURE__ */ e(P, { asChild: !0, children: /* @__PURE__ */ i(
           "button",
           {
-            ref: h,
+            ref: g,
             type: "button",
             className: p(
-              "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",
+              "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-raised-hover",
               u
             ),
             children: [
@@ -689,24 +689,24 @@ const S = [
         /* @__PURE__ */ e(
           C,
           {
-            className: "w-[220px] border-surface-border-strong bg-surface-1 p-ds-02",
+            className: "w-[220px] border-surface-border-strong bg-surface-overlay p-ds-02",
             align: "start",
             sideOffset: 4,
             children: S.map((N) => {
-              const w = N.icon;
-              return /* @__PURE__ */ c(
+              const v = N.icon;
+              return /* @__PURE__ */ i(
                 "button",
                 {
                   type: "button",
                   onClick: () => x(N.value),
                   className: p(
                     "flex w-full items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b text-left transition-colors",
-                    "hover:bg-surface-3",
-                    N.value === s && "bg-surface-3"
+                    "hover:bg-surface-raised-hover",
+                    N.value === s && "bg-surface-raised-hover"
                   ),
                   children: [
-                    /* @__PURE__ */ e(w, { className: "h-ico-sm w-ico-sm shrink-0 text-surface-fg-muted", stroke: 1.5 }),
-                    /* @__PURE__ */ c("div", { className: "flex-1 min-w-0", children: [
+                    /* @__PURE__ */ e(v, { className: "h-ico-sm w-ico-sm shrink-0 text-surface-fg-muted", stroke: 1.5 }),
+                    /* @__PURE__ */ i("div", { className: "flex-1 min-w-0", children: [
                       /* @__PURE__ */ e("div", { className: "text-ds-md text-surface-fg", children: N.label }),
                       /* @__PURE__ */ e("div", { className: "text-ds-xs text-surface-fg-subtle", children: N.description })
                     ] }),
@@ -719,12 +719,12 @@ const S = [
           }
         )
       ] }),
-      /* @__PURE__ */ e(ue, { open: m, onOpenChange: g, children: /* @__PURE__ */ c(fe, { children: [
-        /* @__PURE__ */ c(me, { children: [
+      /* @__PURE__ */ e(ue, { open: m, onOpenChange: h, children: /* @__PURE__ */ i(fe, { children: [
+        /* @__PURE__ */ i(me, { children: [
           /* @__PURE__ */ e(pe, { children: "Make visible to everyone?" }),
-          /* @__PURE__ */ e(ge, { children: "This task will become visible to clients. Team-only comments and internal details may be exposed. Are you sure you want to continue?" })
+          /* @__PURE__ */ e(he, { children: "This task will become visible to clients. Team-only comments and internal details may be exposed. Are you sure you want to continue?" })
         ] }),
-        /* @__PURE__ */ c(he, { children: [
+        /* @__PURE__ */ i(ge, { children: [
           /* @__PURE__ */ e(be, { asChild: !0, children: /* @__PURE__ */ e(Y, { variant: "outline", children: "Cancel" }) }),
           /* @__PURE__ */ e(Y, { onClick: y, children: "Confirm" })
         ] })
@@ -748,11 +748,11 @@ export {
   as as ReviewCard,
   rs as ReviewRequestButton,
   ns as ReviewResponseForm,
-  cs as ReviewTab,
-  is as SubtaskAddForm,
-  ls as SubtaskItem,
-  os as SubtaskList,
-  ds as SubtaskProgress,
+  is as ReviewTab,
+  cs as SubtaskAddForm,
+  os as SubtaskItem,
+  ds as SubtaskList,
+  ls as SubtaskProgress,
   us as SubtasksTab,
   fs as TaskActionRow,
   Te as TaskAssigneePicker,
@@ -760,10 +760,10 @@ export {
   Ie as TaskDatePicker,
   ms as TaskDetailPanel,
   Re as TaskLabelEditor,
-  ve as TaskMemberPicker,
+  we as TaskMemberPicker,
   Ke as TaskPanel,
-  we as TaskPriorityPicker,
+  ve as TaskPriorityPicker,
   ps as TaskProperties,
   Se as TaskVisibilityPicker,
-  gs as VisibilityWarning
+  hs as VisibilityWarning
 };