@devalok/shilp-sutra-karm 0.9.0 → 0.11.0

package/dist/_chunks/kanban-board.js

@@ -1,382 +1,1645 @@
 "use client";
-import { jsx as e, jsxs as c, Fragment as X } from "react/jsx-runtime";
-import * as F from "react";
-import { useState as O, useRef as J, useEffect as Z, useMemo as le, useCallback as L } from "react";
-import { u as se } from "./use-composed-ref.js";
-import { createPortal as me } from "react-dom";
-import { u as fe, C as ue, c as he, a as pe, S as re, v as xe, b as be, d as U, D as ge, e as ve, h as ye, f as Ne, s as we, K as ke, T as Ie, P as De } from "./vendor.js";
-import { cn as j } from "@devalok/shilp-sutra/ui/lib/utils";
-import { Button as $ } from "@devalok/shilp-sutra/ui/button";
-import { Input as H } from "@devalok/shilp-sutra/ui/input";
-import { DropdownMenu as Ce, DropdownMenuTrigger as Se, DropdownMenuContent as Oe, DropdownMenuItem as q, DropdownMenuSeparator as Ee } from "@devalok/shilp-sutra/ui/dropdown-menu";
-import { IconGripVertical as Re, IconCalendar as Be, IconEye as ee, IconPlus as Q, IconDots as Ke, IconPencil as Ae, IconEyeOff as Te, IconTrash as ze } from "@tabler/icons-react";
-import { Badge as Le } from "@devalok/shilp-sutra/ui";
-import { AvatarGroup as $e } from "@devalok/shilp-sutra/composed/avatar-group";
-import { P as je, a as Me } from "./task-constants.js";
-function _e(s) {
-  const t = new Date(s), r = /* @__PURE__ */ new Date(), h = t.getTime() - r.getTime(), m = Math.ceil(h / (1e3 * 60 * 60 * 24));
-  return m < 0 ? { label: "Overdue", className: "text-text-error" } : m === 0 ? { label: "Today", className: "text-text-warning" } : m === 1 ? { label: "Tomorrow", className: "text-text-warning" } : {
+import { jsx as e, jsxs as a, Fragment as se } from "react/jsx-runtime";
+import * as j from "react";
+import { useMemo as ne, useState as A, useEffect as oe, useCallback as E, useContext as Ye, createContext as qe, useRef as ae } from "react";
+import { createPortal as Xe } from "react-dom";
+import { u as Ce, C as Ne, c as Ie, a as Je, S as De, v as Ze, b as et, d as he, D as tt, e as st, h as nt, f as at, s as rt, K as it, T as ot, P as lt } from "./vendor.js";
+import { cn as I } from "@devalok/shilp-sutra/ui/lib/utils";
+import { Input as re } from "@devalok/shilp-sutra/ui/input";
+import { Button as O } from "@devalok/shilp-sutra/ui/button";
+import { Badge as ct } from "@devalok/shilp-sutra/ui/badge";
+import { DropdownMenu as z, DropdownMenuTrigger as V, DropdownMenuContent as F, DropdownMenuLabel as Q, DropdownMenuSeparator as G, DropdownMenuCheckboxItem as ge, DropdownMenuRadioGroup as dt, DropdownMenuRadioItem as mt, DropdownMenuItem as $ } from "@devalok/shilp-sutra/ui/dropdown-menu";
+import { SegmentedControl as ut } from "@devalok/shilp-sutra/ui/segmented-control";
+import { IconX as ie, IconSearch as ht, IconFilter as gt, IconUser as q, IconLayoutGrid as ft, IconLayoutList as pt, IconArrowRight as fe, IconAlertTriangle as le, IconEye as X, IconTrash as pe, IconPlus as xe, IconDots as xt, IconPencil as yt, IconGauge as vt, IconEyeOff as Te, IconCalendar as ye, IconCheck as wt, IconArrowUp as Re, IconArrowDown as Se, IconGripVertical as bt, IconSubtask as kt, IconLock as Ct, IconTag as Nt } from "@tabler/icons-react";
+import { AvatarGroup as It } from "@devalok/shilp-sutra/composed/avatar-group";
+import { u as Ae } from "./use-composed-ref.js";
+import { Checkbox as Me } from "@devalok/shilp-sutra/ui";
+import { Avatar as Dt, AvatarImage as Tt, AvatarFallback as Rt } from "@devalok/shilp-sutra/ui/avatar";
+import { ContextMenu as St, ContextMenuTrigger as At, ContextMenuContent as Mt, ContextMenuSub as Z, ContextMenuSubTrigger as ee, ContextMenuSubContent as te, ContextMenuItem as H, ContextMenuSeparator as Lt } from "@devalok/shilp-sutra/ui/context-menu";
+const Et = 320, ve = [
+  "bg-category-cyan",
+  "bg-category-amber",
+  "bg-category-teal",
+  "bg-category-indigo",
+  "bg-category-orange",
+  "bg-category-emerald",
+  "bg-category-slate",
+  "bg-accent"
+], fs = {
+  LOW: "IconArrowDown",
+  MEDIUM: "IconArrowRight",
+  HIGH: "IconArrowUp",
+  URGENT: "IconAlertTriangle"
+}, ce = {
+  LOW: "text-text-tertiary",
+  MEDIUM: "text-warning",
+  HIGH: "text-error",
+  URGENT: "text-error"
+}, we = {
+  search: "",
+  assignees: [],
+  priorities: [],
+  labels: [],
+  dueDateRange: null
+};
+function Ot(s, t) {
+  if (t.search) {
+    const n = t.search.toLowerCase();
+    if (!s.title.toLowerCase().includes(n) && !s.taskId.toLowerCase().includes(n))
+      return !1;
+  }
+  if (t.priorities.length > 0 && !t.priorities.includes(s.priority))
+    return !1;
+  if (t.assignees.length > 0) {
+    const n = [
+      ...s.owner ? [s.owner.id] : [],
+      ...s.assignees.map((r) => r.id)
+    ];
+    if (!t.assignees.some((r) => n.includes(r))) return !1;
+  }
+  if (t.labels.length > 0 && !t.labels.some((n) => s.labels.includes(n)))
+    return !1;
+  if (t.dueDateRange && t.dueDateRange !== "none") {
+    if (!s.dueDate) return !1;
+    const n = new Date(s.dueDate), r = /* @__PURE__ */ new Date();
+    r.setHours(0, 0, 0, 0);
+    const o = new Date(r);
+    switch (o.setHours(23, 59, 59, 999), t.dueDateRange) {
+      case "overdue":
+        if (n >= r) return !1;
+        break;
+      case "today":
+        if (n < r || n > o) return !1;
+        break;
+      case "this-week": {
+        const h = new Date(r);
+        if (h.setDate(r.getDate() + (7 - r.getDay())), h.setHours(23, 59, 59, 999), n > h) return !1;
+        break;
+      }
+    }
+  }
+  return !0;
+}
+function Bt(s, t) {
+  return ne(() => t.search !== "" || t.priorities.length > 0 || t.assignees.length > 0 || t.labels.length > 0 || t.dueDateRange != null && t.dueDateRange !== "none" ? s.map((r) => ({
+    ...r,
+    tasks: r.tasks.filter((o) => Ot(o, t))
+  })) : s, [s, t]);
+}
+const Le = qe(null);
+function U() {
+  const s = Ye(Le);
+  if (!s) throw new Error("useBoardContext must be used within <BoardProvider>");
+  return s;
+}
+const L = () => {
+};
+function Pt({
+  initialData: s,
+  currentUserId: t = null,
+  children: n,
+  ...r
+}) {
+  const [o, h] = A(s.columns);
+  oe(() => {
+    h(s.columns);
+  }, [s]);
+  const [b, v] = A("default"), [d, c] = A(we), x = E((B) => {
+    c((_) => ({ ..._, ...B }));
+  }, []), T = E(() => c(we), []), y = ne(
+    () => d.search !== "" || d.priorities.length > 0 || d.assignees.length > 0 || d.labels.length > 0 || d.dueDateRange != null && d.dueDateRange !== "none",
+    [d]
+  ), g = Bt(o, d), [S, u] = A(/* @__PURE__ */ new Set()), k = E((B) => {
+    u((_) => {
+      const P = new Set(_);
+      return P.has(B) ? P.delete(B) : P.add(B), P;
+    });
+  }, []), l = E(
+    (B, _) => {
+      const P = g.flatMap((W) => W.tasks), Y = P.findIndex((W) => W.id === B), K = P.findIndex((W) => W.id === _);
+      if (Y === -1 || K === -1) return;
+      const [J, me] = Y < K ? [Y, K] : [K, Y], ue = P.slice(J, me + 1).map((W) => W.id);
+      u((W) => {
+        const w = new Set(W);
+        return ue.forEach((je) => w.add(je)), w;
+      });
+    },
+    [g]
+  ), p = E(() => {
+    const B = g.flatMap((_) => _.tasks.map((P) => P.id));
+    u(new Set(B));
+  }, [g]), m = E(() => u(/* @__PURE__ */ new Set()), []), [C, i] = A(null), [f, D] = A(!1), [M, N] = A(null), R = ne(
+    () => ({
+      columns: g,
+      rawColumns: o,
+      viewMode: b,
+      setViewMode: v,
+      filters: d,
+      setFilters: x,
+      clearFilters: T,
+      hasActiveFilters: y,
+      selectedTaskIds: S,
+      toggleTaskSelection: k,
+      selectRange: l,
+      selectAll: p,
+      clearSelection: m,
+      focusedTaskId: C,
+      setFocusedTaskId: i,
+      currentUserId: t,
+      highlightMyTasks: f,
+      setHighlightMyTasks: D,
+      activeTask: M,
+      setActiveTask: N,
+      onTaskMove: r.onTaskMove ?? L,
+      onTaskAdd: r.onTaskAdd ?? L,
+      onBulkAction: r.onBulkAction ?? L,
+      onColumnReorder: r.onColumnReorder ?? L,
+      onColumnRename: r.onColumnRename ?? L,
+      onColumnDelete: r.onColumnDelete ?? L,
+      onColumnToggleVisibility: r.onColumnToggleVisibility ?? L,
+      onColumnWipLimitChange: r.onColumnWipLimitChange ?? L,
+      onClickTask: r.onClickTask ?? L,
+      onAddColumn: r.onAddColumn ?? L,
+      onQuickPriorityChange: r.onQuickPriorityChange ?? L,
+      onQuickAssign: r.onQuickAssign ?? L,
+      onQuickDueDateChange: r.onQuickDueDateChange ?? L,
+      onQuickLabelAdd: r.onQuickLabelAdd ?? L,
+      onQuickVisibilityChange: r.onQuickVisibilityChange ?? L,
+      onQuickDelete: r.onQuickDelete ?? L
+    }),
+    [
+      g,
+      o,
+      b,
+      d,
+      x,
+      T,
+      y,
+      S,
+      k,
+      l,
+      p,
+      m,
+      C,
+      t,
+      f,
+      M,
+      r
+    ]
+  );
+  return /* @__PURE__ */ e(Le.Provider, { value: R, children: n });
+}
+function de(s) {
+  const t = /* @__PURE__ */ new Set(), n = [];
+  for (const r of s)
+    for (const o of r.tasks) {
+      o.owner && !t.has(o.owner.id) && (t.add(o.owner.id), n.push(o.owner));
+      for (const h of o.assignees)
+        t.has(h.id) || (t.add(h.id), n.push(h));
+    }
+  return n;
+}
+function Ee(s) {
+  const t = /* @__PURE__ */ new Set();
+  for (const n of s)
+    for (const r of n.tasks)
+      for (const o of r.labels) t.add(o);
+  return Array.from(t).sort();
+}
+const Wt = ["LOW", "MEDIUM", "HIGH", "URGENT"], be = [
+  { value: "overdue", label: "Overdue" },
+  { value: "today", label: "Today" },
+  { value: "this-week", label: "This week" }
+];
+function Oe() {
+  const {
+    rawColumns: s,
+    filters: t,
+    setFilters: n,
+    clearFilters: r,
+    hasActiveFilters: o,
+    viewMode: h,
+    setViewMode: b,
+    highlightMyTasks: v,
+    setHighlightMyTasks: d
+  } = U(), [c, x] = A(t.search), T = ae(null), y = E(
+    (i) => {
+      const f = i.target.value;
+      x(f), T.current && clearTimeout(T.current), T.current = setTimeout(() => {
+        n({ search: f });
+      }, 200);
+    },
+    [n]
+  );
+  oe(() => {
+    x(t.search);
+  }, [t.search]);
+  const g = de(s), S = Ee(s), u = (i) => {
+    const f = t.priorities;
+    n({
+      priorities: f.includes(i) ? f.filter((D) => D !== i) : [...f, i]
+    });
+  }, k = (i) => {
+    const f = t.assignees;
+    n({
+      assignees: f.includes(i) ? f.filter((D) => D !== i) : [...f, i]
+    });
+  }, l = (i) => {
+    const f = t.labels;
+    n({
+      labels: f.includes(i) ? f.filter((D) => D !== i) : [...f, i]
+    });
+  }, p = (i) => {
+    n({
+      dueDateRange: i === t.dueDateRange ? null : i
+    });
+  }, m = [
+    { id: "default", text: "Board", icon: ft },
+    { id: "compact", text: "Compact", icon: pt }
+  ], C = [];
+  for (const i of t.priorities)
+    C.push({
+      key: `priority-${i}`,
+      label: i.charAt(0) + i.slice(1).toLowerCase(),
+      onRemove: () => u(i)
+    });
+  for (const i of t.assignees) {
+    const f = g.find((D) => D.id === i);
+    C.push({
+      key: `assignee-${i}`,
+      label: (f == null ? void 0 : f.name) ?? i,
+      onRemove: () => k(i)
+    });
+  }
+  for (const i of t.labels)
+    C.push({
+      key: `label-${i}`,
+      label: i,
+      onRemove: () => l(i)
+    });
+  if (t.dueDateRange && t.dueDateRange !== "none") {
+    const i = be.find((f) => f.value === t.dueDateRange);
+    C.push({
+      key: "due-date",
+      label: (i == null ? void 0 : i.label) ?? t.dueDateRange,
+      onRemove: () => n({ dueDateRange: null })
+    });
+  }
+  return /* @__PURE__ */ a("div", { className: "flex flex-col gap-ds-02", children: [
+    /* @__PURE__ */ a("div", { className: "flex items-center gap-ds-03", children: [
+      /* @__PURE__ */ e("div", { className: "relative flex-1 max-w-xs", children: /* @__PURE__ */ e(
+        re,
+        {
+          value: c,
+          onChange: y,
+          placeholder: "Search tasks...",
+          "aria-label": "Search tasks",
+          size: "sm",
+          startIcon: /* @__PURE__ */ e(ht, { className: "h-ico-sm w-ico-sm" }),
+          endIcon: c ? /* @__PURE__ */ e(
+            "button",
+            {
+              onClick: () => {
+                x(""), n({ search: "" });
+              },
+              className: "pointer-events-auto cursor-pointer text-text-tertiary hover:text-text-primary",
+              "aria-label": "Clear search",
+              children: /* @__PURE__ */ e(ie, { className: "h-3 w-3" })
+            }
+          ) : void 0
+        }
+      ) }),
+      /* @__PURE__ */ a("div", { className: "flex items-center gap-ds-01", children: [
+        /* @__PURE__ */ a(z, { children: [
+          /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ a(
+            O,
+            {
+              variant: "ghost",
+              size: "sm",
+              className: I(
+                t.priorities.length > 0 && "text-interactive"
+              ),
+              title: "Filter by priority",
+              children: [
+                /* @__PURE__ */ e(gt, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
+                "Priority",
+                t.priorities.length > 0 && /* @__PURE__ */ a("span", { className: "ml-ds-01 text-ds-xs", children: [
+                  "(",
+                  t.priorities.length,
+                  ")"
+                ] })
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ a(F, { align: "start", className: "w-44", children: [
+            /* @__PURE__ */ e(Q, { children: "Priority" }),
+            /* @__PURE__ */ e(G, {}),
+            Wt.map((i) => /* @__PURE__ */ e(
+              ge,
+              {
+                checked: t.priorities.includes(i),
+                onCheckedChange: () => u(i),
+                children: i.charAt(0) + i.slice(1).toLowerCase()
+              },
+              i
+            ))
+          ] })
+        ] }),
+        g.length > 0 && /* @__PURE__ */ a(z, { children: [
+          /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ a(
+            O,
+            {
+              variant: "ghost",
+              size: "sm",
+              className: I(
+                t.assignees.length > 0 && "text-interactive"
+              ),
+              title: "Filter by assignee",
+              children: [
+                /* @__PURE__ */ e(q, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
+                "Assignee",
+                t.assignees.length > 0 && /* @__PURE__ */ a("span", { className: "ml-ds-01 text-ds-xs", children: [
+                  "(",
+                  t.assignees.length,
+                  ")"
+                ] })
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ a(F, { align: "start", className: "w-48 max-h-56 overflow-y-auto", children: [
+            /* @__PURE__ */ e(Q, { children: "Assignee" }),
+            /* @__PURE__ */ e(G, {}),
+            g.map((i) => /* @__PURE__ */ e(
+              ge,
+              {
+                checked: t.assignees.includes(i.id),
+                onCheckedChange: () => k(i.id),
+                children: i.name
+              },
+              i.id
+            ))
+          ] })
+        ] }),
+        S.length > 0 && /* @__PURE__ */ a(z, { children: [
+          /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ a(
+            O,
+            {
+              variant: "ghost",
+              size: "sm",
+              className: I(
+                t.labels.length > 0 && "text-interactive"
+              ),
+              title: "Filter by label",
+              children: [
+                "Label",
+                t.labels.length > 0 && /* @__PURE__ */ a("span", { className: "ml-ds-01 text-ds-xs", children: [
+                  "(",
+                  t.labels.length,
+                  ")"
+                ] })
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ a(F, { align: "start", className: "w-44 max-h-56 overflow-y-auto", children: [
+            /* @__PURE__ */ e(Q, { children: "Label" }),
+            /* @__PURE__ */ e(G, {}),
+            S.map((i) => /* @__PURE__ */ e(
+              ge,
+              {
+                checked: t.labels.includes(i),
+                onCheckedChange: () => l(i),
+                children: i
+              },
+              i
+            ))
+          ] })
+        ] }),
+        /* @__PURE__ */ a(z, { children: [
+          /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ e(
+            O,
+            {
+              variant: "ghost",
+              size: "sm",
+              className: I(
+                t.dueDateRange && t.dueDateRange !== "none" && "text-interactive"
+              ),
+              title: "Filter by due date",
+              children: "Due date"
+            }
+          ) }),
+          /* @__PURE__ */ a(F, { align: "start", className: "w-40", children: [
+            /* @__PURE__ */ e(Q, { children: "Due date" }),
+            /* @__PURE__ */ e(G, {}),
+            /* @__PURE__ */ e(
+              dt,
+              {
+                value: t.dueDateRange ?? "",
+                onValueChange: p,
+                children: be.map((i) => /* @__PURE__ */ e(mt, { value: i.value, children: i.label }, i.value))
+              }
+            )
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ e("div", { className: "flex-1" }),
+      /* @__PURE__ */ e(
+        O,
+        {
+          variant: v ? "outline" : "ghost",
+          size: "sm",
+          onClick: () => d(!v),
+          title: "Highlight my tasks",
+          "aria-label": "Highlight my tasks",
+          "aria-pressed": v,
+          className: I(v && "text-interactive"),
+          children: /* @__PURE__ */ e(q, { className: "h-ico-sm w-ico-sm" })
+        }
+      ),
+      /* @__PURE__ */ e(
+        ut,
+        {
+          size: "sm",
+          variant: "tonal",
+          options: m,
+          selectedId: h,
+          onSelect: (i) => b(i)
+        }
+      )
+    ] }),
+    C.length > 0 && /* @__PURE__ */ a("div", { className: "flex items-center gap-ds-02 flex-wrap", children: [
+      C.map((i, f) => /* @__PURE__ */ e(
+        "div",
+        {
+          className: "animate-scale-in delay-stagger",
+          style: { "--stagger-index": f },
+          children: /* @__PURE__ */ e(
+            ct,
+            {
+              variant: "subtle",
+              size: "sm",
+              onDismiss: i.onRemove,
+              children: i.label
+            }
+          )
+        },
+        i.key
+      )),
+      /* @__PURE__ */ e(
+        "button",
+        {
+          onClick: r,
+          className: "text-ds-xs text-text-tertiary hover:text-interactive transition-colors",
+          "aria-label": "Clear all filters",
+          children: "Clear all"
+        }
+      )
+    ] })
+  ] });
+}
+Oe.displayName = "BoardToolbar";
+const $t = ["LOW", "MEDIUM", "HIGH", "URGENT"];
+function Be() {
+  const {
+    rawColumns: s,
+    columns: t,
+    selectedTaskIds: n,
+    clearSelection: r,
+    onBulkAction: o
+  } = U(), h = n.size, b = Array.from(n), v = de(s), d = (c, x) => {
+    o({ type: c, taskIds: b, value: x }), r();
+  };
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      className: I(
+        "grid transition-[grid-template-rows,opacity] duration-moderate-02 ease-expressive-entrance",
+        h > 0 ? "grid-rows-[1fr] opacity-100" : "grid-rows-[0fr] opacity-0"
+      ),
+      "aria-live": "polite",
+      children: /* @__PURE__ */ e("div", { className: "overflow-hidden", children: /* @__PURE__ */ a("div", { className: "flex items-center gap-ds-03 py-ds-02", children: [
+        /* @__PURE__ */ a("div", { className: "flex items-center gap-ds-02", children: [
+          /* @__PURE__ */ a("span", { className: "text-ds-sm font-medium text-text-primary", children: [
+            h,
+            " selected"
+          ] }),
+          /* @__PURE__ */ e(
+            O,
+            {
+              variant: "ghost",
+              size: "icon-md",
+              onClick: r,
+              "aria-label": "Clear selection",
+              title: "Clear selection",
+              className: "h-6 w-6",
+              children: /* @__PURE__ */ e(ie, { className: "h-3.5 w-3.5" })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ e("div", { className: "h-4 w-px bg-border-subtle" }),
+        /* @__PURE__ */ e("div", { className: "animate-fade-in delay-stagger", style: { "--stagger-index": 0 }, children: /* @__PURE__ */ a(z, { children: [
+          /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ a(O, { variant: "ghost", size: "sm", title: "Move to column", tabIndex: h > 0 ? 0 : -1, children: [
+            /* @__PURE__ */ e(fe, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
+            "Move"
+          ] }) }),
+          /* @__PURE__ */ a(F, { align: "start", className: "w-44", children: [
+            /* @__PURE__ */ e(Q, { children: "Move to" }),
+            /* @__PURE__ */ e(G, {}),
+            t.map((c) => /* @__PURE__ */ e(
+              $,
+              {
+                onClick: () => d("move", c.id),
+                children: c.name
+              },
+              c.id
+            ))
+          ] })
+        ] }) }),
+        /* @__PURE__ */ e("div", { className: "animate-fade-in delay-stagger", style: { "--stagger-index": 1 }, children: /* @__PURE__ */ a(z, { children: [
+          /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ a(O, { variant: "ghost", size: "sm", title: "Set priority", tabIndex: h > 0 ? 0 : -1, children: [
+            /* @__PURE__ */ e(le, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
+            "Priority"
+          ] }) }),
+          /* @__PURE__ */ a(F, { align: "start", className: "w-40", children: [
+            /* @__PURE__ */ e(Q, { children: "Set priority" }),
+            /* @__PURE__ */ e(G, {}),
+            $t.map((c) => /* @__PURE__ */ e(
+              $,
+              {
+                onClick: () => d("priority", c),
+                className: ce[c],
+                children: c.charAt(0) + c.slice(1).toLowerCase()
+              },
+              c
+            ))
+          ] })
+        ] }) }),
+        v.length > 0 && /* @__PURE__ */ e("div", { className: "animate-fade-in delay-stagger", style: { "--stagger-index": 2 }, children: /* @__PURE__ */ a(z, { children: [
+          /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ a(O, { variant: "ghost", size: "sm", title: "Assign", tabIndex: h > 0 ? 0 : -1, children: [
+            /* @__PURE__ */ e(q, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
+            "Assign"
+          ] }) }),
+          /* @__PURE__ */ a(F, { align: "start", className: "w-44 max-h-48 overflow-y-auto", children: [
+            /* @__PURE__ */ e(Q, { children: "Assign to" }),
+            /* @__PURE__ */ e(G, {}),
+            v.map((c) => /* @__PURE__ */ e(
+              $,
+              {
+                onClick: () => d("assign", c.id),
+                children: c.name
+              },
+              c.id
+            ))
+          ] })
+        ] }) }),
+        /* @__PURE__ */ e("div", { className: "animate-fade-in delay-stagger", style: { "--stagger-index": 3 }, children: /* @__PURE__ */ a(z, { children: [
+          /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ a(O, { variant: "ghost", size: "sm", title: "Set visibility", tabIndex: h > 0 ? 0 : -1, children: [
+            /* @__PURE__ */ e(X, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
+            "Visibility"
+          ] }) }),
+          /* @__PURE__ */ a(F, { align: "start", className: "w-40", children: [
+            /* @__PURE__ */ e($, { onClick: () => d("visibility", "INTERNAL"), children: "Internal only" }),
+            /* @__PURE__ */ e($, { onClick: () => d("visibility", "EVERYONE"), children: "Visible to all" })
+          ] })
+        ] }) }),
+        /* @__PURE__ */ e("div", { className: "flex-1" }),
+        /* @__PURE__ */ e("div", { className: "animate-fade-in delay-stagger", style: { "--stagger-index": 4 }, children: /* @__PURE__ */ a(
+          O,
+          {
+            variant: "ghost",
+            size: "sm",
+            className: "text-error hover:text-error",
+            onClick: () => d("delete"),
+            title: "Delete selected tasks",
+            tabIndex: h > 0 ? 0 : -1,
+            children: [
+              /* @__PURE__ */ e(pe, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
+              "Delete"
+            ]
+          }
+        ) })
+      ] }) })
+    }
+  );
+}
+Be.displayName = "BulkActionBar";
+function _t(s) {
+  const t = /* @__PURE__ */ new Set(), n = [];
+  for (const r of s.tasks) {
+    r.owner && !t.has(r.owner.id) && (t.add(r.owner.id), n.push(r.owner));
+    for (const o of r.assignees)
+      t.has(o.id) || (t.add(o.id), n.push(o));
+  }
+  return n;
+}
+function zt({ columnId: s, currentLimit: t, onClose: n }) {
+  const { onColumnWipLimitChange: r } = U(), [o, h] = A(t != null ? String(t) : ""), b = E(() => {
+    const d = o.trim();
+    if (d === "")
+      r(s, null);
+    else {
+      const c = parseInt(d, 10);
+      !isNaN(c) && c > 0 && r(s, c);
+    }
+    n();
+  }, [o, s, r, n]);
+  return (
+    // eslint-disable-next-line jsx-a11y/no-autofocus -- intentional: input opens after user selects "Set WIP Limit"
+    /* @__PURE__ */ e(
+      re,
+      {
+        type: "number",
+        min: 1,
+        value: o,
+        onChange: (d) => h(d.target.value),
+        onBlur: b,
+        onKeyDown: (d) => {
+          d.key === "Enter" && b(), d.key === "Escape" && n();
+        },
+        placeholder: "Limit...",
+        "aria-label": "WIP limit",
+        size: "sm",
+        className: "w-16 text-center",
+        autoFocus: !0
+      }
+    )
+  );
+}
+function Pe({ column: s, index: t }) {
+  var W;
+  const {
+    rawColumns: n,
+    onColumnRename: r,
+    onColumnDelete: o,
+    onColumnToggleVisibility: h,
+    onTaskAdd: b
+  } = U(), [v, d] = A(!1), [c, x] = A(s.name), [T, y] = A(!1), [g, S] = A(!1), [u, k] = A(""), [l, p] = A(null), [m, C] = A(""), i = ae(null), f = de(n), D = ve[t % ve.length], M = s.tasks.length, N = s.wipLimit ?? null, R = N != null && M > N, B = _t(s), _ = () => {
+    x(s.name), d(!0);
+  }, P = () => {
+    const w = c.trim();
+    w && w !== s.name && r(s.id, w), d(!1);
+  }, Y = (w) => {
+    w.key === "Enter" && P(), w.key === "Escape" && (x(s.name), d(!1));
+  }, K = () => {
+    k(""), p(null), C(""), S(!1);
+  }, J = () => {
+    const w = u.trim();
+    w && (b(s.id, {
+      title: w,
+      ownerId: l,
+      dueDate: m || null
+    }), K());
+  }, me = (w) => {
+    w.key === "Enter" && J(), w.key === "Escape" && K();
+  }, ue = () => {
+    g ? K() : (S(!0), setTimeout(() => {
+      var w;
+      return (w = i.current) == null ? void 0 : w.focus();
+    }, 50));
+  };
+  return /* @__PURE__ */ a("div", { className: "group/header flex flex-col gap-ds-02", children: [
+    /* @__PURE__ */ a("div", { className: "flex items-center gap-ds-02 px-ds-04 pt-ds-03 pb-ds-02", children: [
+      /* @__PURE__ */ e(
+        "span",
+        {
+          className: I("h-2.5 w-2.5 flex-shrink-0 rounded-full", D),
+          "aria-hidden": "true",
+          title: s.name
+        }
+      ),
+      v ? (
+        // eslint-disable-next-line jsx-a11y/no-autofocus -- intentional: input appears after user double-clicks to rename
+        /* @__PURE__ */ e(
+          re,
+          {
+            value: c,
+            onChange: (w) => x(w.target.value),
+            onBlur: P,
+            onKeyDown: Y,
+            "aria-label": "Column name",
+            size: "sm",
+            className: "h-ds-xs flex-1 text-ds-sm font-semibold",
+            autoFocus: !0
+          }
+        )
+      ) : /* @__PURE__ */ a(
+        "h3",
+        {
+          className: "flex-1 truncate text-ds-sm font-semibold text-text-primary",
+          onDoubleClick: _,
+          title: s.name,
+          "aria-label": N != null ? `${s.name}, ${M} of ${N} tasks${R ? ", WIP limit exceeded" : ""}` : `${s.name}, ${M} tasks`,
+          children: [
+            s.name,
+            /* @__PURE__ */ a("span", { className: "ml-ds-02 text-ds-xs font-normal text-text-tertiary", children: [
+              "(",
+              M,
+              ")"
+            ] })
+          ]
+        }
+      ),
+      T ? /* @__PURE__ */ e(
+        zt,
+        {
+          columnId: s.id,
+          currentLimit: N,
+          onClose: () => y(!1)
+        }
+      ) : N != null ? /* @__PURE__ */ a(
+        "span",
+        {
+          className: I(
+            "flex-shrink-0 text-ds-xs tabular-nums",
+            R ? "font-semibold text-error" : "text-text-tertiary"
+          ),
+          "aria-label": `WIP limit: ${N}${R ? ", exceeded" : ""}`,
+          children: [
+            "/ ",
+            N
+          ]
+        }
+      ) : null,
+      /* @__PURE__ */ e(
+        O,
+        {
+          variant: "ghost",
+          size: "icon-md",
+          className: I(
+            "h-ds-xs w-ds-xs flex-shrink-0 opacity-0 transition-opacity",
+            "group-hover/header:opacity-100 focus:opacity-100",
+            "hover:bg-interactive-subtle hover:text-interactive"
+          ),
+          "aria-label": "Add task",
+          title: "Add task",
+          onClick: ue,
+          children: /* @__PURE__ */ e(xe, { className: "h-ico-sm w-ico-sm" })
+        }
+      ),
+      /* @__PURE__ */ a(z, { children: [
+        /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ e(
+          O,
+          {
+            variant: "ghost",
+            size: "icon-md",
+            className: I(
+              "h-ds-xs w-ds-xs flex-shrink-0 opacity-0 transition-opacity",
+              "group-hover/header:opacity-100 focus:opacity-100"
+            ),
+            "aria-label": "Column options",
+            title: "Column options",
+            children: /* @__PURE__ */ e(xt, { className: "h-ico-sm w-ico-sm" })
+          }
+        ) }),
+        /* @__PURE__ */ a(F, { align: "end", className: "w-48", children: [
+          /* @__PURE__ */ a($, { onClick: _, children: [
+            /* @__PURE__ */ e(yt, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+            "Rename"
+          ] }),
+          /* @__PURE__ */ a($, { onClick: () => y(!0), children: [
+            /* @__PURE__ */ e(vt, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+            "Set WIP Limit"
+          ] }),
+          /* @__PURE__ */ e(
+            $,
+            {
+              onClick: () => h(s.id, !(s.isClientVisible ?? !1)),
+              children: s.isClientVisible ? /* @__PURE__ */ a(se, { children: [
+                /* @__PURE__ */ e(Te, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+                "Hide from client"
+              ] }) : /* @__PURE__ */ a(se, { children: [
+                /* @__PURE__ */ e(X, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+                "Show to client"
+              ] })
+            }
+          ),
+          /* @__PURE__ */ e(G, {}),
+          /* @__PURE__ */ a(
+            $,
+            {
+              className: "text-error focus:text-error",
+              onClick: () => o(s.id),
+              children: [
+                /* @__PURE__ */ e(pe, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+                "Delete column"
+              ]
+            }
+          )
+        ] })
+      ] })
+    ] }),
+    B.length > 0 && /* @__PURE__ */ e("div", { className: "px-ds-04 pb-ds-02", children: /* @__PURE__ */ e(
+      It,
+      {
+        users: B,
+        max: 3,
+        size: "sm",
+        showTooltip: !0
+      }
+    ) }),
+    /* @__PURE__ */ e(
+      "div",
+      {
+        className: I(
+          "grid transition-[grid-template-rows,opacity] duration-moderate-02 ease-expressive-entrance",
+          g ? "grid-rows-[1fr] opacity-100" : "grid-rows-[0fr] opacity-0"
+        ),
+        children: /* @__PURE__ */ e("div", { className: "overflow-hidden", children: /* @__PURE__ */ a("div", { className: "px-ds-04 pb-ds-03 flex flex-col gap-ds-02", children: [
+          /* @__PURE__ */ e(
+            re,
+            {
+              ref: i,
+              value: u,
+              onChange: (w) => k(w.target.value),
+              onKeyDown: me,
+              placeholder: "Task title...",
+              "aria-label": "New task title",
+              size: "sm",
+              tabIndex: g ? 0 : -1,
+              autoFocus: g
+            }
+          ),
+          /* @__PURE__ */ a("div", { className: "flex items-center gap-ds-01", children: [
+            /* @__PURE__ */ a(z, { children: [
+              /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ e(
+                "button",
+                {
+                  className: I(
+                    "flex items-center justify-center h-6 w-6 rounded-ds-md transition-colors",
+                    l ? "text-interactive bg-interactive-subtle" : "text-text-tertiary hover:text-text-primary hover:bg-layer-active"
+                  ),
+                  title: l ? `Lead: ${(W = f.find((w) => w.id === l)) == null ? void 0 : W.name}` : "Assign task lead",
+                  "aria-label": "Assign task lead",
+                  tabIndex: g ? 0 : -1,
+                  children: /* @__PURE__ */ e(q, { className: "h-3.5 w-3.5" })
+                }
+              ) }),
+              /* @__PURE__ */ a(F, { align: "start", className: "w-44 max-h-48 overflow-y-auto", children: [
+                f.length === 0 && /* @__PURE__ */ e("div", { className: "px-ds-03 py-ds-02 text-ds-xs text-text-tertiary", children: "No members found" }),
+                l && /* @__PURE__ */ a(se, { children: [
+                  /* @__PURE__ */ a($, { onClick: () => p(null), children: [
+                    /* @__PURE__ */ e(ie, { className: "mr-ds-02 h-3 w-3 text-text-tertiary" }),
+                    "Clear lead"
+                  ] }),
+                  /* @__PURE__ */ e(G, {})
+                ] }),
+                f.map((w) => /* @__PURE__ */ e(
+                  $,
+                  {
+                    onClick: () => p(w.id),
+                    className: I(l === w.id && "bg-interactive-subtle"),
+                    children: w.name
+                  },
+                  w.id
+                ))
+              ] })
+            ] }),
+            /* @__PURE__ */ a(
+              "label",
+              {
+                className: I(
+                  "relative flex items-center justify-center h-6 w-6 rounded-ds-md cursor-pointer transition-colors",
+                  m ? "text-interactive bg-interactive-subtle" : "text-text-tertiary hover:text-text-primary hover:bg-layer-active"
+                ),
+                title: m ? `Due: ${m}` : "Set due date",
+                "aria-label": "Set due date",
+                children: [
+                  /* @__PURE__ */ e(ye, { className: "h-3.5 w-3.5" }),
+                  /* @__PURE__ */ e(
+                    "input",
+                    {
+                      type: "date",
+                      value: m,
+                      onChange: (w) => C(w.target.value),
+                      className: "absolute inset-0 opacity-0 cursor-pointer w-full h-full",
+                      "aria-label": "Due date",
+                      tabIndex: g ? 0 : -1
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ e("div", { className: "flex-1" }),
+            /* @__PURE__ */ e(
+              "button",
+              {
+                onClick: J,
+                disabled: !u.trim(),
+                className: I(
+                  "flex items-center justify-center h-6 w-6 rounded-ds-md transition-colors",
+                  u.trim() ? "text-success hover:bg-success-surface" : "text-text-quaternary cursor-not-allowed"
+                ),
+                title: "Confirm add task",
+                "aria-label": "Confirm add task",
+                tabIndex: g ? 0 : -1,
+                children: /* @__PURE__ */ e(wt, { className: "h-3.5 w-3.5" })
+              }
+            ),
+            /* @__PURE__ */ e(
+              "button",
+              {
+                onClick: K,
+                className: "flex items-center justify-center h-6 w-6 rounded-ds-md text-text-tertiary hover:text-text-primary hover:bg-layer-active transition-colors",
+                title: "Cancel",
+                "aria-label": "Cancel adding task",
+                tabIndex: g ? 0 : -1,
+                children: /* @__PURE__ */ e(ie, { className: "h-3.5 w-3.5" })
+              }
+            )
+          ] })
+        ] }) })
+      }
+    )
+  ] });
+}
+Pe.displayName = "ColumnHeader";
+function Vt() {
+  return /* @__PURE__ */ a(
+    "svg",
+    {
+      width: "48",
+      height: "48",
+      viewBox: "0 0 48 48",
+      fill: "none",
+      "aria-hidden": "true",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ e("rect", { x: "10", y: "12", width: "28", height: "32", rx: "3", stroke: "currentColor", strokeWidth: "1.5" }),
+        /* @__PURE__ */ e("rect", { x: "18", y: "8", width: "12", height: "8", rx: "2", stroke: "currentColor", strokeWidth: "1.5" }),
+        /* @__PURE__ */ e("line", { x1: "16", y1: "24", x2: "32", y2: "24", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
+        /* @__PURE__ */ e("line", { x1: "16", y1: "30", x2: "28", y2: "30", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
+        /* @__PURE__ */ e("line", { x1: "16", y1: "36", x2: "24", y2: "36", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
+      ]
+    }
+  );
+}
+function Ft() {
+  return /* @__PURE__ */ a(
+    "svg",
+    {
+      width: "48",
+      height: "48",
+      viewBox: "0 0 48 48",
+      fill: "none",
+      "aria-hidden": "true",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ e("rect", { x: "14", y: "10", width: "26", height: "16", rx: "3", stroke: "currentColor", strokeWidth: "1.5" }),
+        /* @__PURE__ */ e("rect", { x: "10", y: "19", width: "26", height: "16", rx: "3", stroke: "currentColor", strokeWidth: "1.5" }),
+        /* @__PURE__ */ e("rect", { x: "6", y: "28", width: "26", height: "16", rx: "3", stroke: "currentColor", strokeWidth: "1.5" }),
+        /* @__PURE__ */ e("line", { x1: "12", y1: "35", x2: "26", y2: "35", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
+      ]
+    }
+  );
+}
+function Ut() {
+  return /* @__PURE__ */ a(
+    "svg",
+    {
+      width: "48",
+      height: "48",
+      viewBox: "0 0 48 48",
+      fill: "none",
+      "aria-hidden": "true",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ e("circle", { cx: "24", cy: "24", r: "14", stroke: "currentColor", strokeWidth: "1.5" }),
+        /* @__PURE__ */ e(
+          "polyline",
+          {
+            points: "17,24 22,30 31,18",
+            stroke: "currentColor",
+            strokeWidth: "1.5",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        )
+      ]
+    }
+  );
+}
+function Kt() {
+  return /* @__PURE__ */ a(
+    "svg",
+    {
+      width: "48",
+      height: "48",
+      viewBox: "0 0 48 48",
+      fill: "none",
+      "aria-hidden": "true",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ e("rect", { x: "8", y: "26", width: "32", height: "16", rx: "3", stroke: "currentColor", strokeWidth: "1.5" }),
+        /* @__PURE__ */ e(
+          "path",
+          {
+            d: "M8 26 L14 14 H34 L40 26",
+            stroke: "currentColor",
+            strokeWidth: "1.5",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ e("line", { x1: "24", y1: "8", x2: "24", y2: "22", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
+        /* @__PURE__ */ e(
+          "polyline",
+          {
+            points: "19,17 24,22 29,17",
+            stroke: "currentColor",
+            strokeWidth: "1.5",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        )
+      ]
+    }
+  );
+}
+const ke = [
+  Vt,
+  Ft,
+  Ut,
+  Kt
+];
+function We({ index: s, onAddTask: t, isDropTarget: n = !1, className: r }) {
+  const o = ke[s % ke.length];
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      className: I(
+        "flex flex-col items-center justify-center gap-ds-03 py-ds-07 text-center",
+        r
+      ),
+      children: [
+        /* @__PURE__ */ e("span", { className: "text-text-quaternary", children: /* @__PURE__ */ e(o, {}) }),
+        n ? /* @__PURE__ */ e("p", { className: "text-ds-sm text-text-tertiary", children: "Drop tasks here" }) : /* @__PURE__ */ a(se, { children: [
+          /* @__PURE__ */ e("p", { className: "text-ds-sm text-text-tertiary", children: "No tasks yet" }),
+          /* @__PURE__ */ a(
+            O,
+            {
+              variant: "ghost",
+              size: "sm",
+              onClick: t,
+              children: [
+                /* @__PURE__ */ e(xe, { className: "h-ico-sm w-ico-sm" }),
+                "Add a task"
+              ]
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+We.displayName = "ColumnEmpty";
+function Gt(s) {
+  const t = new Date(s), n = /* @__PURE__ */ new Date(), r = t.getTime() - n.getTime(), o = Math.ceil(r / (1e3 * 60 * 60 * 24));
+  return o < 0 ? { label: "Overdue", className: "text-error" } : o === 0 ? { label: "Today", className: "text-warning" } : o === 1 ? { label: "Tomorrow", className: "text-warning" } : {
     label: t.toLocaleDateString("en-IN", { month: "short", day: "numeric" }),
     className: "text-text-tertiary"
   };
 }
-const Fe = he(
-  "group/card relative rounded-ds-lg border border-border/60 bg-layer-01 p-ds-04 shadow-01 transition-[color,background-color,border-color,box-shadow] duration-fast-02 ease-productive-standard hover:shadow-02 hover:border-border cursor-pointer",
+const $e = {
+  LOW: Se,
+  MEDIUM: fe,
+  HIGH: Re,
+  URGENT: le
+}, Ht = Ie(
+  "group/card relative rounded-ds-lg border border-transparent bg-layer-01 pl-3 pr-ds-03 py-ds-03 transition-all duration-fast-02 ease-productive-standard cursor-pointer",
   {
     variants: {
       state: {
-        default: "",
+        default: "shadow-01 hover:shadow-02 hover:-translate-y-px hover:border-border",
         dragging: "opacity-[0.38]",
-        overlay: "rotate-[2deg] shadow-03 border-border-interactive/60 ring-1 ring-interactive/40"
+        overlay: "rotate-[2deg] shadow-03 backdrop-blur-sm ring-1 ring-interactive/40"
       },
       blocked: {
         true: "border-l-2 border-l-error",
         false: ""
+      },
+      selected: {
+        true: "ring-1 ring-accent/50 shadow-[0_0_6px_rgba(var(--accent-rgb,99,102,241),0.15)] animate-glow-pulse",
+        false: ""
+      },
+      dimmed: {
+        true: "opacity-40",
+        false: ""
       }
     },
     defaultVariants: {
       state: "default",
-      blocked: !1
+      blocked: !1,
+      selected: !1,
+      dimmed: !1
     }
   }
 );
-function ae({
+function _e(s) {
+  const t = s.trim();
+  if (!t) return "";
+  const n = t.split(/\s+/);
+  return n.length >= 2 ? (n[0][0] + n[1][0]).toUpperCase() : t.slice(0, 2).toUpperCase();
+}
+function ze({
   task: s,
   isDragging: t,
-  isDragOverlay: r,
-  dragHandleProps: h,
-  onClickTask: m
+  isDragOverlay: n,
+  dragHandleProps: r
 }) {
-  const w = s.dueDate ? _e(s.dueDate) : null;
-  return /* @__PURE__ */ c(
+  var p;
+  const {
+    selectedTaskIds: o,
+    toggleTaskSelection: h,
+    focusedTaskId: b,
+    currentUserId: v,
+    highlightMyTasks: d,
+    onClickTask: c
+  } = U(), x = o.has(s.id), T = o.size > 0, y = b === s.id, g = s.dueDate ? Gt(s.dueDate) : null, S = $e[s.priority], u = ce[s.priority], k = d && v != null && ((p = s.owner) == null ? void 0 : p.id) !== v && !s.assignees.some((m) => m.id === v), l = [];
+  s.owner && l.push({ name: s.owner.name, image: s.owner.image, isOwner: !0 });
+  for (const m of s.assignees)
+    s.owner && m.id === s.owner.id || l.push({ name: m.name, image: m.image, isOwner: !1 });
+  return /* @__PURE__ */ a(
     "div",
     {
-      role: "button",
+      role: "group",
       tabIndex: 0,
-      className: Fe({
-        state: r ? "overlay" : t ? "dragging" : "default",
-        blocked: s.isBlocked
-      }),
-      onClick: () => m == null ? void 0 : m(s.id),
-      onKeyDown: (f) => {
-        (f.key === "Enter" || f.key === " ") && (f.preventDefault(), m == null || m(s.id));
+      "data-task-id": s.id,
+      "aria-label": `Task ${s.taskId}: ${s.title}`,
+      className: I(
+        Ht({
+          state: n ? "overlay" : t ? "dragging" : "default",
+          blocked: s.isBlocked,
+          selected: x,
+          dimmed: k
+        }),
+        n && "scale-[1.03] rotate-[1.5deg] shadow-03",
+        t && "opacity-40",
+        y && "ring-1 ring-focus"
+      ),
+      onClick: () => c(s.id),
+      onKeyDown: (m) => {
+        (m.key === "Enter" || m.key === " ") && (m.preventDefault(), c(s.id));
       },
       children: [
-        /* @__PURE__ */ c("div", { className: "flex items-start gap-ds-02b", children: [
+        /* @__PURE__ */ e(
+          "div",
+          {
+            className: I(
+              "absolute -top-2 -left-2 z-10 transition-opacity",
+              T || x ? "opacity-100 animate-scale-bounce" : "opacity-0 group-hover/card:opacity-100"
+            ),
+            children: /* @__PURE__ */ e(
+              Me,
+              {
+                checked: x,
+                onCheckedChange: () => h(s.id),
+                onClick: (m) => m.stopPropagation(),
+                "aria-label": `Select task ${s.taskId}`,
+                className: "rounded-full bg-layer-01 shadow-01"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ a("div", { className: "flex items-center gap-ds-02", children: [
+          /* @__PURE__ */ e("span", { className: "text-ds-xs font-mono leading-none text-text-tertiary", children: s.taskId }),
+          /* @__PURE__ */ e(S, { className: I("h-3 w-3 flex-shrink-0", u), title: `Priority: ${s.priority}` }),
+          /* @__PURE__ */ e("div", { className: "flex-1" }),
           /* @__PURE__ */ e(
             "button",
             {
-              className: j(
-                "mt-ds-01 flex-shrink-0 cursor-grab rounded p-ds-01 opacity-0 transition-opacity",
+              className: I(
+                "flex-shrink-0 cursor-grab rounded p-ds-01 opacity-0 transition-opacity",
                 "group-hover/card:opacity-[0.38] hover:!opacity-100",
                 "active:cursor-grabbing",
-                r && "opacity-[0.38]"
+                n && "opacity-[0.38]"
               ),
-              ...(h == null ? void 0 : h.attributes) ?? {},
-              ...(h == null ? void 0 : h.listeners) ?? {},
+              ...(r == null ? void 0 : r.attributes) ?? {},
+              ...(r == null ? void 0 : r.listeners) ?? {},
               "aria-label": `Drag handle for task: ${s.title}`,
               "aria-roledescription": "sortable",
-              onClick: (f) => f.stopPropagation(),
-              children: /* @__PURE__ */ e(Re, { className: "h-ico-sm w-ico-sm text-icon-secondary" })
+              onClick: (m) => m.stopPropagation(),
+              children: /* @__PURE__ */ e(bt, { className: "h-ico-sm w-ico-sm text-icon-secondary" })
             }
-          ),
-          /* @__PURE__ */ e("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ e("p", { className: "text-ds-md font-medium text-text-primary line-clamp-2", children: s.title }) })
+          )
         ] }),
-        /* @__PURE__ */ c("div", { className: "mt-ds-03 flex items-center gap-ds-03", children: [
-          /* @__PURE__ */ e(
+        /* @__PURE__ */ e("p", { className: "mt-ds-02 text-ds-sm font-medium text-text-primary line-clamp-2", children: s.title }),
+        /* @__PURE__ */ a("div", { className: "mt-ds-03 flex items-center gap-ds-02", children: [
+          g && /* @__PURE__ */ a(
             "div",
             {
-              className: j(
-                "h-2 w-2 rounded-ds-full flex-shrink-0",
-                Me[s.priority]
+              className: I(
+                "flex items-center gap-ds-01 text-ds-xs leading-tight",
+                g.className
               ),
-              title: je[s.priority]
+              title: `Due: ${g.label}`,
+              children: [
+                /* @__PURE__ */ e(ye, { className: "h-3 w-3" }),
+                /* @__PURE__ */ e("span", { children: g.label })
+              ]
             }
           ),
-          s.labels.length > 0 && /* @__PURE__ */ c("div", { className: "flex items-center gap-ds-02 overflow-hidden", children: [
-            s.labels.slice(0, 2).map((f) => /* @__PURE__ */ e(Le, { size: "sm", className: "max-w-[80px] truncate", children: f }, f)),
-            s.labels.length > 2 && /* @__PURE__ */ c("span", { className: "text-ds-xs text-text-tertiary", children: [
-              "+",
-              s.labels.length - 2
-            ] })
-          ] }),
-          /* @__PURE__ */ e("div", { className: "flex-1" }),
-          w && /* @__PURE__ */ c(
+          s.subtaskCount > 0 && /* @__PURE__ */ a(
             "div",
             {
-              className: j(
-                "flex items-center gap-ds-01 text-ds-xs leading-tight",
-                w.className
-              ),
+              className: "flex items-center gap-ds-01 text-ds-xs text-text-tertiary",
+              title: `Subtasks: ${s.subtasksDone} of ${s.subtaskCount} done`,
               children: [
-                /* @__PURE__ */ e(Be, { className: "h-2.5 w-2.5" }),
-                /* @__PURE__ */ e("span", { children: w.label })
+                /* @__PURE__ */ e(kt, { className: "h-3 w-3" }),
+                /* @__PURE__ */ a("span", { children: [
+                  s.subtasksDone,
+                  "/",
+                  s.subtaskCount
+                ] })
               ]
             }
           ),
-          s.assignees.length > 0 && /* @__PURE__ */ e(
-            $e,
-            {
-              users: s.assignees,
-              size: "sm",
-              max: 2,
-              showTooltip: !1
-            }
-          )
+          s.visibility === "EVERYONE" && /* @__PURE__ */ e("span", { className: "flex items-center text-text-tertiary", "aria-label": "Client visible", title: "Visible to client", children: /* @__PURE__ */ e(X, { className: "h-3 w-3" }) }),
+          s.isBlocked && /* @__PURE__ */ e("span", { className: "flex items-center text-error", "aria-label": "Blocked", title: "Blocked", children: /* @__PURE__ */ e(Ct, { className: "h-3 w-3" }) }),
+          /* @__PURE__ */ e("div", { className: "flex-1" }),
+          l.length > 0 && /* @__PURE__ */ a("div", { className: "flex items-center flex-shrink-0", children: [
+            l.slice(0, 3).map((m, C) => /* @__PURE__ */ a(
+              Dt,
+              {
+                size: "xs",
+                className: I(
+                  "text-ds-xs border-2 border-layer-01",
+                  C > 0 && "-ml-ds-02b",
+                  m.isOwner && "shadow-[0_0_0_1.5px_rgba(var(--accent-rgb,99,102,241),0.35),0_0_6px_rgba(var(--accent-rgb,99,102,241),0.2)]"
+                ),
+                style: { zIndex: l.length - C },
+                title: m.name,
+                children: [
+                  m.image && /* @__PURE__ */ e(Tt, { src: m.image, alt: m.name }),
+                  /* @__PURE__ */ e(Rt, { className: "font-body font-semibold", children: _e(m.name) })
+                ]
+              },
+              C
+            )),
+            l.length > 3 && /* @__PURE__ */ a("span", { className: "ml-ds-01 text-ds-xs text-text-tertiary", children: [
+              "+",
+              l.length - 3
+            ] })
+          ] })
         ] })
       ]
     }
   );
 }
-const ie = F.forwardRef(
-  function({ task: t, onClickTask: r }, h) {
+const Ve = j.forwardRef(
+  function({ task: t }, n) {
     const {
-      attributes: m,
-      listeners: w,
-      setNodeRef: f,
-      transform: D,
-      transition: C,
-      isDragging: T
-    } = fe({
+      attributes: r,
+      listeners: o,
+      setNodeRef: h,
+      transform: b,
+      transition: v,
+      isDragging: d
+    } = Ce({
       id: t.id,
       data: {
         type: "task",
         task: t
       }
-    }), E = se(f, h), x = {
-      transform: ue.Transform.toString(D),
-      transition: C
+    }), c = Ae(h, n), x = {
+      transform: Ne.Transform.toString(b),
+      transition: v
     };
-    return /* @__PURE__ */ e("div", { ref: E, style: x, children: /* @__PURE__ */ e(
-      ae,
+    return /* @__PURE__ */ e("div", { ref: c, style: x, children: /* @__PURE__ */ e(
+      ze,
       {
         task: t,
-        isDragging: T,
-        dragHandleProps: { attributes: m, listeners: w },
-        onClickTask: r
+        isDragging: d,
+        dragHandleProps: { attributes: r, listeners: o }
       }
     ) });
   }
 );
-ie.displayName = "TaskCard";
-const ne = F.forwardRef(
-  function({ task: t }, r) {
-    return /* @__PURE__ */ e("div", { ref: r, children: /* @__PURE__ */ e(ae, { task: t, isDragOverlay: !0 }) });
+Ve.displayName = "TaskCard";
+const Qt = Ie(
+  "group/card flex items-center gap-ds-02 py-2 pl-3 pr-ds-03 border border-transparent rounded-ds-lg bg-layer-01 transition-all duration-fast-02 ease-productive-standard cursor-pointer hover:bg-layer-active hover:shadow-02 hover:-translate-y-px",
+  {
+    variants: {
+      selected: {
+        true: "ring-1 ring-accent/50 shadow-[0_0_6px_rgba(var(--accent-rgb,99,102,241),0.15)] animate-glow-pulse",
+        false: ""
+      },
+      dimmed: {
+        true: "opacity-40",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      selected: !1,
+      dimmed: !1
+    }
   }
 );
-ne.displayName = "TaskCardOverlay";
-const te = [
-  "border-l-category-cyan",
-  "border-l-category-amber",
-  "border-l-category-teal",
-  "border-l-category-indigo",
-  "border-l-category-orange",
-  "border-l-category-emerald",
-  "border-l-category-slate",
-  "border-l-accent"
-], oe = F.forwardRef(
-  function({
-    column: t,
-    index: r,
-    isOverlay: h,
-    onAddTask: m,
-    onClickTask: w,
-    onRenameColumn: f,
-    onDeleteColumn: D,
-    onToggleVisibility: C
-  }, T) {
-    const [E, x] = O(!1), [k, S] = O(""), [G, R] = O(!1), [B, K] = O(t.name), z = J(null), P = J(null), { setNodeRef: g, isOver: V } = pe({
-      id: `column-${t.id}`,
-      data: {
-        type: "column",
-        column: t
-      }
-    }), I = t.tasks.map((o) => o.id), A = te[r % te.length], M = () => {
-      k.trim() && (m(t.id, k.trim()), S(""), x(!1));
-    }, W = (o) => {
-      o.key === "Enter" && M(), o.key === "Escape" && (S(""), x(!1));
-    }, _ = () => {
-      B.trim() && B.trim() !== t.name && (f == null || f(t.id, B.trim())), R(!1);
-    }, Y = (o) => {
-      o.key === "Enter" && _(), o.key === "Escape" && (K(t.name), R(!1));
-    };
-    return /* @__PURE__ */ c(
-      "div",
-      {
-        ref: T,
-        className: j(
-          /* intentional: board column fixed width — matches add-column button */
-          "flex h-full w-[300px] flex-shrink-0 flex-col rounded-ds-xl border-l-[3px] bg-layer-01 shadow-01",
-          A,
-          h && "shadow-04"
-        ),
-        children: [
-          /* @__PURE__ */ c("div", { className: "flex items-center gap-ds-03 px-ds-04 py-ds-04", children: [
-            G ? /* @__PURE__ */ e(
-              H,
-              {
-                ref: P,
-                value: B,
-                onChange: (o) => K(o.target.value),
-                onBlur: _,
-                onKeyDown: Y,
-                className: "h-ds-xs-plus text-ds-md font-semibold",
-                autoFocus: !0
-              }
-            ) : /* @__PURE__ */ e(
-              "h3",
-              {
-                className: "text-ds-md font-semibold text-text-primary truncate",
-                onDoubleClick: () => {
-                  K(t.name), R(!0);
-                },
-                children: t.name
-              }
+function Fe({
+  task: s,
+  isDragging: t,
+  isDragOverlay: n
+}) {
+  var k;
+  const {
+    selectedTaskIds: r,
+    toggleTaskSelection: o,
+    focusedTaskId: h,
+    currentUserId: b,
+    highlightMyTasks: v,
+    onClickTask: d
+  } = U(), c = r.has(s.id), x = r.size > 0, T = h === s.id, y = $e[s.priority], g = ce[s.priority], S = v && b != null && ((k = s.owner) == null ? void 0 : k.id) !== b && !s.assignees.some((l) => l.id === b), u = s.owner ?? s.assignees[0] ?? null;
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      role: "group",
+      tabIndex: 0,
+      "data-task-id": s.id,
+      "aria-label": `Task ${s.taskId}: ${s.title}`,
+      className: I(
+        "relative",
+        Qt({
+          selected: c,
+          dimmed: S
+        }),
+        t && "opacity-40",
+        n && "scale-[1.03] rotate-[1.5deg] shadow-03",
+        T && "ring-1 ring-focus"
+      ),
+      onClick: () => d(s.id),
+      onKeyDown: (l) => {
+        (l.key === "Enter" || l.key === " ") && (l.preventDefault(), d(s.id));
+      },
+      children: [
+        /* @__PURE__ */ e(
+          "div",
+          {
+            className: I(
+              "absolute -top-1.5 -left-1.5 z-10 transition-opacity",
+              x || c ? "opacity-100 animate-scale-bounce" : "opacity-0 group-hover/card:opacity-100"
             ),
-            /* @__PURE__ */ e("span", { className: "flex h-5 min-w-[20px] items-center justify-center rounded-ds-full bg-field px-ds-02b text-ds-sm font-medium text-text-tertiary", children: t.tasks.length }),
-            t.isClientVisible && /* @__PURE__ */ e(
-              ee,
+            children: /* @__PURE__ */ e(
+              Me,
               {
-                className: "h-3 w-3 text-text-tertiary",
-                "aria-label": "Visible to client"
-              }
-            ),
-            /* @__PURE__ */ e("div", { className: "flex-1" }),
-            /* @__PURE__ */ e(
-              $,
-              {
-                variant: "ghost",
-                size: "icon-md",
-                className: "h-ds-xs w-ds-xs opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 focus:opacity-100 hover:bg-interactive-subtle hover:text-interactive transition-opacity",
-                "aria-label": "Add task",
-                onClick: () => {
-                  x(!0), setTimeout(() => {
-                    var o;
-                    return (o = z.current) == null ? void 0 : o.focus();
-                  }, 50);
-                },
-                children: /* @__PURE__ */ e(Q, { className: "h-ico-sm w-ico-sm" })
+                checked: c,
+                onCheckedChange: () => o(s.id),
+                onClick: (l) => l.stopPropagation(),
+                "aria-label": `Select task ${s.taskId}`,
+                className: "rounded-full bg-layer-01 shadow-01"
               }
+            )
+          }
+        ),
+        /* @__PURE__ */ e(y, { className: I("h-3.5 w-3.5 flex-shrink-0", g), title: `Priority: ${s.priority}` }),
+        /* @__PURE__ */ e("span", { className: "text-ds-xs font-mono text-text-tertiary flex-shrink-0", children: s.taskId }),
+        /* @__PURE__ */ e("span", { className: "text-ds-sm text-text-primary line-clamp-1 flex-1 min-w-0", children: s.title }),
+        s.subtaskCount > 0 && /* @__PURE__ */ a("span", { className: "text-ds-xs text-text-tertiary flex-shrink-0", children: [
+          s.subtasksDone,
+          "/",
+          s.subtaskCount
+        ] }),
+        u && /* @__PURE__ */ e(
+          "div",
+          {
+            className: I(
+              "flex h-[14px] w-[14px] shrink-0 items-center justify-center rounded-full border border-layer-01 bg-interactive-subtle text-[6px] font-semibold leading-none text-interactive overflow-hidden",
+              s.owner && "shadow-[0_0_0_1px_rgba(var(--accent-rgb,99,102,241),0.35),0_0_4px_rgba(var(--accent-rgb,99,102,241),0.2)]"
             ),
-            /* @__PURE__ */ c(Ce, { children: [
-              /* @__PURE__ */ e(Se, { asChild: !0, children: /* @__PURE__ */ e(
-                $,
-                {
-                  variant: "ghost",
-                  size: "icon-md",
-                  className: "h-ds-xs w-ds-xs opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 focus:opacity-100 transition-opacity",
-                  "aria-label": "Column options",
-                  children: /* @__PURE__ */ e(Ke, { className: "h-ico-sm w-ico-sm" })
-                }
-              ) }),
-              /* @__PURE__ */ c(Oe, { align: "end", className: "w-44", children: [
-                /* @__PURE__ */ c(
-                  q,
-                  {
-                    onClick: () => {
-                      K(t.name), R(!0);
-                    },
-                    children: [
-                      /* @__PURE__ */ e(Ae, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
-                      "Rename"
-                    ]
-                  }
-                ),
+            title: u.name,
+            children: u.image ? /* @__PURE__ */ e("img", { src: u.image, alt: u.name, className: "h-full w-full object-cover" }) : _e(u.name)
+          }
+        )
+      ]
+    }
+  );
+}
+const Ue = j.forwardRef(
+  function({ task: t }, n) {
+    const {
+      attributes: r,
+      listeners: o,
+      setNodeRef: h,
+      transform: b,
+      transition: v,
+      isDragging: d
+    } = Ce({
+      id: t.id,
+      data: {
+        type: "task",
+        task: t
+      }
+    }), c = Ae(h, n), x = {
+      transform: Ne.Transform.toString(b),
+      transition: v
+    };
+    return /* @__PURE__ */ e("div", { ref: c, style: x, children: /* @__PURE__ */ e(
+      Fe,
+      {
+        task: t,
+        isDragging: d,
+        dragHandleProps: { attributes: r, listeners: o }
+      }
+    ) });
+  }
+);
+Ue.displayName = "TaskCardCompact";
+const Ke = j.forwardRef(function({ task: t }, n) {
+  return /* @__PURE__ */ e("div", { ref: n, children: /* @__PURE__ */ e(Fe, { task: t, isDragOverlay: !0 }) });
+});
+Ke.displayName = "TaskCardCompactOverlay";
+const Ge = j.forwardRef(
+  function({ task: t }, n) {
+    return /* @__PURE__ */ e("div", { ref: n, children: /* @__PURE__ */ e(ze, { task: t, isDragOverlay: !0 }) });
+  }
+);
+Ge.displayName = "TaskCardOverlay";
+const jt = [
+  { value: "LOW", label: "Low", icon: Se },
+  { value: "MEDIUM", label: "Medium", icon: fe },
+  { value: "HIGH", label: "High", icon: Re },
+  { value: "URGENT", label: "Urgent", icon: le }
+];
+function He({ taskId: s, children: t }) {
+  const {
+    rawColumns: n,
+    onQuickPriorityChange: r,
+    onQuickAssign: o,
+    onQuickLabelAdd: h,
+    onQuickDueDateChange: b,
+    onQuickVisibilityChange: v,
+    onQuickDelete: d
+  } = U(), c = de(n), x = Ee(n), T = j.useRef(null);
+  return /* @__PURE__ */ a(St, { children: [
+    /* @__PURE__ */ e(At, { children: t }),
+    /* @__PURE__ */ a(Mt, { className: "w-52 animate-scale-in", children: [
+      /* @__PURE__ */ a(Z, { children: [
+        /* @__PURE__ */ a(ee, { children: [
+          /* @__PURE__ */ e(le, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+          "Set Priority"
+        ] }),
+        /* @__PURE__ */ e(te, { className: "w-40", children: jt.map((y) => {
+          const g = y.icon;
+          return /* @__PURE__ */ a(
+            H,
+            {
+              onSelect: () => r(s, y.value),
+              children: [
                 /* @__PURE__ */ e(
-                  q,
+                  g,
                   {
-                    onClick: () => C == null ? void 0 : C(t.id, !t.isClientVisible),
-                    children: t.isClientVisible ? /* @__PURE__ */ c(X, { children: [
-                      /* @__PURE__ */ e(Te, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
-                      "Hide from client"
-                    ] }) : /* @__PURE__ */ c(X, { children: [
-                      /* @__PURE__ */ e(ee, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
-                      "Show to client"
-                    ] })
+                    className: I(
+                      "mr-ds-03 h-ico-sm w-ico-sm",
+                      ce[y.value]
+                    )
                   }
                 ),
-                /* @__PURE__ */ e(Ee, {}),
-                /* @__PURE__ */ c(
-                  q,
-                  {
-                    className: "text-error focus:text-error",
-                    onClick: () => D == null ? void 0 : D(t.id),
-                    children: [
-                      /* @__PURE__ */ e(ze, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
-                      "Delete column"
-                    ]
-                  }
-                )
-              ] })
-            ] })
-          ] }),
-          /* @__PURE__ */ c(
-            "div",
-            {
-              ref: g,
-              className: j(
-                "no-scrollbar flex flex-1 flex-col gap-ds-03 overflow-y-auto px-ds-03 pb-ds-03 transition-colors duration-fast-02 ease-productive-standard",
-                V && "bg-interactive-subtle/50"
-              ),
-              children: [
-                /* @__PURE__ */ e(re, { items: I, strategy: xe, children: t.tasks.map((o) => /* @__PURE__ */ e(ie, { task: o, onClickTask: w }, o.id)) }),
-                t.tasks.length === 0 && !E && /* @__PURE__ */ e("div", { className: "flex flex-1 items-center justify-center py-ds-07", children: /* @__PURE__ */ e("p", { className: "text-ds-sm text-text-placeholder", children: "No tasks" }) })
+                y.label
               ]
-            }
-          ),
-          E ? /* @__PURE__ */ c("div", { className: "border-t border-border-subtle p-ds-03", children: [
+            },
+            y.value
+          );
+        }) })
+      ] }),
+      c.length > 0 && /* @__PURE__ */ a(Z, { children: [
+        /* @__PURE__ */ a(ee, { children: [
+          /* @__PURE__ */ e(q, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+          "Assign"
+        ] }),
+        /* @__PURE__ */ e(te, { className: "w-44 max-h-48 overflow-y-auto", children: c.map((y) => /* @__PURE__ */ e(
+          H,
+          {
+            onSelect: () => o(s, y.id),
+            children: y.name
+          },
+          y.id
+        )) })
+      ] }),
+      /* @__PURE__ */ a(Z, { children: [
+        /* @__PURE__ */ a(ee, { children: [
+          /* @__PURE__ */ e(Nt, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+          "Add Label"
+        ] }),
+        /* @__PURE__ */ e(te, { className: "w-40 max-h-48 overflow-y-auto", children: x.length > 0 ? x.map((y) => /* @__PURE__ */ e(
+          H,
+          {
+            onSelect: () => h(s, y),
+            children: y
+          },
+          y
+        )) : /* @__PURE__ */ e("div", { className: "px-ds-03 py-ds-02 text-ds-xs text-text-tertiary", children: "No labels found" }) })
+      ] }),
+      /* @__PURE__ */ a(
+        H,
+        {
+          onSelect: (y) => {
+            var g;
+            y.preventDefault(), (g = T.current) == null || g.showPicker();
+          },
+          children: [
+            /* @__PURE__ */ e(ye, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+            "Set Due Date",
             /* @__PURE__ */ e(
-              H,
+              "input",
               {
-                ref: z,
-                value: k,
-                onChange: (o) => S(o.target.value),
-                onKeyDown: W,
-                onBlur: () => {
-                  k.trim() || x(!1);
+                ref: T,
+                type: "date",
+                className: "absolute opacity-0 pointer-events-none w-0 h-0",
+                onChange: (y) => {
+                  b(s, y.target.value || null);
                 },
-                placeholder: "Task title...",
-                className: "h-ds-sm text-ds-md",
-                autoFocus: !0
+                tabIndex: -1
               }
-            ),
-            /* @__PURE__ */ c("div", { className: "mt-ds-02b flex items-center gap-ds-02", children: [
-              /* @__PURE__ */ e(
-                $,
-                {
-                  size: "sm",
-                  className: "h-ds-xs-plus bg-interactive hover:bg-interactive-hover text-text-on-color text-ds-sm",
-                  onClick: M,
-                  disabled: !k.trim(),
-                  children: "Add"
-                }
-              ),
-              /* @__PURE__ */ e(
-                $,
-                {
-                  variant: "ghost",
-                  size: "sm",
-                  className: "h-ds-xs-plus text-ds-sm",
-                  onClick: () => {
-                    S(""), x(!1);
-                  },
-                  children: "Cancel"
-                }
-              )
-            ] })
-          ] }) : /* @__PURE__ */ c(
-            "button",
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ a(Z, { children: [
+        /* @__PURE__ */ a(ee, { children: [
+          /* @__PURE__ */ e(X, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+          "Visibility"
+        ] }),
+        /* @__PURE__ */ a(te, { className: "w-44", children: [
+          /* @__PURE__ */ a(
+            H,
             {
-              onClick: () => {
-                x(!0), setTimeout(() => {
-                  var o;
-                  return (o = z.current) == null ? void 0 : o.focus();
-                }, 50);
-              },
-              className: "flex items-center gap-ds-02b border-t border-border-subtle px-ds-04 py-ds-03 text-ds-sm text-text-placeholder transition-colors hover:bg-field hover:text-text-tertiary",
+              onSelect: () => v(s, "INTERNAL"),
+              children: [
+                /* @__PURE__ */ e(Te, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+                "Internal only"
+              ]
+            }
+          ),
+          /* @__PURE__ */ a(
+            H,
+            {
+              onSelect: () => v(s, "EVERYONE"),
+              children: [
+                /* @__PURE__ */ e(X, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+                "Visible to all"
+              ]
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ e(Lt, {}),
+      /* @__PURE__ */ a(
+        H,
+        {
+          className: "text-error focus:text-error",
+          onSelect: () => d(s),
+          children: [
+            /* @__PURE__ */ e(pe, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+            "Delete"
+          ]
+        }
+      )
+    ] })
+  ] });
+}
+He.displayName = "TaskContextMenu";
+const Qe = j.forwardRef(
+  function({ column: t, index: n, isOverlay: r }, o) {
+    const { viewMode: h } = U(), { setNodeRef: b, isOver: v } = Je({
+      id: `column-${t.id}`,
+      data: {
+        type: "column",
+        column: t
+      }
+    }), d = t.tasks.map((x) => x.id), c = t.wipLimit != null && t.tasks.length > t.wipLimit;
+    return /* @__PURE__ */ a(
+      "div",
+      {
+        ref: o,
+        className: I(
+          "flex h-full flex-shrink-0 flex-col rounded-ds-xl bg-layer-01/40 backdrop-blur-[2px] border border-border-subtle/20 hover:border-border-subtle/40 transition-colors p-1",
+          r && "shadow-04",
+          c && "bg-error-surface/50"
+        ),
+        style: { width: Et },
+        children: [
+          /* @__PURE__ */ e(Pe, { column: t, index: n }),
+          /* @__PURE__ */ a(
+            "div",
+            {
+              ref: b,
+              className: I(
+                "no-scrollbar flex flex-1 flex-col gap-ds-02 overflow-y-auto px-ds-03 pt-2.5 pb-ds-03 transition-colors duration-fast-02 ease-productive-standard",
+                v && "bg-interactive-subtle/30"
+              ),
               children: [
-                /* @__PURE__ */ e(Q, { className: "h-3 w-3" }),
-                "Add task"
+                /* @__PURE__ */ e(De, { items: d, strategy: Ze, children: t.tasks.map((x, T) => /* @__PURE__ */ e(
+                  "div",
+                  {
+                    className: "animate-slide-up delay-stagger",
+                    style: { "--stagger-index": T },
+                    children: /* @__PURE__ */ e(He, { taskId: x.id, children: h === "compact" ? /* @__PURE__ */ e(Ue, { task: x }) : /* @__PURE__ */ e(Ve, { task: x }) })
+                  },
+                  x.id
+                )) }),
+                t.tasks.length === 0 && /* @__PURE__ */ e(
+                  We,
+                  {
+                    index: n,
+                    isDropTarget: v
+                  }
+                )
               ]
             }
           )
@@ -385,8 +1648,118 @@ const te = [
     );
   }
 );
-oe.displayName = "BoardColumn";
-function Ge() {
+Qe.displayName = "BoardColumn";
+function Yt(s) {
+  const {
+    columns: t,
+    focusedTaskId: n,
+    setFocusedTaskId: r,
+    selectedTaskIds: o,
+    toggleTaskSelection: h,
+    selectRange: b,
+    clearSelection: v,
+    clearFilters: d,
+    hasActiveFilters: c,
+    onClickTask: x
+  } = U(), T = E(
+    (u) => {
+      for (let k = 0; k < t.length; k++)
+        for (let l = 0; l < t[k].tasks.length; l++)
+          if (t[k].tasks[l].id === u)
+            return { columnIndex: k, taskIndex: l, taskId: u };
+      return null;
+    },
+    [t]
+  ), y = E(
+    (u, k) => {
+      const l = t[u];
+      if (!l) return null;
+      const p = l.tasks[k];
+      return (p == null ? void 0 : p.id) ?? null;
+    },
+    [t]
+  ), g = E((u) => {
+    const k = document.querySelector(`[data-task-id="${u}"]`);
+    k && k.scrollIntoView({ block: "nearest", behavior: "smooth" });
+  }, []), S = E(
+    (u) => {
+      const k = u.target;
+      if (!(k.tagName === "INPUT" || k.tagName === "TEXTAREA" || k.isContentEditable))
+        switch (u.key) {
+          case "ArrowDown":
+          case "ArrowUp": {
+            u.preventDefault();
+            const l = u.key === "ArrowDown" ? 1 : -1;
+            if (!n) {
+              for (const i of t)
+                if (i.tasks.length > 0) {
+                  const f = i.tasks[0].id;
+                  r(f), g(f);
+                  break;
+                }
+              return;
+            }
+            const p = T(n);
+            if (!p) return;
+            const m = p.taskIndex + l, C = y(p.columnIndex, m);
+            C && (r(C), g(C), u.shiftKey && n && b(n, C));
+            return;
+          }
+          case "ArrowLeft":
+          case "ArrowRight": {
+            u.preventDefault();
+            const l = u.key === "ArrowRight" ? 1 : -1;
+            if (!n) return;
+            const p = T(n);
+            if (!p) return;
+            let m = p.columnIndex + l;
+            for (; m >= 0 && m < t.length; ) {
+              if (t[m].tasks.length > 0) {
+                const C = Math.min(p.taskIndex, t[m].tasks.length - 1), i = t[m].tasks[C].id;
+                r(i), g(i);
+                return;
+              }
+              m += l;
+            }
+            return;
+          }
+          case "Enter": {
+            n && (u.preventDefault(), x(n));
+            return;
+          }
+          case " ": {
+            n && (u.preventDefault(), h(n));
+            return;
+          }
+          case "Escape": {
+            u.preventDefault(), o.size > 0 ? v() : c && d();
+            return;
+          }
+        }
+    },
+    [
+      n,
+      t,
+      o,
+      c,
+      T,
+      y,
+      r,
+      g,
+      h,
+      b,
+      v,
+      d,
+      x
+    ]
+  );
+  oe(() => {
+    const u = s.current;
+    if (u)
+      return u.addEventListener("keydown", S), () => u.removeEventListener("keydown", S);
+  }, [s, S]);
+}
+function qt() {
   return {
     onDragStart({ active: s }) {
       const t = s.data.current;
@@ -394,204 +1767,183 @@ function Ge() {
     },
     onDragOver({ active: s, over: t }) {
       if (!t) return;
-      const r = s.data.current;
-      if ((r == null ? void 0 : r.type) === "task")
-        return `Task ${r.task.title} is over ${t.id}`;
+      const n = s.data.current;
+      if ((n == null ? void 0 : n.type) === "task")
+        return `Task ${n.task.title} is over ${t.id}`;
     },
     onDragEnd({ active: s, over: t }) {
       if (!t) return "Dropped item";
-      const r = s.data.current;
-      return (r == null ? void 0 : r.type) === "task" ? `Dropped task: ${r.task.title}` : "Dropped item";
+      const n = s.data.current;
+      return (n == null ? void 0 : n.type) === "task" ? `Dropped task: ${n.task.title}` : "Dropped item";
     },
     onDragCancel() {
       return "Dragging cancelled";
     }
   };
 }
-const Pe = F.forwardRef(
-  function({
-    initialData: t,
-    onTaskMove: r,
-    onTaskAdd: h,
-    onColumnRename: m,
-    onColumnDelete: w,
-    onColumnToggleVisibility: f,
-    onClickTask: D,
-    onAddColumn: C
-  }, T) {
-    const [E, x] = O(t), [k, S] = O(null), [G, R] = O(!1), B = J(null), K = se(B, T);
-    Z(() => {
-      x(t);
-    }, [t]), Z(() => {
-      R(!0);
-    }, []);
-    const z = be(
-      U(De, {
-        activationConstraint: {
-          distance: 5
-        }
-      }),
-      U(Ie, {
-        activationConstraint: {
-          delay: 200,
-          tolerance: 5
-        }
-      }),
-      U(ke, {
-        coordinateGetter: we
-      })
-    ), P = le(() => Ge(), []), g = E.columns, V = g.map((a) => `column-${a.id}`), I = L(
-      (a) => {
-        for (const i of g)
-          if (i.tasks.some((p) => p.id === a))
-            return i.id;
-        return null;
-      },
-      [g]
-    ), A = L(
-      (a, i, p, u) => {
-        x((v) => {
-          const y = v.columns.map((b) => ({
-            ...b,
-            tasks: [...b.tasks]
-          })), d = y.find((b) => b.id === i), N = y.find((b) => b.id === p);
-          if (!d || !N) return v;
-          const n = d.tasks.findIndex((b) => b.id === a);
-          if (n === -1) return v;
-          const [l] = d.tasks.splice(n, 1);
-          return N.tasks.splice(u, 0, l), { columns: y };
-        });
-      },
-      []
-    ), M = L((a) => {
-      const i = a.active.data.current;
-      (i == null ? void 0 : i.type) === "task" && S(i.task);
-    }, []), W = L(
-      (a) => {
-        const { active: i, over: p } = a;
-        if (!p) return;
-        const u = i.id, v = p.id, y = I(u);
-        if (!y) return;
-        let d = null, N = 0;
-        if (v.startsWith("column-")) {
-          d = v.replace("column-", "");
-          const n = g.find((l) => l.id === d);
-          N = (n == null ? void 0 : n.tasks.length) ?? 0;
-        } else if (d = I(v), d) {
-          const n = g.find((l) => l.id === d);
-          N = (n == null ? void 0 : n.tasks.findIndex((l) => l.id === v)) ?? 0;
+function Xt({ className: s }) {
+  const {
+    columns: t,
+    viewMode: n,
+    activeTask: r,
+    setActiveTask: o,
+    onTaskMove: h,
+    onAddColumn: b
+  } = U(), [v, d] = A(!1);
+  ae(null);
+  const c = ae(null);
+  Yt(c), oe(() => {
+    d(!0);
+  }, []);
+  const x = et(
+    he(lt, {
+      activationConstraint: { distance: 5 }
+    }),
+    he(ot, {
+      activationConstraint: { delay: 200, tolerance: 5 }
+    }),
+    he(it, {
+      coordinateGetter: rt
+    })
+  ), T = ne(() => qt(), []), y = t.map((l) => `column-${l.id}`), g = E(
+    (l) => {
+      for (const p of t)
+        if (p.tasks.some((m) => m.id === l))
+          return p.id;
+      return null;
+    },
+    [t]
+  ), S = E(
+    (l) => {
+      const p = l.active.data.current;
+      (p == null ? void 0 : p.type) === "task" && o(p.task);
+    },
+    [o]
+  ), u = E(
+    (l) => {
+      const { active: p, over: m } = l;
+      if (!m) return;
+      const C = p.id, i = m.id, f = g(C);
+      if (!f) return;
+      let D = null, M = 0;
+      if (i.startsWith("column-")) {
+        D = i.replace("column-", "");
+        const N = t.find((R) => R.id === D);
+        M = (N == null ? void 0 : N.tasks.length) ?? 0;
+      } else if (D = g(i), D) {
+        const N = t.find((R) => R.id === D);
+        M = (N == null ? void 0 : N.tasks.findIndex((R) => R.id === i)) ?? 0;
+      }
+      !D || f === D || h(C, D, M);
+    },
+    [t, g, h]
+  ), k = E(
+    (l) => {
+      const { active: p, over: m } = l;
+      if (o(null), !m) return;
+      const C = p.id, i = m.id, f = g(C);
+      if (!f) return;
+      let D, M;
+      if (i.startsWith("column-")) {
+        D = i.replace("column-", "");
+        const N = t.find((R) => R.id === D);
+        if (M = (N == null ? void 0 : N.tasks.length) ?? 0, f === D) {
+          const R = N == null ? void 0 : N.tasks.findIndex((B) => B.id === C);
+          R !== void 0 && R >= 0 && (M = R);
         }
-        !d || y === d || A(u, y, d, N);
-      },
-      [g, I, A]
-    ), _ = L(
-      (a) => {
-        const { active: i, over: p } = a;
-        if (S(null), !p) return;
-        const u = i.id, v = p.id, y = I(u);
-        if (!y) return;
-        let d, N;
-        if (v.startsWith("column-")) {
-          d = v.replace("column-", "");
-          const n = g.find((l) => l.id === d);
-          if (N = (n == null ? void 0 : n.tasks.length) ?? 0, y === d) {
-            const l = n == null ? void 0 : n.tasks.findIndex((b) => b.id === u);
-            l !== void 0 && l >= 0 && (N = l);
+      } else {
+        D = g(i) ?? f;
+        const N = t.find((R) => R.id === D);
+        M = (N == null ? void 0 : N.tasks.findIndex((R) => R.id === i)) ?? 0;
+      }
+      h(C, D, M);
+    },
+    [t, g, o, h]
+  );
+  return /* @__PURE__ */ a(
+    tt,
+    {
+      sensors: x,
+      collisionDetection: st,
+      onDragStart: S,
+      onDragOver: u,
+      onDragEnd: k,
+      accessibility: { announcements: T },
+      children: [
+        /* @__PURE__ */ a(
+          "div",
+          {
+            ref: c,
+            tabIndex: 0,
+            className: "no-scrollbar flex h-full gap-ds-05 overflow-x-auto pb-ds-05 outline-none",
+            children: [
+              /* @__PURE__ */ e(
+                De,
+                {
+                  items: y,
+                  strategy: nt,
+                  children: t.map((l, p) => /* @__PURE__ */ e(
+                    "div",
+                    {
+                      className: "flex-shrink-0 animate-slide-right delay-stagger-50",
+                      style: { "--stagger-index": p },
+                      children: /* @__PURE__ */ e(Qe, { column: l, index: p })
+                    },
+                    l.id
+                  ))
+                }
+              ),
+              /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ a(
+                O,
+                {
+                  variant: "ghost",
+                  onClick: b,
+                  className: "h-ds-md w-[320px] justify-start gap-ds-03 rounded-ds-xl border border-dashed border-border/60 bg-layer-02 text-text-tertiary hover:border-border-interactive hover:bg-interactive-subtle/50 hover:text-interactive",
+                  children: [
+                    /* @__PURE__ */ e(xe, { className: "h-ico-sm w-ico-sm" }),
+                    "Add column"
+                  ]
+                }
+              ) })
+            ]
           }
-        } else {
-          d = I(v) ?? y;
-          const n = g.find((l) => l.id === d);
-          N = (n == null ? void 0 : n.tasks.findIndex((l) => l.id === v)) ?? 0;
-        }
-        if (y === d) {
-          const n = g.find((b) => b.id === d), l = n == null ? void 0 : n.tasks.findIndex((b) => b.id === u);
-          l !== void 0 && l !== N && A(u, y, d, N);
-        }
-        r == null || r(u, d, N);
-      },
-      [g, I, A, r]
-    ), Y = (a, i) => {
-      h == null || h(a, i);
-    }, o = (a, i) => {
-      x((p) => ({
-        columns: p.columns.map(
-          (u) => u.id === a ? { ...u, name: i } : u
-        )
-      })), m == null || m(a, i);
-    }, de = (a) => {
-      x((i) => ({
-        columns: i.columns.filter((p) => p.id !== a)
-      })), w == null || w(a);
-    }, ce = (a, i) => {
-      x((p) => ({
-        columns: p.columns.map(
-          (u) => u.id === a ? { ...u, isClientVisible: i } : u
+        ),
+        v && Xe(
+          /* @__PURE__ */ e(at, { dropAnimation: { duration: 240, easing: "cubic-bezier(0.34, 1.56, 0.64, 1)" }, children: r ? n === "compact" ? /* @__PURE__ */ e(Ke, { task: r }) : /* @__PURE__ */ e(Ge, { task: r }) : null }),
+          document.body
         )
-      })), f == null || f(a, i);
-    };
-    return /* @__PURE__ */ c(
-      ge,
-      {
-        sensors: z,
-        collisionDetection: ve,
-        onDragStart: M,
-        onDragOver: W,
-        onDragEnd: _,
-        accessibility: { announcements: P },
-        children: [
-          /* @__PURE__ */ c(
-            "div",
-            {
-              ref: K,
-              className: "no-scrollbar flex h-full gap-ds-05 overflow-x-auto pb-ds-05",
-              children: [
-                /* @__PURE__ */ e(
-                  re,
-                  {
-                    items: V,
-                    strategy: ye,
-                    children: g.map((a, i) => /* @__PURE__ */ e("div", { className: "group flex-shrink-0", children: /* @__PURE__ */ e(
-                      oe,
-                      {
-                        column: a,
-                        index: i,
-                        onAddTask: Y,
-                        onClickTask: D,
-                        onRenameColumn: o,
-                        onDeleteColumn: de,
-                        onToggleVisibility: ce
-                      }
-                    ) }, a.id))
-                  }
-                ),
-                /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ c(
-                  $,
-                  {
-                    variant: "ghost",
-                    onClick: C,
-                    className: "h-ds-md w-[300px] justify-start gap-ds-03 rounded-ds-xl border border-dashed border-border/60 bg-layer-02 text-text-tertiary hover:border-border-interactive hover:bg-interactive-subtle/50 hover:text-interactive",
-                    children: [
-                      /* @__PURE__ */ e(Q, { className: "h-ico-sm w-ico-sm" }),
-                      "Add column"
-                    ]
-                  }
-                ) })
-              ]
-            }
-          ),
-          G && me(
-            /* @__PURE__ */ e(Ne, { dropAnimation: null, children: k ? /* @__PURE__ */ e(ne, { task: k }) : null }),
-            document.body
-          )
-        ]
-      }
-    );
+      ]
+    }
+  );
+}
+const Jt = j.forwardRef(
+  function({ className: t, ...n }, r) {
+    return /* @__PURE__ */ e("div", { ref: r, className: t, children: /* @__PURE__ */ e(Pt, { ...n, children: /* @__PURE__ */ a("div", { className: "flex flex-col gap-ds-03", children: [
+      /* @__PURE__ */ e(Oe, {}),
+      /* @__PURE__ */ e(Be, {}),
+      /* @__PURE__ */ e(Xt, {})
+    ] }) }) });
   }
 );
-Pe.displayName = "KanbanBoard";
+Jt.displayName = "KanbanBoard";
 export {
-  oe as B,
-  Pe as K,
-  ie as T,
-  ne as a
+  Qe as B,
+  ve as C,
+  we as D,
+  Jt as K,
+  ce as P,
+  Ve as T,
+  Pt as a,
+  Oe as b,
+  Be as c,
+  Et as d,
+  We as e,
+  Pe as f,
+  fs as g,
+  Ue as h,
+  Ke as i,
+  Ge as j,
+  He as k,
+  Yt as l,
+  U as u
 };