@emberai-engg/task-board 0.3.6 → 0.4.1

package/dist/index.js

@@ -1,7 +1,9 @@
 "use strict";
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -15,37 +17,77 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  ActivityList: () => ActivityList,
+  ArrowLeftIcon: () => ArrowLeftIcon,
+  AttachmentsSection: () => AttachmentsSection,
   BellIcon: () => BellIcon,
   BoardSkeleton: () => BoardSkeleton,
+  Bold: () => Bold,
+  ChatDotsIcon: () => ChatDotsIcon,
+  CheckCircle2Icon: () => CheckCircle2Icon,
   CheckIcon: () => CheckIcon,
   ChevronDownIcon: () => ChevronDownIcon,
+  ChevronLeftIcon: () => ChevronLeftIcon,
+  ChevronRightIcon: () => ChevronRightIcon,
+  Code: () => Code,
+  ContextPill: () => ContextPill,
+  CornerUpLeftIcon: () => CornerUpLeftIcon,
   CreateTaskModal: () => CreateTaskModal,
   DEFAULT_COLUMNS: () => DEFAULT_COLUMNS,
+  DEFAULT_INTERNAL_LABEL: () => DEFAULT_INTERNAL_LABEL,
   DEFAULT_PAGE_SIZE: () => DEFAULT_PAGE_SIZE,
   DEFAULT_PRIORITIES: () => DEFAULT_PRIORITIES,
   DESCRIPTION_SECTIONS: () => DESCRIPTION_SECTIONS,
+  DescriptionSection: () => DescriptionSection,
   EMPTY_DESCRIPTION: () => EMPTY_DESCRIPTION,
+  ExternalLinkIcon: () => ExternalLinkIcon,
   FeedbackIcon: () => FeedbackIcon,
+  FileTextIcon: () => FileTextIcon,
   FilterBar: () => FilterBar,
   FilterIcon: () => FilterIcon,
+  Heading2: () => Heading2,
+  HelpCircleIcon: () => HelpCircleIcon,
+  HighlightBubble: () => HighlightBubble,
+  HistoryIcon: () => HistoryIcon,
+  ImageIcon: () => ImageIcon,
+  Italic: () => Italic,
   KanbanColumn: () => KanbanColumn,
   KanbanIcon: () => KanbanIcon,
+  Link2Icon: () => Link2Icon,
   LinkIcon: () => LinkIcon,
+  List: () => List,
+  ListOrdered: () => ListOrdered,
   LockIcon: () => LockIcon,
+  MarkdownEditor: () => MarkdownEditor,
+  MarkdownView: () => MarkdownView,
   MentionText: () => MentionText,
   MentionTextarea: () => MentionTextarea,
   MessageSquareIcon: () => MessageSquareIcon,
+  MoreVerticalIcon: () => MoreVerticalIcon,
   NotificationBell: () => NotificationBell,
+  OutstandingQuestionsSection: () => OutstandingQuestionsSection,
   POSITION_GAP: () => POSITION_GAP,
   PREDEFINED_TAGS: () => PREDEFINED_TAGS,
   PencilIcon: () => PencilIcon,
   PlusIcon: () => PlusIcon,
   PriorityBadge: () => PriorityBadge,
+  Quote: () => Quote,
+  RotateCcwIcon: () => RotateCcwIcon,
+  Share2Icon: () => Share2Icon,
+  SidebarToggleIcon: () => SidebarToggleIcon,
   SkeletonCard: () => SkeletonCard,
   SkeletonPulse: () => SkeletonPulse,
   TagBadge: () => TagBadge,
@@ -53,25 +95,40 @@ __export(index_exports, {
   TaskBoardProvider: () => TaskBoardProvider,
   TaskCard: () => TaskCard,
   TaskDetailPanel: () => TaskDetailPanel,
+  TaskDetailView: () => TaskDetailView,
+  ThreadCard: () => ThreadCard,
+  ThreadComposer: () => ThreadComposer,
+  ThreadDetailView: () => ThreadDetailView,
+  ThreadsPanel: () => ThreadsPanel,
   TrashIcon: () => TrashIcon,
   UserAvatar: () => UserAvatar,
   XIcon: () => XIcon,
   createTaskBoardService: () => createTaskBoardService,
+  deriveThreads: () => deriveThreads,
   formatDate: () => formatDate,
   formatDateTime: () => formatDateTime,
+  formatTaskId: () => formatTaskId,
   getDescriptionPreview: () => getDescriptionPreview,
   getInitials: () => getInitials,
   getPriorityStyle: () => getPriorityStyle,
   getTagStyle: () => getTagStyle,
   getUserProjects: () => getUserProjects,
   hasDescription: () => hasDescription,
+  htmlToMd: () => htmlToMd,
+  mdToHtml: () => mdToHtml,
+  parseDate: () => parseDate,
+  sectionLabel: () => sectionLabel,
+  timeAgo: () => timeAgo,
   toDisplayText: () => toDisplayText,
   toStoredText: () => toStoredText,
+  useHighlightAnchor: () => useHighlightAnchor,
   useShareLink: () => useShareLink,
   useTaskActions: () => useTaskActions,
+  useTaskAttachments: () => useTaskAttachments,
   useTaskBoard: () => useTaskBoard,
   useTaskBoardContext: () => useTaskBoardContext,
-  useTaskDetail: () => useTaskDetail
+  useTaskDetail: () => useTaskDetail,
+  useTaskQuestions: () => useTaskQuestions
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -116,7 +173,7 @@ function createTaskBoardService(apiClient, basePath = "/api/v1/taskboard") {
     async markTaskRead(taskId) {
       await apiClient.post(`${basePath}/tasks/${taskId}/read`);
     },
-    // ─── Comments ───
+    // ─── Comments / Threads ───
     async listComments(taskId) {
       const { data } = await apiClient.get(`${basePath}/tasks/${taskId}/comments`);
       return data;
@@ -135,6 +192,70 @@ function createTaskBoardService(apiClient, basePath = "/api/v1/taskboard") {
     async deleteComment(taskId, commentId) {
       await apiClient.delete(`${basePath}/tasks/${taskId}/comments/${commentId}`);
     },
+    async updateThread(taskId, threadId, payload) {
+      const { data } = await apiClient.patch(
+        `${basePath}/tasks/${taskId}/threads/${threadId}`,
+        payload
+      );
+      return data;
+    },
+    // ─── Outstanding Questions ───
+    async listQuestions(taskId) {
+      const { data } = await apiClient.get(`${basePath}/tasks/${taskId}/questions`);
+      return data;
+    },
+    async createQuestion(taskId, payload) {
+      const { data } = await apiClient.post(`${basePath}/tasks/${taskId}/questions`, payload);
+      return data;
+    },
+    async updateQuestion(taskId, questionId, payload) {
+      const { data } = await apiClient.patch(
+        `${basePath}/tasks/${taskId}/questions/${questionId}`,
+        payload
+      );
+      return data;
+    },
+    async deleteQuestion(taskId, questionId) {
+      await apiClient.delete(`${basePath}/tasks/${taskId}/questions/${questionId}`);
+    },
+    async addQuestionReply(taskId, questionId, payload) {
+      const { data } = await apiClient.post(
+        `${basePath}/tasks/${taskId}/questions/${questionId}/replies`,
+        payload
+      );
+      return data;
+    },
+    async deleteQuestionReply(taskId, questionId, replyId) {
+      await apiClient.delete(
+        `${basePath}/tasks/${taskId}/questions/${questionId}/replies/${replyId}`
+      );
+    },
+    // ─── Attachments ───
+    async listAttachments(taskId) {
+      const { data } = await apiClient.get(
+        `${basePath}/tasks/${taskId}/attachments`
+      );
+      return data;
+    },
+    async uploadAttachment(taskId, file) {
+      const form = new FormData();
+      form.append("file", file);
+      const { data } = await apiClient.post(
+        `${basePath}/tasks/${taskId}/attachments/upload`,
+        form
+      );
+      return data;
+    },
+    async addLinkAttachment(taskId, payload) {
+      const { data } = await apiClient.post(
+        `${basePath}/tasks/${taskId}/attachments/link`,
+        payload
+      );
+      return data;
+    },
+    async deleteAttachment(taskId, attachmentId) {
+      await apiClient.delete(`${basePath}/tasks/${taskId}/attachments/${attachmentId}`);
+    },
     // ─── Projects ───
     async listProjects() {
       const { data } = await apiClient.get(`${basePath}/projects`);
@@ -171,20 +292,20 @@ function createTaskBoardService(apiClient, basePath = "/api/v1/taskboard") {
 
 // src/utils/constants.ts
 var DEFAULT_COLUMNS = [
-  { key: "backlog", label: "Backlog", color: "bg-neutral-400", description: "Tasks not yet scheduled" },
-  { key: "blocked", label: "Blocked", color: "bg-red-500", description: "Waiting on a dependency" },
-  { key: "queued", label: "Queued", color: "bg-blue-500", description: "Scheduled for this sprint" },
-  { key: "in_progress", label: "In Progress", color: "bg-amber-500", description: "Actively being worked on" },
-  { key: "in_testing", label: "In Testing", color: "bg-teal-500", description: "Under QA and validation" },
-  { key: "client_review", label: "Client Review", color: "bg-purple-500", description: "Live & ready for client review" },
-  { key: "changes_requested", label: "Changes Requested", color: "bg-orange-500", description: "Revisions needed from review" },
-  { key: "approved", label: "Approved", color: "bg-green-500", description: "Signed off and complete" }
+  { key: "backlog", label: "Backlog", color: "bg-neutral-400", chip: "bg-neutral-100 text-neutral-700", description: "Tasks not yet scheduled" },
+  { key: "blocked", label: "Blocked", color: "bg-red-500", chip: "bg-red-50 text-red-700", description: "Waiting on a dependency" },
+  { key: "queued", label: "Queued", color: "bg-[#FF5E00]", chip: "bg-[#FF5E00]/10 text-[#FF5E00]", description: "Scheduled for this sprint" },
+  { key: "in_progress", label: "In Progress", color: "bg-amber-500", chip: "bg-amber-50 text-amber-700", description: "Actively being worked on" },
+  { key: "in_testing", label: "In Testing", color: "bg-teal-500", chip: "bg-teal-50 text-teal-700", description: "Under QA and validation" },
+  { key: "client_review", label: "Client Review", color: "bg-purple-500", chip: "bg-purple-50 text-purple-700", description: "Live & ready for client review" },
+  { key: "changes_requested", label: "Changes Requested", color: "bg-orange-500", chip: "bg-orange-50 text-orange-700", description: "Revisions needed from review" },
+  { key: "approved", label: "Approved", color: "bg-green-500", chip: "bg-green-50 text-green-700", description: "Signed off and complete" }
 ];
 var DEFAULT_PRIORITIES = [
-  { value: "urgent", label: "Critical", className: "bg-red-50 text-red-600 border-red-200" },
-  { value: "high", label: "High", className: "bg-orange-50 text-orange-600 border-orange-200" },
-  { value: "medium", label: "Medium", className: "bg-amber-50 text-amber-600 border-amber-200" },
-  { value: "low", label: "Low", className: "bg-neutral-100 text-neutral-500 border-neutral-200" }
+  { value: "urgent", label: "Critical", className: "bg-red-50 text-red-600 border-red-200", dot: "bg-red-500" },
+  { value: "high", label: "High", className: "bg-orange-50 text-orange-600 border-orange-200", dot: "bg-orange-500" },
+  { value: "medium", label: "Medium", className: "bg-amber-50 text-amber-600 border-amber-200", dot: "bg-amber-500" },
+  { value: "low", label: "Low", className: "bg-neutral-100 text-neutral-500 border-neutral-200", dot: "bg-neutral-300" }
 ];
 var PREDEFINED_TAGS = [
   { value: "traceability", label: "Traceability", className: "bg-blue-50 text-blue-600 border-blue-200" },
@@ -195,11 +316,10 @@ var PREDEFINED_TAGS = [
   { value: "bug-fix", label: "Bug Fix", className: "bg-red-50 text-red-600 border-red-200" }
 ];
 var DESCRIPTION_SECTIONS = [
-  { key: "problem", label: "Problem" },
-  { key: "user_story", label: "User Story" },
-  { key: "proposed_behavior", label: "Proposed Behavior" },
-  { key: "acceptance_criteria", label: "Acceptance Criteria" },
-  { key: "open_questions", label: "Open Questions" }
+  { key: "problem", label: "Problem", placeholder: "Describe the problem..." },
+  { key: "user_story", label: "User Story", placeholder: "As a ___, I want ___, so that ___..." },
+  { key: "proposed_behavior", label: "Proposed Behavior", placeholder: "Describe the proposed behavior..." },
+  { key: "acceptance_criteria", label: "Acceptance Criteria", placeholder: "What needs to be true for this to be considered done?" }
 ];
 var EMPTY_DESCRIPTION = {
   problem: "",
@@ -211,6 +331,7 @@ var EMPTY_DESCRIPTION = {
 var POSITION_GAP = 1e3;
 var DEFAULT_PAGE_SIZE = 10;
 var NOTIFICATION_POLL_INTERVAL = 3e4;
+var DEFAULT_INTERNAL_LABEL = "Internal";
 
 // src/context/TaskBoardProvider.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
@@ -252,6 +373,7 @@ function TaskBoardProvider({
       columns: config.columns ?? DEFAULT_COLUMNS,
       priorities: config.priorities ?? DEFAULT_PRIORITIES,
       tags: config.tags ?? PREDEFINED_TAGS,
+      internalLabel: config.internalLabel ?? "Internal",
       config,
       features
     }),
@@ -530,27 +652,27 @@ function getInitials(name) {
 }
 function parseDate(dateStr) {
   if (!dateStr) return /* @__PURE__ */ new Date();
-  const d = new Date(dateStr);
-  if (isNaN(d.getTime()) && !dateStr.endsWith("Z") && !dateStr.includes("+")) {
+  if (!dateStr.endsWith("Z") && !dateStr.includes("+") && !/\d{2}:\d{2}$/.test(dateStr.slice(-6))) {
     return /* @__PURE__ */ new Date(dateStr + "Z");
   }
-  return d;
+  return new Date(dateStr);
 }
 function formatDate(dateStr) {
   if (!dateStr) return "";
-  const d = parseDate(dateStr);
-  return d.toLocaleDateString("en-US", { month: "short", day: "numeric" });
+  return parseDate(dateStr).toLocaleDateString("en-US", { month: "short", day: "numeric" });
 }
 function formatDateTime(dateStr) {
   if (!dateStr) return "";
-  const d = parseDate(dateStr);
-  return d.toLocaleDateString("en-US", {
+  return parseDate(dateStr).toLocaleString("en-US", {
     month: "short",
     day: "numeric",
     hour: "numeric",
     minute: "2-digit"
   });
 }
+function formatTaskId(id) {
+  return `T-${id.slice(-6).toUpperCase()}`;
+}
 function stripMentionMarkup(text) {
   return text.replace(/@\[(.*?)\]\(.*?\)/g, "@$1");
 }
@@ -561,12 +683,14 @@ function getDescriptionPreview(desc) {
     const val = desc[section.key]?.trim();
     if (val) return stripMentionMarkup(val);
   }
+  if (desc.open_questions?.trim()) return stripMentionMarkup(desc.open_questions.trim());
   return "";
 }
 function hasDescription(desc) {
   if (!desc) return false;
   if (typeof desc === "string") return desc.trim().length > 0;
-  return DESCRIPTION_SECTIONS.some((s) => desc[s.key]?.trim());
+  if (DESCRIPTION_SECTIONS.some((s) => desc[s.key]?.trim())) return true;
+  return !!desc.open_questions?.trim();
 }
 function getUserProjects(apps, allProjects) {
   if (apps.includes("all")) return allProjects;
@@ -592,6 +716,24 @@ var XIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */
   /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
 ] });
 var ChevronDownIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "6 9 12 15 18 9" }) });
+var ChevronLeftIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "15 18 9 12 15 6" }) });
+var ChevronRightIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "9 18 15 12 9 6" }) });
+var ArrowLeftIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "19", y1: "12", x2: "5", y2: "12" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "12 19 5 12 12 5" })
+] });
+var MoreVerticalIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "12", cy: "12", r: "1" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "12", cy: "5", r: "1" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "12", cy: "19", r: "1" })
+] });
+var Share2Icon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "18", cy: "5", r: "3" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "6", cy: "12", r: "3" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "18", cy: "19", r: "3" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "8.59", y1: "13.51", x2: "15.42", y2: "17.49" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "15.41", y1: "6.51", x2: "8.59", y2: "10.49" })
+] });
 var MessageSquareIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" }) });
 var KanbanIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
   /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("rect", { width: "8", height: "4", x: "8", y: "2", rx: "1", ry: "1" }),
@@ -602,7 +744,33 @@ var LinkIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__
   /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" }),
   /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" })
 ] });
+var Link2Icon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M9 17H7A5 5 0 0 1 7 7h2" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M15 7h2a5 5 0 1 1 0 10h-2" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "8", y1: "12", x2: "16", y2: "12" })
+] });
+var ExternalLinkIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "15 3 21 3 21 9" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
+] });
+var ImageIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", ry: "2" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "9", cy: "9", r: "2" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" })
+] });
+var FileTextIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "14 2 14 8 20 8" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "16", y1: "13", x2: "8", y2: "13" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "16", y1: "17", x2: "8", y2: "17" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "10", y1: "9", x2: "8", y2: "9" })
+] });
 var CheckIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M20 6 9 17l-5-5" }) });
+var CheckCircle2Icon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "9 11 12 14 15 11" })
+] });
 var BellIcon = ({ className = "", size = 24 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { className, width: size, height: size, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 1.75, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M14.857 17.082a23.848 23.848 0 005.454-1.31A8.967 8.967 0 0118 9.75v-.7V9A6 6 0 006 9v.75a8.967 8.967 0 01-2.312 6.022c1.733.64 3.56 1.085 5.455 1.31m5.714 0a24.255 24.255 0 01-5.714 0m5.714 0a3 3 0 11-5.714 0" }) });
 var FilterIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polygon", { points: "22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3" }) });
 var PencilIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z" }) });
@@ -621,6 +789,73 @@ var FeedbackIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PUR
   /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M12 12h.01" }),
   /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M16 12h.01" })
 ] });
+var HelpCircleIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
+] });
+var CornerUpLeftIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "9 14 4 9 9 4" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M20 20v-7a4 4 0 0 0-4-4H4" })
+] });
+var RotateCcwIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M3 3v5h5" })
+] });
+var Bold = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M14 12a4 4 0 0 0 0-8H6v8" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M15 20a4 4 0 0 0 0-8H6v8Z" })
+] });
+var Italic = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "19", y1: "4", x2: "10", y2: "4" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "14", y1: "20", x2: "5", y2: "20" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "15", y1: "4", x2: "9", y2: "20" })
+] });
+var List = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "8", y1: "6", x2: "21", y2: "6" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "8", y1: "12", x2: "21", y2: "12" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "8", y1: "18", x2: "21", y2: "18" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "3", y1: "6", x2: "3.01", y2: "6" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "3", y1: "12", x2: "3.01", y2: "12" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "3", y1: "18", x2: "3.01", y2: "18" })
+] });
+var ListOrdered = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "10", y1: "6", x2: "21", y2: "6" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "10", y1: "12", x2: "21", y2: "12" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "10", y1: "18", x2: "21", y2: "18" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M4 6h1v4" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M4 10h2" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M6 18H4c0-1 2-2 2-3s-1-1.5-2-1" })
+] });
+var Heading2 = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M4 12h8" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M4 18V6" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M12 18V6" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M21 18h-4c0-4 4-3 4-6 0-1.5-2-2.5-4-1" })
+] });
+var Quote = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M3 21c3 0 7-1 7-8V5c0-1.25-.756-2.017-2-2H4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2 1 0 1 0 1 1v1c0 1-1 2-2 2s-1 .008-1 1.031V20c0 1 0 1 1 1z" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M15 21c3 0 7-1 7-8V5c0-1.25-.757-2.017-2-2h-4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2h.75c0 2.25.25 4-2.75 4v3c0 1 0 1 1 1z" })
+] });
+var Code = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "16 18 22 12 16 6" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "8 6 2 12 8 18" })
+] });
+var ChatDotsIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "8", y1: "10", x2: "8.01", y2: "10" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "12", y1: "10", x2: "12.01", y2: "10" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "16", y1: "10", x2: "16.01", y2: "10" })
+] });
+var HistoryIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M3 12a9 9 0 1 0 3-6.7L3 8" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "3 3 3 8 8 8" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "12 7 12 12 15 14" })
+] });
+var SidebarToggleIcon = ({ className = "", size = 24, strokeWidth = 2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "9", y1: "3", x2: "9", y2: "21" })
+] });
 
 // src/components/TagBadge.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
@@ -2130,9 +2365,13 @@ function TaskBoard({
       try {
         const task = await service.getTask(taskId);
         if (cancelled) return;
-        setSelectedTask(task);
-        service.markTaskRead(taskId).catch(() => {
-        });
+        if (onTaskOpen) {
+          onTaskOpen(task);
+        } else {
+          setSelectedTask(task);
+          service.markTaskRead(taskId).catch(() => {
+          });
+        }
         const url = new URL(window.location.href);
         url.searchParams.delete("task");
         window.history.replaceState({}, "", url.toString());
@@ -2143,7 +2382,7 @@ function TaskBoard({
     return () => {
       cancelled = true;
     };
-  }, [board.selectedProject, board.boardLoading, sharedTaskHandled, service]);
+  }, [board.selectedProject, board.boardLoading, sharedTaskHandled, service, onTaskOpen]);
   (0, import_react13.useEffect)(() => {
     if (typeof window === "undefined") return;
     if (board.selectedProject && board.projects.length > 1) {
@@ -2165,7 +2404,9 @@ function TaskBoard({
     );
   }, [actions]);
   const handleTaskClick = (task) => {
-    setSelectedTask(task);
+    if (!onTaskOpen) {
+      setSelectedTask(task);
+    }
     onTaskOpen?.(task);
     actions.markTaskRead(task.id);
     if (task.has_unread) {
@@ -2191,9 +2432,13 @@ function TaskBoard({
     }
     try {
       const task = await service.getTask(taskId);
-      setSelectedTask(task);
-      service.markTaskRead(taskId).catch(() => {
-      });
+      if (onTaskOpen) {
+        onTaskOpen(task);
+      } else {
+        setSelectedTask(task);
+        service.markTaskRead(taskId).catch(() => {
+        });
+      }
     } catch {
       board.setError("Could not open task.");
     }
@@ -2314,34 +2559,3196 @@ function TaskBoard({
     ))
   ] });
 }
+
+// src/components/TaskDetailView.tsx
+var import_react25 = require("react");
+
+// src/utils/threads.ts
+function deriveThreads(comments, attachments) {
+  const attachById = new Map(attachments.map((a) => [a.id, a]));
+  const topLevel = comments.filter((c) => !c.parent_id);
+  const repliesByParent = /* @__PURE__ */ new Map();
+  for (const c of comments) {
+    if (c.parent_id) {
+      const arr = repliesByParent.get(c.parent_id) || [];
+      arr.push(c);
+      repliesByParent.set(c.parent_id, arr);
+    }
+  }
+  return topLevel.map((c) => {
+    const stripped = c.content.replace(/@\[(.*?)\]\(.*?\)/g, "@$1");
+    const lines = stripped.split(/\r?\n/).filter((l) => l.trim());
+    let title = (c.title || "").trim();
+    let titleDerived = false;
+    if (!title) {
+      const firstLine = lines[0] || "";
+      title = firstLine.length > 80 ? firstLine.slice(0, 80) + "\u2026" : firstLine;
+      if (!title) title = "Comment";
+      titleDerived = true;
+    }
+    const preview = lines.join(" ").slice(0, 200);
+    const replies = (repliesByParent.get(c.id) || []).sort((a, b) => new Date(a.created_at).getTime() - new Date(b.created_at).getTime()).map((r) => ({
+      id: r.id,
+      author_id: r.author_id,
+      author_name: r.author_name,
+      content: r.content,
+      created_at: r.created_at,
+      is_internal: !!r.is_internal
+    }));
+    const threadAttachments = (c.attachment_ids || []).map((aid) => attachById.get(aid)).filter((a) => Boolean(a));
+    return {
+      id: c.id,
+      title,
+      titleDerived,
+      preview,
+      author_id: c.author_id,
+      author_name: c.author_name,
+      created_at: c.created_at,
+      is_internal: !!c.is_internal,
+      status: c.thread_status === "complete" ? "complete" : "active",
+      rawContent: c.content,
+      anchor: c.anchor || null,
+      attachments: threadAttachments,
+      replies
+    };
+  });
+}
+function sectionLabel(key) {
+  return DESCRIPTION_SECTIONS.find((s) => s.key === key)?.label || key;
+}
+function timeAgo(dateStr) {
+  const d = parseDate(dateStr);
+  const diff = Date.now() - d.getTime();
+  const minutes = Math.floor(diff / 6e4);
+  if (minutes < 1) return "just now";
+  if (minutes < 60) return `${minutes}m ago`;
+  const hours = Math.floor(minutes / 60);
+  if (hours < 24) return `${hours}h ago`;
+  const days = Math.floor(hours / 24);
+  if (days < 30) return `${days}d ago`;
+  return formatDate(dateStr);
+}
+
+// src/components/DescriptionSection.tsx
+var import_react16 = require("react");
+
+// src/components/MarkdownView.tsx
+var import_react14 = __toESM(require("react"));
+var import_jsx_runtime16 = require("react/jsx-runtime");
+function MarkdownView({ content, className = "" }) {
+  if (!content?.trim()) return null;
+  const renderInline = (text, keyBase) => {
+    const out = [];
+    const parts = text.split(/(@\[.*?\]\(.*?\))/g);
+    let k = 0;
+    for (const part of parts) {
+      const m = part.match(/^@\[(.*?)\]\((.*?)\)$/);
+      if (m) {
+        out.push(
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+            "span",
+            {
+              className: "inline-flex items-center px-1.5 py-0.5 mx-0.5 bg-[#FF5E00]/10 text-[#FF5E00] rounded text-[11px] font-semibold cursor-default",
+              title: `@${m[2]}`,
+              children: [
+                "@",
+                m[1]
+              ]
+            },
+            `${keyBase}-m${k++}`
+          )
+        );
+        continue;
+      }
+      const segs = part.split(/(\*\*.*?\*\*|`[^`]+`)/g);
+      for (const seg of segs) {
+        if (!seg) continue;
+        const bold = seg.match(/^\*\*(.+?)\*\*$/);
+        const code = seg.match(/^`(.+?)`$/);
+        if (bold) {
+          out.push(
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("strong", { className: "font-semibold text-neutral-900", children: bold[1] }, `${keyBase}-b${k++}`)
+          );
+        } else if (code) {
+          out.push(
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+              "code",
+              {
+                className: "px-1 py-px rounded bg-neutral-100 text-neutral-800 text-[12px] font-mono",
+                children: code[1]
+              },
+              `${keyBase}-c${k++}`
+            )
+          );
+        } else {
+          out.push(/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react14.default.Fragment, { children: seg }, `${keyBase}-t${k++}`));
+        }
+      }
+    }
+    return out;
+  };
+  const lines = content.split(/\r?\n/);
+  const blocks = [];
+  let i = 0;
+  let blockKey = 0;
+  while (i < lines.length) {
+    const raw = lines[i];
+    const line = raw.trimEnd();
+    const trimmed = line.trim();
+    if (!trimmed) {
+      i++;
+      continue;
+    }
+    if (/^### /.test(trimmed)) {
+      blocks.push(
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("h3", { className: "text-[15px] font-semibold text-neutral-900 mt-3 mb-1.5", children: renderInline(trimmed.replace(/^### /, ""), `b${blockKey}`) }, blockKey++)
+      );
+      i++;
+      continue;
+    }
+    if (/^## /.test(trimmed)) {
+      blocks.push(
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("h3", { className: "text-base font-semibold text-neutral-900 mt-4 mb-1.5", children: renderInline(trimmed.replace(/^## /, ""), `b${blockKey}`) }, blockKey++)
+      );
+      i++;
+      continue;
+    }
+    if (/^# /.test(trimmed)) {
+      blocks.push(
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("h2", { className: "text-lg font-semibold text-neutral-900 mt-4 mb-2", children: renderInline(trimmed.replace(/^# /, ""), `b${blockKey}`) }, blockKey++)
+      );
+      i++;
+      continue;
+    }
+    if (/^> /.test(trimmed)) {
+      const quoteLines = [];
+      while (i < lines.length && /^> /.test(lines[i].trim())) {
+        quoteLines.push(lines[i].trim().replace(/^> /, ""));
+        i++;
+      }
+      blocks.push(
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          "blockquote",
+          {
+            className: "border-l-2 border-neutral-200 pl-3 my-2 text-neutral-600 italic",
+            children: quoteLines.map((q, j) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { children: renderInline(q, `bq${blockKey}-${j}`) }, j))
+          },
+          blockKey++
+        )
+      );
+      continue;
+    }
+    if (/^[-*] \[[ xX]\] /.test(trimmed)) {
+      const taskItems = [];
+      while (i < lines.length && /^[-*] \[[ xX]\] /.test(lines[i].trim())) {
+        const m = lines[i].trim().match(/^[-*] \[([ xX])\] (.*)$/);
+        if (!m) break;
+        taskItems.push({ checked: m[1].toLowerCase() === "x", text: m[2] });
+        i++;
+      }
+      blocks.push(
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("ul", { className: "my-1.5 space-y-1", children: taskItems.map((t, j) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("li", { className: "flex items-start gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+            "input",
+            {
+              type: "checkbox",
+              checked: t.checked,
+              readOnly: true,
+              className: "mt-1 accent-[#FF5E00]"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: t.checked ? "line-through text-neutral-400" : "text-neutral-700", children: renderInline(t.text, `t${blockKey}-${j}`) })
+        ] }, j)) }, blockKey++)
+      );
+      continue;
+    }
+    if (/^[-*] /.test(trimmed)) {
+      const items = [];
+      while (i < lines.length && /^[-*] /.test(lines[i].trim())) {
+        items.push(lines[i].trim().replace(/^[-*] /, ""));
+        i++;
+      }
+      blocks.push(
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("ul", { className: "list-disc pl-5 my-1.5 space-y-0.5", children: items.map((it, j) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("li", { className: "text-neutral-700 leading-relaxed", children: renderInline(it, `u${blockKey}-${j}`) }, j)) }, blockKey++)
+      );
+      continue;
+    }
+    if (/^\d+\. /.test(trimmed)) {
+      const items = [];
+      while (i < lines.length && /^\d+\. /.test(lines[i].trim())) {
+        items.push(lines[i].trim().replace(/^\d+\. /, ""));
+        i++;
+      }
+      blocks.push(
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("ol", { className: "list-decimal pl-5 my-1.5 space-y-0.5", children: items.map((it, j) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("li", { className: "text-neutral-700 leading-relaxed", children: renderInline(it, `o${blockKey}-${j}`) }, j)) }, blockKey++)
+      );
+      continue;
+    }
+    const paraLines = [trimmed];
+    i++;
+    while (i < lines.length && lines[i].trim() && !/^(#{1,3} |> |[-*] (\[[ xX]\] )?|\d+\. )/.test(lines[i].trim())) {
+      paraLines.push(lines[i].trim());
+      i++;
+    }
+    blocks.push(
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "text-neutral-700 leading-relaxed my-1.5", children: renderInline(paraLines.join(" "), `p${blockKey}`) }, blockKey++)
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className, children: blocks });
+}
+
+// src/components/MarkdownEditor.tsx
+var import_react15 = require("react");
+
+// src/utils/markdown.ts
+function escapeHtml(s) {
+  return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+}
+function inlineMdToHtml(text) {
+  const tokens = text.split(/(@\[.*?\]\([^)]*?\))/g);
+  return tokens.map((tok) => {
+    const m = tok.match(/^@\[(.*?)\]\(([^)]*?)\)$/);
+    if (m) {
+      return `<span class="mention-pill" data-mention-username="${escapeHtml(m[2])}">@${escapeHtml(m[1])}</span>`;
+    }
+    let s = escapeHtml(tok);
+    s = s.replace(/`([^`]+)`/g, "<code>$1</code>");
+    s = s.replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>");
+    s = s.replace(/(^|[^*])\*([^*\n]+?)\*(?!\*)/g, "$1<em>$2</em>");
+    return s;
+  }).join("");
+}
+function mdToHtml(md) {
+  if (!md.trim()) return "";
+  const lines = md.split(/\r?\n/);
+  const out = [];
+  let i = 0;
+  while (i < lines.length) {
+    const trimmed = lines[i].trim();
+    if (!trimmed) {
+      i++;
+      continue;
+    }
+    if (/^### /.test(trimmed)) {
+      out.push(`<h3>${inlineMdToHtml(trimmed.slice(4))}</h3>`);
+      i++;
+      continue;
+    }
+    if (/^## /.test(trimmed)) {
+      out.push(`<h2>${inlineMdToHtml(trimmed.slice(3))}</h2>`);
+      i++;
+      continue;
+    }
+    if (/^# /.test(trimmed)) {
+      out.push(`<h1>${inlineMdToHtml(trimmed.slice(2))}</h1>`);
+      i++;
+      continue;
+    }
+    if (/^[-*] /.test(trimmed)) {
+      out.push("<ul>");
+      while (i < lines.length && /^[-*] /.test(lines[i].trim())) {
+        const text = lines[i].trim().replace(/^[-*] /, "");
+        out.push(`<li>${inlineMdToHtml(text)}</li>`);
+        i++;
+      }
+      out.push("</ul>");
+      continue;
+    }
+    if (/^\d+\. /.test(trimmed)) {
+      out.push("<ol>");
+      while (i < lines.length && /^\d+\. /.test(lines[i].trim())) {
+        const text = lines[i].trim().replace(/^\d+\. /, "");
+        out.push(`<li>${inlineMdToHtml(text)}</li>`);
+        i++;
+      }
+      out.push("</ol>");
+      continue;
+    }
+    if (/^> /.test(trimmed)) {
+      out.push("<blockquote>");
+      while (i < lines.length && /^> /.test(lines[i].trim())) {
+        out.push(`<p>${inlineMdToHtml(lines[i].trim().slice(2))}</p>`);
+        i++;
+      }
+      out.push("</blockquote>");
+      continue;
+    }
+    const paraLines = [trimmed];
+    i++;
+    while (i < lines.length && lines[i].trim() && !/^(#{1,3} |> |[-*] |\d+\. )/.test(lines[i].trim())) {
+      paraLines.push(lines[i].trim());
+      i++;
+    }
+    out.push(`<p>${inlineMdToHtml(paraLines.join(" "))}</p>`);
+  }
+  return out.join("");
+}
+function inlineHtmlToMd(node) {
+  let out = "";
+  for (const child of Array.from(node.childNodes)) {
+    if (child.nodeType === Node.TEXT_NODE) {
+      out += child.textContent || "";
+      continue;
+    }
+    if (child.nodeType !== Node.ELEMENT_NODE) continue;
+    const el = child;
+    const tag = el.tagName.toLowerCase();
+    if (tag === "br") {
+      out += "\n";
+    } else if (tag === "strong" || tag === "b") {
+      out += "**" + inlineHtmlToMd(el) + "**";
+    } else if (tag === "em" || tag === "i") {
+      out += "*" + inlineHtmlToMd(el) + "*";
+    } else if (tag === "code") {
+      out += "`" + (el.textContent || "") + "`";
+    } else if (tag === "span" && el.classList.contains("mention-pill")) {
+      const username = el.dataset.mentionUsername || "";
+      const name = (el.textContent || "").replace(/^@/, "");
+      out += `@[${name}](${username})`;
+    } else {
+      out += inlineHtmlToMd(el);
+    }
+  }
+  return out;
+}
+function htmlToMd(html) {
+  if (!html || !html.trim()) return "";
+  const div = document.createElement("div");
+  div.innerHTML = html;
+  const blocks = [];
+  const handle = (el) => {
+    const tag = el.tagName.toLowerCase();
+    if (tag === "h1") return "# " + inlineHtmlToMd(el);
+    if (tag === "h2") return "## " + inlineHtmlToMd(el);
+    if (tag === "h3" || tag === "h4" || tag === "h5" || tag === "h6")
+      return "### " + inlineHtmlToMd(el);
+    if (tag === "p" || tag === "div") return inlineHtmlToMd(el);
+    if (tag === "ul") {
+      const items = Array.from(el.children).filter((c) => c.tagName.toLowerCase() === "li").map((li) => "- " + inlineHtmlToMd(li));
+      return items.join("\n");
+    }
+    if (tag === "ol") {
+      const items = Array.from(el.children).filter((c) => c.tagName.toLowerCase() === "li").map((li, idx) => `${idx + 1}. ` + inlineHtmlToMd(li));
+      return items.join("\n");
+    }
+    if (tag === "blockquote") {
+      const inner = Array.from(el.children).map((c) => handle(c) || inlineHtmlToMd(c)).filter(Boolean).join("\n");
+      return inner.split("\n").map((line) => "> " + line).join("\n");
+    }
+    if (tag === "br") return "";
+    return inlineHtmlToMd(el);
+  };
+  for (const child of Array.from(div.childNodes)) {
+    if (child.nodeType === Node.TEXT_NODE) {
+      const t = (child.textContent || "").trim();
+      if (t) blocks.push(t);
+      continue;
+    }
+    if (child.nodeType !== Node.ELEMENT_NODE) continue;
+    const text = handle(child);
+    if (text && text.trim()) blocks.push(text);
+  }
+  return blocks.join("\n\n").trim();
+}
+
+// src/components/MarkdownEditor.tsx
+var import_jsx_runtime17 = require("react/jsx-runtime");
+function ToolbarBtn({ icon: IconC, title, onClick }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    "button",
+    {
+      type: "button",
+      onMouseDown: (e) => e.preventDefault(),
+      onClick,
+      title,
+      className: "w-7 h-7 inline-flex items-center justify-center rounded hover:bg-neutral-100 text-neutral-500 hover:text-neutral-900 transition-colors",
+      children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(IconC, { className: "w-4 h-4", strokeWidth: 1.5 })
+    }
+  );
+}
+function MarkdownEditor({ value, onCommit, onCancel, placeholder, saving }) {
+  const editorRef = (0, import_react15.useRef)(null);
+  (0, import_react15.useEffect)(() => {
+    if (editorRef.current) {
+      editorRef.current.innerHTML = mdToHtml(value);
+      editorRef.current.focus();
+      const range = document.createRange();
+      range.selectNodeContents(editorRef.current);
+      range.collapse(false);
+      const sel = window.getSelection();
+      sel?.removeAllRanges();
+      sel?.addRange(range);
+    }
+  }, []);
+  const focusEditor = () => editorRef.current?.focus();
+  const exec = (command, arg) => {
+    focusEditor();
+    document.execCommand(command, false, arg);
+  };
+  const wrapSelectionInCode = () => {
+    focusEditor();
+    const sel = window.getSelection();
+    if (!sel || sel.rangeCount === 0) return;
+    const range = sel.getRangeAt(0);
+    if (range.collapsed) return;
+    const codeEl = document.createElement("code");
+    try {
+      codeEl.textContent = range.toString();
+      range.deleteContents();
+      range.insertNode(codeEl);
+      range.setStartAfter(codeEl);
+      range.collapse(true);
+      sel.removeAllRanges();
+      sel.addRange(range);
+    } catch {
+    }
+  };
+  const commit = () => {
+    if (!editorRef.current) return;
+    onCommit(htmlToMd(editorRef.current.innerHTML));
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center gap-0.5 bg-neutral-50/60 border border-neutral-200 rounded-md p-0.5 mb-2 w-fit", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ToolbarBtn, { icon: Heading2, title: "Heading", onClick: () => exec("formatBlock", "h2") }),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ToolbarBtn, { icon: Bold, title: "Bold", onClick: () => exec("bold") }),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ToolbarBtn, { icon: Italic, title: "Italic", onClick: () => exec("italic") }),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "w-px h-5 bg-neutral-200 mx-0.5" }),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ToolbarBtn, { icon: List, title: "Bullet list", onClick: () => exec("insertUnorderedList") }),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ToolbarBtn, { icon: ListOrdered, title: "Numbered list", onClick: () => exec("insertOrderedList") }),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "w-px h-5 bg-neutral-200 mx-0.5" }),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ToolbarBtn, { icon: Quote, title: "Quote", onClick: () => exec("formatBlock", "blockquote") }),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ToolbarBtn, { icon: Code, title: "Inline code", onClick: wrapSelectionInCode })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+      "div",
+      {
+        ref: editorRef,
+        contentEditable: true,
+        suppressContentEditableWarning: true,
+        "data-placeholder": placeholder,
+        onBlur: commit,
+        onKeyDown: (e) => {
+          if (e.key === "Escape") {
+            e.preventDefault();
+            onCancel();
+          }
+        },
+        className: "eb-tb-markdown-editor w-full px-3.5 py-2.5 bg-white border border-neutral-200 rounded-lg text-[13px] leading-relaxed text-neutral-800 focus:outline-none focus:ring-2 focus:ring-[#FF5E00]/10 focus:border-[#FF5E00]/50 transition-all min-h-[80px]"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("p", { className: "mt-1.5 text-[11px] text-neutral-400", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("kbd", { className: "px-1 py-0.5 rounded bg-neutral-100 border border-neutral-200 text-[10px]", children: "Esc" }),
+      " ",
+      "to cancel \xB7 click outside to save",
+      saving && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "ml-2", children: "\xB7 Saving..." })
+    ] })
+  ] });
+}
+
+// src/components/DescriptionSection.tsx
+var import_jsx_runtime18 = require("react/jsx-runtime");
+function DescriptionSection({
+  sectionKey,
+  label,
+  placeholder,
+  value,
+  onChange,
+  status,
+  onStatusChange,
+  saving
+}) {
+  const [editing, setEditing] = (0, import_react16.useState)(false);
+  const [openHelp, setOpenHelp] = (0, import_react16.useState)(null);
+  const startEdit = () => setEditing(true);
+  const cancel = () => setEditing(false);
+  const handleCommit = (md) => {
+    if (md !== value) onChange(md);
+    setEditing(false);
+  };
+  const hasContent = value.trim().length > 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("section", { className: "group", "data-section": sectionKey, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex items-center justify-between gap-3 mb-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("h2", { className: "text-[15px] font-semibold text-neutral-900 tracking-tight", children: label }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+        "div",
+        {
+          className: "flex rounded-2xl border border-neutral-200/60 bg-neutral-100/80 p-0.5 items-center h-7 shrink-0",
+          role: "group",
+          "aria-label": `${label} status`,
+          children: ["draft", "approved"].map((s) => {
+            const active = status === s;
+            const labelText = s === "draft" ? "Draft" : "Approved";
+            const help = s === "draft" ? "Draft \u2014 content is being written and is not yet ready for review." : "Approved \u2014 content has been reviewed and signed off (e.g. by the client).";
+            return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+              "button",
+              {
+                type: "button",
+                onClick: () => onStatusChange(s),
+                "aria-pressed": active,
+                className: `inline-flex items-center justify-center gap-1.5 rounded-xl px-3 h-6 text-[12px] font-medium transition-all ${active ? "bg-[#FF5E00] text-white shadow-sm" : "text-neutral-500 hover:text-neutral-900"}`,
+                children: [
+                  labelText,
+                  /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+                    "span",
+                    {
+                      className: "relative inline-flex items-center",
+                      onMouseEnter: () => setOpenHelp(s),
+                      onMouseLeave: () => setOpenHelp(null),
+                      onClick: (e) => e.stopPropagation(),
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(HelpCircleIcon, { className: "w-3 h-3 opacity-70", strokeWidth: 1.5 }),
+                        openHelp === s && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "absolute right-0 top-full mt-2 z-50 pointer-events-none", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "block bg-white border border-neutral-200 shadow-lg rounded-xl px-3.5 py-2.5 text-[12px] font-medium text-neutral-700 whitespace-normal w-60 text-left", children: help }) })
+                      ]
+                    }
+                  )
+                ]
+              },
+              s
+            );
+          })
+        }
+      )
+    ] }),
+    editing ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+      MarkdownEditor,
+      {
+        value,
+        onCommit: handleCommit,
+        onCancel: cancel,
+        placeholder,
+        saving
+      }
+    ) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+      "button",
+      {
+        type: "button",
+        onClick: startEdit,
+        className: "w-full text-left rounded-lg border border-transparent hover:border-neutral-200 hover:bg-neutral-50/60 transition-colors px-3.5 py-2.5 -mx-3.5 -my-2.5 cursor-text",
+        children: hasContent ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(MarkdownView, { content: value, className: "text-[13px]" }) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "text-[13px] text-neutral-400 italic", children: placeholder })
+      }
+    )
+  ] });
+}
+
+// src/components/OutstandingQuestionsSection.tsx
+var import_react17 = require("react");
+var import_jsx_runtime19 = require("react/jsx-runtime");
+function timeAgo2(dateStr) {
+  const d = parseDate(dateStr);
+  const diff = Date.now() - d.getTime();
+  const minutes = Math.floor(diff / 6e4);
+  if (minutes < 1) return "just now";
+  if (minutes < 60) return `${minutes}m ago`;
+  const hours = Math.floor(minutes / 60);
+  if (hours < 24) return `${hours}h ago`;
+  const days = Math.floor(hours / 24);
+  if (days < 30) return `${days}d ago`;
+  return formatDate(dateStr);
+}
+function OutstandingQuestionsSection({
+  questions,
+  currentUsername,
+  onCreate,
+  onSetStatus,
+  onDelete,
+  onAddReply
+}) {
+  const [filter, setFilter] = (0, import_react17.useState)("awaiting");
+  const [filterMenuOpen, setFilterMenuOpen] = (0, import_react17.useState)(false);
+  const [adding, setAdding] = (0, import_react17.useState)(false);
+  const [newText, setNewText] = (0, import_react17.useState)("");
+  const [posting, setPosting] = (0, import_react17.useState)(false);
+  const filterRef = (0, import_react17.useRef)(null);
+  const newRef = (0, import_react17.useRef)(null);
+  (0, import_react17.useEffect)(() => {
+    if (!filterMenuOpen) return;
+    const onClick = (e) => {
+      if (filterRef.current && !filterRef.current.contains(e.target)) {
+        setFilterMenuOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", onClick);
+    return () => document.removeEventListener("mousedown", onClick);
+  }, [filterMenuOpen]);
+  const counts = {
+    awaiting: questions.filter((q) => q.status === "awaiting").length,
+    answered: questions.filter((q) => q.status === "answered").length
+  };
+  const filtered = questions.filter((q) => q.status === filter);
+  const submitNew = async () => {
+    if (!newText.trim()) return;
+    setPosting(true);
+    try {
+      await onCreate(newText.trim());
+      setNewText("");
+      setAdding(false);
+    } catch {
+    } finally {
+      setPosting(false);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("section", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-3 mb-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("h2", { className: "text-[15px] font-semibold text-neutral-900 tracking-tight", children: "Outstanding Questions" }),
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        "span",
+        {
+          className: `inline-flex items-center justify-center min-w-[18px] h-4 px-1 rounded text-[10px] font-semibold ${filter === "awaiting" ? "bg-amber-50 text-amber-700" : "bg-emerald-50 text-emerald-700"}`,
+          children: filtered.length
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "relative ml-2", ref: filterRef, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+          "button",
+          {
+            type: "button",
+            onClick: () => setFilterMenuOpen(!filterMenuOpen),
+            className: "inline-flex items-center gap-1.5 text-[12px] font-medium text-neutral-700 hover:text-neutral-900",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { children: filter === "awaiting" ? "Awaiting answer" : "Answered" }),
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ChevronDownIcon, { className: "w-3 h-3 text-neutral-400", strokeWidth: 1.5 })
+            ]
+          }
+        ),
+        filterMenuOpen && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "absolute left-0 top-full mt-1 bg-white border border-neutral-200 rounded-xl shadow-lg py-1 z-30 min-w-[200px]", children: ["awaiting", "answered"].map((f) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+          "button",
+          {
+            onClick: () => {
+              setFilter(f);
+              setFilterMenuOpen(false);
+            },
+            className: "w-full text-left px-3 py-2 text-[12px] text-neutral-700 hover:bg-neutral-50 flex items-center justify-between gap-3",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("span", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                  CheckIcon,
+                  {
+                    size: 12,
+                    strokeWidth: 2.5,
+                    className: `text-[#FF5E00] ${filter === f ? "" : "invisible"}`
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { children: f === "awaiting" ? "Awaiting answer" : "Answered" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-[10px] text-neutral-400", children: counts[f] })
+            ]
+          },
+          f
+        )) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+        "button",
+        {
+          type: "button",
+          onClick: () => {
+            setAdding(true);
+            setTimeout(() => newRef.current?.focus(), 0);
+          },
+          className: "ml-auto inline-flex items-center gap-1 text-[12px] font-medium text-[#FF5E00] hover:text-[#E05200]",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(PlusIcon, { size: 12, strokeWidth: 2 }),
+            "Add question"
+          ]
+        }
+      )
+    ] }),
+    adding && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "mb-4 rounded-lg border border-neutral-200 bg-white p-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        "textarea",
+        {
+          ref: newRef,
+          value: newText,
+          onChange: (e) => setNewText(e.target.value),
+          onKeyDown: (e) => {
+            if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) {
+              e.preventDefault();
+              submitNew();
+            }
+            if (e.key === "Escape") {
+              setAdding(false);
+              setNewText("");
+            }
+          },
+          placeholder: "What's the question?",
+          rows: 2,
+          className: "w-full px-2 py-1.5 text-[13px] text-neutral-800 placeholder:text-neutral-400 focus:outline-none resize-y"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center justify-end gap-2 mt-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+          "button",
+          {
+            onClick: () => {
+              setAdding(false);
+              setNewText("");
+            },
+            className: "text-[12px] font-medium text-neutral-500 hover:text-neutral-900 px-2 h-7 rounded hover:bg-neutral-50",
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+          "button",
+          {
+            onClick: submitNew,
+            disabled: !newText.trim() || posting,
+            className: "inline-flex items-center justify-center px-3 h-7 rounded-lg text-[12px] font-medium text-white bg-[#FF5E00] hover:bg-[#E05200] disabled:opacity-50",
+            children: posting ? "Adding..." : "Add"
+          }
+        )
+      ] })
+    ] }),
+    filtered.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "rounded-lg border border-dashed border-neutral-200 px-4 py-6 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "text-[12px] text-neutral-400", children: filter === "awaiting" ? "No outstanding questions." : "No answered questions yet." }) }) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("ul", { className: "flex flex-col gap-1", children: filtered.map((q) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+      QuestionItem,
+      {
+        question: q,
+        currentUsername,
+        onSetStatus,
+        onDelete,
+        onAddReply
+      },
+      q.id
+    )) })
+  ] });
+}
+function QuestionItem({
+  question,
+  currentUsername,
+  onSetStatus,
+  onDelete,
+  onAddReply
+}) {
+  const [expanded, setExpanded] = (0, import_react17.useState)(false);
+  const [reply, setReply] = (0, import_react17.useState)("");
+  const [posting, setPosting] = (0, import_react17.useState)(false);
+  const isAnswered = question.status === "answered";
+  const dotColor = isAnswered ? "bg-emerald-500" : "bg-amber-500";
+  const pillTextColor = isAnswered ? "text-emerald-700" : "text-amber-700";
+  const borderColor = isAnswered ? "border-emerald-200" : "border-neutral-200";
+  const submitReply = async () => {
+    if (!reply.trim()) return;
+    setPosting(true);
+    try {
+      await onAddReply(question.id, reply.trim());
+      setReply("");
+    } finally {
+      setPosting(false);
+    }
+  };
+  const toggleStatus = async () => {
+    await onSetStatus(question.id, isAnswered ? "awaiting" : "answered");
+  };
+  const handleDelete = async () => {
+    if (!confirm("Delete this question and its replies?")) return;
+    await onDelete(question.id);
+  };
+  const canDelete = question.asked_by === currentUsername;
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("li", { className: "group rounded-lg hover:bg-neutral-50/60 transition-colors", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+      "button",
+      {
+        type: "button",
+        onClick: () => setExpanded(!expanded),
+        className: "w-full flex items-start gap-3 p-3 text-left",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: `mt-1.5 w-1.5 h-1.5 rounded-full shrink-0 ${dotColor}` }),
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "text-[13px] text-neutral-800 leading-snug", children: question.text }),
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "mt-1 flex items-center gap-2 text-[12px] text-neutral-500 flex-wrap", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("span", { children: [
+                "Asked by",
+                " ",
+                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "font-medium text-neutral-700", children: question.asked_by_name || question.asked_by })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-neutral-300", children: "\xB7" }),
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("span", { children: [
+                question.replies.length,
+                " repl",
+                question.replies.length === 1 ? "y" : "ies"
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-neutral-300", children: "\xB7" }),
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("span", { className: `inline-flex items-center gap-1 ${pillTextColor}`, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: `w-1.5 h-1.5 rounded-full ${dotColor}` }),
+                isAnswered ? "Answered" : "Awaiting answer"
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+            ChevronDownIcon,
+            {
+              className: `w-4 h-4 text-neutral-400 mt-1 shrink-0 transition-transform ${expanded ? "rotate-180" : ""}`,
+              strokeWidth: 1.5
+            }
+          )
+        ]
+      }
+    ),
+    expanded && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "pl-7 pr-3 pb-3", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: `border-l-2 ${borderColor} pl-4 flex flex-col gap-3`, children: [
+      question.replies.map((r) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex gap-2.5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "w-6 h-6 rounded-full bg-[#FF5E00] text-white flex items-center justify-center text-[10px] font-semibold shrink-0", children: getInitials(r.author_name || "?") }),
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-2 mb-0.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-[12px] font-medium text-neutral-900", children: r.author_name }),
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-[10px] text-neutral-400", children: timeAgo2(r.created_at) })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "text-[12px] text-neutral-700 leading-relaxed whitespace-pre-wrap", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(MentionText, { text: r.content }) })
+        ] })
+      ] }, r.id)),
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex gap-2.5 pt-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "w-6 h-6 rounded-full bg-neutral-100 text-neutral-700 flex items-center justify-center text-[10px] font-semibold shrink-0", children: getInitials(currentUsername || "?") }),
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex-1 min-w-0 flex flex-col gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+            MentionTextarea,
+            {
+              value: reply,
+              onChange: setReply,
+              rows: 2,
+              placeholder: "Reply\u2026 (type @ to mention)",
+              className: "w-full rounded-md border border-neutral-200 px-3 py-1.5 text-[12px] min-h-[60px] focus:outline-none focus:ring-1 focus:ring-neutral-300 resize-none"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center justify-end gap-2", children: [
+            canDelete && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+              "button",
+              {
+                type: "button",
+                onClick: handleDelete,
+                className: "inline-flex items-center gap-1.5 text-[12px] font-medium text-neutral-500 hover:text-red-600 px-2 h-7 rounded hover:bg-red-50",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(TrashIcon, { size: 12, strokeWidth: 1.5 }),
+                  "Delete question"
+                ]
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+              "button",
+              {
+                type: "button",
+                onClick: toggleStatus,
+                className: "inline-flex items-center gap-1.5 text-[12px] font-medium text-neutral-600 hover:text-neutral-900 px-2 h-7 rounded hover:bg-neutral-100",
+                children: isAnswered ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(RotateCcwIcon, { size: 12, strokeWidth: 1.5 }),
+                  "Reopen"
+                ] }) : /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(CheckCircle2Icon, { size: 12, strokeWidth: 1.5 }),
+                  "Mark answered"
+                ] })
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+              "button",
+              {
+                type: "button",
+                onClick: submitReply,
+                disabled: !reply.trim() || posting,
+                className: "inline-flex items-center justify-center px-3 h-7 rounded-lg text-[12px] font-medium text-white bg-[#FF5E00] hover:bg-[#E05200] disabled:opacity-50",
+                children: posting ? "Posting..." : "Reply"
+              }
+            )
+          ] })
+        ] })
+      ] })
+    ] }) })
+  ] });
+}
+
+// src/components/AttachmentsSection.tsx
+var import_react18 = require("react");
+var import_jsx_runtime20 = require("react/jsx-runtime");
+function formatBytes(bytes) {
+  if (!bytes && bytes !== 0) return "";
+  if (bytes < 1024) return `${bytes} B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(0)} KB`;
+  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+}
+function attachmentMeta(a) {
+  if (a.kind === "link") {
+    try {
+      return new URL(a.url.startsWith("http") ? a.url : `https://${a.url}`).hostname;
+    } catch {
+      return "";
+    }
+  }
+  return formatBytes(a.size);
+}
+function AttachmentsSection({
+  attachments,
+  onUpload,
+  onAddLink,
+  onDelete
+}) {
+  const [menuOpen, setMenuOpen] = (0, import_react18.useState)(false);
+  const [linkModalOpen, setLinkModalOpen] = (0, import_react18.useState)(false);
+  const [linkUrl, setLinkUrl] = (0, import_react18.useState)("");
+  const [linkTitle, setLinkTitle] = (0, import_react18.useState)("");
+  const [busy, setBusy] = (0, import_react18.useState)(false);
+  const [error, setError] = (0, import_react18.useState)("");
+  const fileInputRef = (0, import_react18.useRef)(null);
+  const imageInputRef = (0, import_react18.useRef)(null);
+  const menuRef = (0, import_react18.useRef)(null);
+  (0, import_react18.useEffect)(() => {
+    if (!menuOpen) return;
+    const onClick = (e) => {
+      if (menuRef.current && !menuRef.current.contains(e.target)) {
+        setMenuOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", onClick);
+    return () => document.removeEventListener("mousedown", onClick);
+  }, [menuOpen]);
+  const showError = (msg) => {
+    setError(msg);
+    setTimeout(() => setError(""), 4e3);
+  };
+  const upload = async (file) => {
+    setBusy(true);
+    setError("");
+    try {
+      await onUpload(file);
+    } catch (err) {
+      const e = err;
+      showError(e.response?.data?.detail || "Upload failed");
+    } finally {
+      setBusy(false);
+    }
+  };
+  const submitLink = async () => {
+    if (!linkUrl.trim()) return;
+    setBusy(true);
+    setError("");
+    try {
+      await onAddLink(linkUrl.trim(), linkTitle.trim() || void 0);
+      setLinkUrl("");
+      setLinkTitle("");
+      setLinkModalOpen(false);
+    } catch (err) {
+      const e = err;
+      showError(e.response?.data?.detail || "Failed to add link");
+    } finally {
+      setBusy(false);
+    }
+  };
+  const remove = async (id) => {
+    try {
+      await onDelete(id);
+    } catch (err) {
+      const e = err;
+      showError(e.response?.data?.detail || "Failed to delete");
+    }
+  };
+  const images = attachments.filter((a) => a.kind === "image");
+  const files = attachments.filter((a) => a.kind === "file");
+  const links = attachments.filter((a) => a.kind === "link");
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("section", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-3 mb-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("h2", { className: "text-[15px] font-semibold text-neutral-900 tracking-tight", children: "Attachments" }),
+      busy && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "text-[11px] text-neutral-400", children: "Uploading..." }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "ml-auto relative", ref: menuRef, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+          "button",
+          {
+            type: "button",
+            onClick: () => setMenuOpen(!menuOpen),
+            disabled: busy,
+            className: "inline-flex items-center gap-1 text-[12px] font-medium text-[#FF5E00] hover:text-[#E05200] disabled:opacity-50",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(PlusIcon, { size: 12, strokeWidth: 2 }),
+              "Add attachment"
+            ]
+          }
+        ),
+        menuOpen && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "absolute right-0 top-full mt-1 w-44 bg-white border border-neutral-200 rounded-xl shadow-lg py-1 z-30", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+            "button",
+            {
+              onClick: () => {
+                setMenuOpen(false);
+                imageInputRef.current?.click();
+              },
+              className: "w-full text-left px-3 py-2 text-[12px] text-neutral-700 hover:bg-neutral-50 flex items-center gap-2.5",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ImageIcon, { size: 14, strokeWidth: 1.5, className: "text-neutral-400" }),
+                "Image"
+              ]
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+            "button",
+            {
+              onClick: () => {
+                setMenuOpen(false);
+                fileInputRef.current?.click();
+              },
+              className: "w-full text-left px-3 py-2 text-[12px] text-neutral-700 hover:bg-neutral-50 flex items-center gap-2.5",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(FileTextIcon, { size: 14, strokeWidth: 1.5, className: "text-neutral-400" }),
+                "File"
+              ]
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+            "button",
+            {
+              onClick: () => {
+                setMenuOpen(false);
+                setLinkModalOpen(true);
+              },
+              className: "w-full text-left px-3 py-2 text-[12px] text-neutral-700 hover:bg-neutral-50 flex items-center gap-2.5",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Link2Icon, { size: 14, strokeWidth: 1.5, className: "text-neutral-400" }),
+                "Link / Recording"
+              ]
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        "input",
+        {
+          ref: imageInputRef,
+          type: "file",
+          accept: "image/*",
+          className: "hidden",
+          onChange: (e) => {
+            const f = e.target.files?.[0];
+            if (f) upload(f);
+            e.target.value = "";
+          }
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        "input",
+        {
+          ref: fileInputRef,
+          type: "file",
+          className: "hidden",
+          onChange: (e) => {
+            const f = e.target.files?.[0];
+            if (f) upload(f);
+            e.target.value = "";
+          }
+        }
+      )
+    ] }),
+    error && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "mb-3 text-[12px] text-red-600 bg-red-50 border border-red-100 rounded-lg px-3 py-2", children: error }),
+    attachments.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "rounded-lg border border-dashed border-neutral-200 px-4 py-6 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-[12px] text-neutral-400", children: "No attachments yet." }) }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "space-y-5", children: [
+      images.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-[10px] font-semibold tracking-wider text-neutral-400 uppercase mb-2", children: "Images" }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "grid grid-cols-3 gap-2", children: images.map((img) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+          "a",
+          {
+            href: img.url || "#",
+            target: "_blank",
+            rel: "noopener noreferrer",
+            className: "group relative aspect-video overflow-hidden rounded-lg border border-neutral-200 hover:border-neutral-300 bg-neutral-50",
+            children: [
+              img.url ? (
+                // eslint-disable-next-line @next/next/no-img-element
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("img", { src: img.url, alt: img.name, className: "w-full h-full object-cover" })
+              ) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "w-full h-full flex items-center justify-center text-neutral-400", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ImageIcon, { size: 24, strokeWidth: 1.5 }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "absolute bottom-1 left-1 right-8 text-[10px] text-white px-1.5 py-0.5 rounded bg-black/60 truncate opacity-0 group-hover:opacity-100", children: img.name }),
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                "button",
+                {
+                  onClick: (e) => {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    remove(img.id);
+                  },
+                  className: "absolute top-1 right-1 w-6 h-6 rounded-full bg-black/60 text-white opacity-0 group-hover:opacity-100 flex items-center justify-center",
+                  title: "Remove",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(XIcon, { size: 12, strokeWidth: 2 })
+                }
+              )
+            ]
+          },
+          img.id
+        )) })
+      ] }),
+      files.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-[10px] font-semibold tracking-wider text-neutral-400 uppercase mb-2", children: "Files" }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex flex-col gap-1.5", children: files.map((f) => {
+          const meta = attachmentMeta(f);
+          return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+            "div",
+            {
+              className: "group flex items-center gap-3 p-2 rounded-lg border border-neutral-200 hover:bg-neutral-50",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "w-8 h-8 rounded bg-neutral-100 flex items-center justify-center text-neutral-500", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(FileTextIcon, { size: 16, strokeWidth: 1.5 }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex-1 min-w-0", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "text-[13px] font-medium text-neutral-900 truncate", children: f.name }),
+                  meta && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "text-[10px] text-neutral-500", children: meta })
+                ] }),
+                f.url && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                  "a",
+                  {
+                    href: f.url,
+                    target: "_blank",
+                    rel: "noopener noreferrer",
+                    className: "w-7 h-7 rounded hover:bg-neutral-100 text-neutral-500 hover:text-neutral-900 flex items-center justify-center",
+                    title: "Open",
+                    children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ExternalLinkIcon, { size: 14, strokeWidth: 1.5 })
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                  "button",
+                  {
+                    onClick: () => remove(f.id),
+                    className: "opacity-0 group-hover:opacity-100 w-7 h-7 rounded hover:bg-red-50 text-neutral-400 hover:text-red-500 flex items-center justify-center",
+                    title: "Remove",
+                    children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(XIcon, { size: 14, strokeWidth: 2 })
+                  }
+                )
+              ]
+            },
+            f.id
+          );
+        }) })
+      ] }),
+      links.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-[10px] font-semibold tracking-wider text-neutral-400 uppercase mb-2", children: "Links & recordings" }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex flex-col gap-1.5", children: links.map((l) => {
+          const meta = attachmentMeta(l);
+          return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+            "a",
+            {
+              href: l.url.startsWith("http") ? l.url : `https://${l.url}`,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              className: "group flex items-center gap-3 p-2 rounded-lg border border-neutral-200 hover:bg-neutral-50",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "w-8 h-8 rounded bg-neutral-100 flex items-center justify-center text-neutral-500", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Link2Icon, { size: 16, strokeWidth: 1.5 }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex-1 min-w-0", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "text-[13px] font-medium text-neutral-900 truncate", children: l.name }),
+                  meta && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "text-[10px] text-neutral-500", children: meta })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ExternalLinkIcon, { size: 14, strokeWidth: 1.5, className: "text-neutral-400 shrink-0" }),
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                  "button",
+                  {
+                    onClick: (e) => {
+                      e.preventDefault();
+                      e.stopPropagation();
+                      remove(l.id);
+                    },
+                    className: "opacity-0 group-hover:opacity-100 w-7 h-7 rounded hover:bg-red-50 text-neutral-400 hover:text-red-500 flex items-center justify-center",
+                    title: "Remove",
+                    children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(XIcon, { size: 14, strokeWidth: 2 })
+                  }
+                )
+              ]
+            },
+            l.id
+          );
+        }) })
+      ] })
+    ] }),
+    linkModalOpen && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      "div",
+      {
+        className: "fixed inset-0 z-[80] flex items-center justify-center bg-black/40 backdrop-blur-sm p-4",
+        onClick: () => setLinkModalOpen(false),
+        children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+          "div",
+          {
+            className: "bg-white rounded-2xl shadow-2xl w-full max-w-[460px] overflow-hidden",
+            onClick: (e) => e.stopPropagation(),
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center justify-between px-5 py-4 border-b border-neutral-100", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("h3", { className: "text-[15px] font-semibold text-neutral-900", children: "Add link or recording" }),
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                  "button",
+                  {
+                    onClick: () => setLinkModalOpen(false),
+                    className: "w-8 h-8 flex items-center justify-center rounded-lg hover:bg-neutral-100 text-neutral-500",
+                    children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(XIcon, { size: 16, strokeWidth: 1.5 })
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "p-5 flex flex-col gap-3", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex flex-col gap-1.5", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("label", { className: "text-[12px] font-medium text-neutral-600", children: "URL" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                    "input",
+                    {
+                      type: "url",
+                      value: linkUrl,
+                      onChange: (e) => setLinkUrl(e.target.value),
+                      placeholder: "https://loom.com/share/\u2026",
+                      autoFocus: true,
+                      className: "h-10 rounded-xl border border-neutral-200 px-3 text-[13px] text-neutral-900 placeholder:text-neutral-400 focus:outline-none focus:ring-1 focus:ring-neutral-300"
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex flex-col gap-1.5", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("label", { className: "text-[12px] font-medium text-neutral-600", children: [
+                    "Title ",
+                    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "text-neutral-400 font-normal", children: "(optional)" })
+                  ] }),
+                  /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                    "input",
+                    {
+                      type: "text",
+                      value: linkTitle,
+                      onChange: (e) => setLinkTitle(e.target.value),
+                      placeholder: "e.g. Walkthrough \u2014 parsing edge cases",
+                      className: "h-10 rounded-xl border border-neutral-200 px-3 text-[13px] text-neutral-900 placeholder:text-neutral-400 focus:outline-none focus:ring-1 focus:ring-neutral-300"
+                    }
+                  )
+                ] })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "px-5 py-4 border-t border-neutral-100 flex items-center justify-end gap-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                  "button",
+                  {
+                    onClick: () => setLinkModalOpen(false),
+                    className: "inline-flex items-center justify-center h-10 px-4 rounded-xl border border-neutral-200 bg-white text-neutral-700 text-[13px] font-medium hover:bg-neutral-50 transition-colors",
+                    children: "Cancel"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                  "button",
+                  {
+                    onClick: submitLink,
+                    disabled: !linkUrl.trim() || busy,
+                    className: "inline-flex items-center justify-center h-10 px-4 rounded-xl bg-[#FF5E00] text-white text-[13px] font-medium shadow-sm hover:bg-[#E05200] disabled:opacity-50 transition-colors",
+                    children: busy ? "Saving..." : "Save"
+                  }
+                )
+              ] })
+            ]
+          }
+        )
+      }
+    )
+  ] });
+}
+
+// src/components/ThreadsPanel.tsx
+var import_react21 = require("react");
+
+// src/components/ActivityList.tsx
+var import_jsx_runtime21 = require("react/jsx-runtime");
+function ActivityList({ activity }) {
+  const { columns } = useTaskBoardContext();
+  if (activity.length === 0) {
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex-1 overflow-y-auto p-4 flex flex-col items-center justify-center text-center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "w-10 h-10 rounded-full bg-neutral-100 flex items-center justify-center mb-3", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(HistoryIcon, { size: 18, strokeWidth: 1.5, className: "text-neutral-400" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-[12px] text-neutral-400", children: "No activity yet" }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-[10px] text-neutral-400 mt-0.5", children: "Status changes will appear here" })
+    ] });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex-1 overflow-y-auto p-4", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("ul", { className: "flex flex-col gap-4", children: activity.map((a) => {
+    const fromCol = columns.find((c) => c.key === a.from_status);
+    const toCol = columns.find((c) => c.key === a.to_status);
+    const isCreated = a.type === "created";
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("li", { className: "flex gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "w-7 h-7 rounded-full bg-neutral-100 text-neutral-500 flex items-center justify-center shrink-0", children: isCreated ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PlusIcon, { size: 14, strokeWidth: 1.5 }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ChevronRightIcon, { size: 14, strokeWidth: 1.5 }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex-1 min-w-0", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("p", { className: "text-[12px] text-neutral-700", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "font-medium text-neutral-900", children: a.user_name }),
+          " ",
+          isCreated ? "created this task" : /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
+            "moved from",
+            " ",
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+              "span",
+              {
+                className: `inline-flex items-center gap-1 px-1.5 py-0.5 rounded ${fromCol?.chip ?? "bg-neutral-100 text-neutral-700"}`,
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                    "span",
+                    {
+                      className: `w-1.5 h-1.5 rounded-full ${fromCol?.color ?? "bg-neutral-300"}`
+                    }
+                  ),
+                  fromCol?.label ?? a.from_status
+                ]
+              }
+            ),
+            " ",
+            "to",
+            " ",
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+              "span",
+              {
+                className: `inline-flex items-center gap-1 px-1.5 py-0.5 rounded ${toCol?.chip ?? "bg-neutral-100 text-neutral-700"}`,
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                    "span",
+                    {
+                      className: `w-1.5 h-1.5 rounded-full ${toCol?.color ?? "bg-neutral-300"}`
+                    }
+                  ),
+                  toCol?.label ?? a.to_status
+                ]
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-[10px] text-neutral-400 mt-0.5", children: formatDateTime(a.created_at) })
+      ] })
+    ] }, a.id);
+  }) }) });
+}
+
+// src/components/ContextPill.tsx
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var VARIANTS = {
+  amber: "bg-amber-50 text-amber-700 border-amber-200 hover:bg-amber-100",
+  purple: "bg-purple-50 text-purple-700 border-purple-200 hover:bg-purple-100",
+  blue: "bg-blue-50 text-blue-700 border-blue-200 hover:bg-blue-100",
+  emerald: "bg-emerald-50 text-emerald-700 border-emerald-200 hover:bg-emerald-100",
+  neutral: "bg-neutral-50 text-neutral-700 border-neutral-200 hover:bg-neutral-100"
+};
+function ContextPill({ variant, icon: IconC, label, onClick }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+    "span",
+    {
+      role: onClick ? "button" : void 0,
+      onClick,
+      className: `inline-flex items-center gap-1.5 px-2 py-0.5 rounded-full border text-[11px] font-medium max-w-full self-start shrink-0 transition-colors ${VARIANTS[variant]} ${onClick ? "cursor-pointer" : ""}`,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(IconC, { className: "w-3 h-3 shrink-0", strokeWidth: 1.5 }),
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "truncate", children: label })
+      ]
+    }
+  );
+}
+
+// src/components/ThreadCard.tsx
+var import_jsx_runtime23 = require("react/jsx-runtime");
+function ThreadCard({ thread, onOpen, onAnchorClick, shimmer }) {
+  const { internalLabel } = useTaskBoardContext();
+  const initials = getInitials(thread.author_name || "?");
+  const hasContext = !!thread.anchor || thread.attachments.length > 0;
+  const isComplete = thread.status === "complete";
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+    "div",
+    {
+      role: "button",
+      tabIndex: 0,
+      onClick: onOpen,
+      onKeyDown: (e) => {
+        if (e.key === "Enter" || e.key === " ") {
+          e.preventDefault();
+          onOpen();
+        }
+      },
+      className: `text-left w-full px-3 py-4 flex flex-col gap-1.5 hover:bg-neutral-50/60 transition-colors cursor-pointer focus:outline-none focus-visible:bg-neutral-50 ${isComplete ? "opacity-60" : ""}`,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center gap-2", children: [
+          shimmer ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "eb-tb-thread-title-skeleton h-4 w-48 rounded shrink-0", "aria-hidden": true }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            "h4",
+            {
+              className: `text-[13px] font-semibold leading-snug flex-1 min-w-0 truncate ${isComplete ? "text-neutral-400" : "text-neutral-900"}`,
+              children: thread.title
+            }
+          ),
+          isComplete && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "shrink-0 inline-flex items-center gap-1 text-[10px] font-medium text-emerald-700 bg-emerald-50 px-1.5 py-0.5 rounded", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CheckIcon, { size: 10, strokeWidth: 2.5 }),
+            " Complete"
+          ] })
+        ] }),
+        hasContext && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-wrap gap-1.5", children: [
+          thread.anchor && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            ContextPill,
+            {
+              variant: "amber",
+              icon: MessageSquareIcon,
+              label: `Highlight \xB7 ${sectionLabel(thread.anchor.section)}`,
+              onClick: (e) => {
+                e.stopPropagation();
+                if (thread.anchor) onAnchorClick(thread.anchor);
+              }
+            }
+          ),
+          thread.attachments.slice(0, 3).map((a) => {
+            const variant = a.kind === "image" ? "emerald" : a.kind === "link" ? "blue" : "neutral";
+            const IconC = a.kind === "image" ? ImageIcon : a.kind === "link" ? Link2Icon : FileTextIcon;
+            return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ContextPill, { variant, icon: IconC, label: a.name }, a.id);
+          }),
+          thread.attachments.length > 3 && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "text-[10px] text-neutral-400 self-center", children: [
+            "+",
+            thread.attachments.length - 3
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center gap-2 text-[10px] text-neutral-500", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            "div",
+            {
+              className: `w-5 h-5 rounded-full flex items-center justify-center text-[9px] font-semibold shrink-0 ${thread.is_internal ? "bg-neutral-200 text-neutral-700" : "bg-[#FF5E00] text-white"}`,
+              children: initials
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "font-medium text-neutral-700", children: thread.author_name }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-neutral-300", children: "\xB7" }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: timeAgo(thread.created_at) }),
+          thread.is_internal && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-neutral-300", children: "\xB7" }),
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "text-[10px] text-neutral-500 bg-neutral-100 px-1.5 py-0.5 rounded inline-flex items-center gap-1", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(LockIcon, { size: 10, strokeWidth: 1.5 }),
+              internalLabel
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          "div",
+          {
+            className: `text-[12px] leading-relaxed line-clamp-2 ${isComplete ? "text-neutral-400" : "text-neutral-700"}`,
+            children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(MentionText, { text: thread.preview })
+          }
+        ),
+        thread.replies.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center gap-2 mt-0.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "text-[12px] font-medium text-[#FF5E00]", children: [
+            thread.replies.length,
+            " repl",
+            thread.replies.length === 1 ? "y" : "ies"
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "text-[10px] text-neutral-400", children: [
+            "\xB7 last reply ",
+            timeAgo(thread.replies[thread.replies.length - 1].created_at)
+          ] })
+        ] }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "self-start inline-flex items-center gap-1.5 mt-0.5 text-[12px] font-medium text-[#FF5E00]", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CornerUpLeftIcon, { size: 12, strokeWidth: 1.5 }),
+          "Reply"
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/ThreadComposer.tsx
+var import_react19 = require("react");
+var import_jsx_runtime24 = require("react/jsx-runtime");
+function ThreadComposer({
+  attachments,
+  pendingAnchor,
+  onClearAnchor,
+  onSubmit,
+  onUpload,
+  onAddLink,
+  isInternalUser,
+  open,
+  onOpen,
+  onClose
+}) {
+  const { internalLabel } = useTaskBoardContext();
+  const [title, setTitle] = (0, import_react19.useState)("");
+  const [body, setBody] = (0, import_react19.useState)("");
+  const [internal, setInternal] = (0, import_react19.useState)(false);
+  const [attachmentIds, setAttachmentIds] = (0, import_react19.useState)([]);
+  const [posting, setPosting] = (0, import_react19.useState)(false);
+  const closeAndReset = () => {
+    setTitle("");
+    setBody("");
+    setInternal(false);
+    setAttachmentIds([]);
+    onClose();
+  };
+  const handleSubmit = async () => {
+    if (!body.trim()) return;
+    setPosting(true);
+    try {
+      await onSubmit({
+        title: title.trim(),
+        content: body.trim(),
+        isInternal: internal,
+        anchor: pendingAnchor,
+        attachmentIds
+      });
+      closeAndReset();
+    } finally {
+      setPosting(false);
+    }
+  };
+  if (!open) {
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "shrink-0 p-3 border-t border-neutral-100 bg-white", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+      "button",
+      {
+        onClick: onOpen,
+        className: "w-full inline-flex items-center justify-center gap-2 font-medium text-white bg-[#FF5E00] hover:bg-[#E05200] rounded-xl h-10 px-4 shadow-sm text-[12px]",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-white/20", children: "+" }),
+          "Start a thread"
+        ]
+      }
+    ) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "shrink-0 p-3 border-t border-neutral-100 bg-white", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-col gap-2", children: [
+    pendingAnchor && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-start gap-2 px-2 py-1.5 rounded-md bg-amber-50 border border-amber-200", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        MessageSquareIcon,
+        {
+          size: 14,
+          strokeWidth: 1.5,
+          className: "text-amber-600 shrink-0 mt-0.5"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex-1 min-w-0 text-[11px] text-amber-700", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "font-medium uppercase tracking-wider text-[9px]", children: [
+          sectionLabel(pendingAnchor.section),
+          " highlight"
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "truncate italic", children: [
+          "\u201C",
+          pendingAnchor.snippet,
+          "\u201D"
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        "button",
+        {
+          type: "button",
+          onClick: onClearAnchor,
+          className: "text-amber-600 hover:text-amber-900",
+          title: "Remove highlight",
+          children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(XIcon, { size: 12, strokeWidth: 2 })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      "input",
+      {
+        type: "text",
+        value: title,
+        onChange: (e) => setTitle(e.target.value),
+        placeholder: "Add a title (optional)",
+        className: "w-full rounded-lg border border-neutral-200 px-3 py-2 text-[13px] font-medium text-neutral-900 placeholder:font-normal placeholder:text-neutral-400 focus:outline-none focus:ring-1 focus:ring-neutral-300 focus:border-neutral-300"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      MentionTextarea,
+      {
+        value: body,
+        onChange: setBody,
+        rows: 4,
+        placeholder: "Write something\u2026 (type @ to mention)",
+        className: "w-full rounded-lg border border-neutral-200 px-3 py-2 text-[12px] text-neutral-800 min-h-[100px] focus:outline-none focus:ring-1 focus:ring-neutral-300 focus:border-neutral-300 resize-none"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      ComposerAttachments,
+      {
+        attachmentIds,
+        attachments,
+        onChange: setAttachmentIds,
+        onUpload,
+        onAddLink
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        "button",
+        {
+          onClick: closeAndReset,
+          className: "text-[12px] font-medium text-neutral-500 hover:text-neutral-900 px-2 h-7 rounded hover:bg-neutral-50",
+          children: "Cancel"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center gap-2", children: [
+        isInternalUser && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+          "button",
+          {
+            type: "button",
+            onClick: () => setInternal(!internal),
+            "aria-pressed": internal,
+            className: `inline-flex items-center gap-1.5 px-2 h-7 rounded text-[12px] font-medium transition-colors ${internal ? "bg-neutral-100 text-neutral-700" : "bg-white text-neutral-500 border border-neutral-200 hover:bg-neutral-50"}`,
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(LockIcon, { size: 14, strokeWidth: 1.5 }),
+              internal ? internalLabel : "Public"
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+          "button",
+          {
+            onClick: handleSubmit,
+            disabled: !body.trim() || posting,
+            className: "inline-flex items-center justify-center px-3 h-7 rounded-lg text-[12px] font-medium text-white bg-[#FF5E00] hover:bg-[#E05200] disabled:opacity-50",
+            children: posting ? "Posting..." : "Post"
+          }
+        )
+      ] })
+    ] })
+  ] }) });
+}
+function ComposerAttachments({
+  attachmentIds,
+  attachments,
+  onChange,
+  onUpload,
+  onAddLink
+}) {
+  const [busy, setBusy] = (0, import_react19.useState)(false);
+  const [linkOpen, setLinkOpen] = (0, import_react19.useState)(false);
+  const [linkUrl, setLinkUrl] = (0, import_react19.useState)("");
+  const [linkName, setLinkName] = (0, import_react19.useState)("");
+  const imageRef = (0, import_react19.useRef)(null);
+  const fileRef = (0, import_react19.useRef)(null);
+  const selected = attachmentIds.map((id) => attachments.find((a) => a.id === id)).filter((a) => Boolean(a));
+  const upload = async (file) => {
+    setBusy(true);
+    try {
+      const created = await onUpload(file);
+      onChange([...attachmentIds, created.id]);
+    } finally {
+      setBusy(false);
+    }
+  };
+  const submitLink = async () => {
+    if (!linkUrl.trim()) return;
+    setBusy(true);
+    try {
+      const created = await onAddLink(linkUrl.trim(), linkName.trim() || void 0);
+      onChange([...attachmentIds, created.id]);
+      setLinkUrl("");
+      setLinkName("");
+      setLinkOpen(false);
+    } finally {
+      setBusy(false);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+    selected.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex flex-wrap gap-1.5", children: selected.map((a) => {
+      const IconC = a.kind === "image" ? ImageIcon : a.kind === "link" ? Link2Icon : FileTextIcon;
+      return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+        "span",
+        {
+          className: "inline-flex items-center gap-1.5 text-[11px] text-neutral-700 bg-neutral-100 border border-neutral-200 rounded-md px-2 py-1 max-w-full",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(IconC, { size: 12, strokeWidth: 1.5 }),
+            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "truncate max-w-[180px]", children: a.name }),
+            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+              "button",
+              {
+                type: "button",
+                onClick: () => onChange(attachmentIds.filter((id) => id !== a.id)),
+                className: "text-neutral-400 hover:text-neutral-700",
+                children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(XIcon, { size: 12, strokeWidth: 2 })
+              }
+            )
+          ]
+        },
+        a.id
+      );
+    }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center gap-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        "button",
+        {
+          type: "button",
+          disabled: busy,
+          onClick: () => imageRef.current?.click(),
+          className: "w-7 h-7 rounded hover:bg-neutral-100 text-neutral-500 hover:text-neutral-900 flex items-center justify-center disabled:opacity-50",
+          "aria-label": "Attach image",
+          title: "Attach image",
+          children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ImageIcon, { size: 14, strokeWidth: 1.5 })
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        "button",
+        {
+          type: "button",
+          disabled: busy,
+          onClick: () => fileRef.current?.click(),
+          className: "w-7 h-7 rounded hover:bg-neutral-100 text-neutral-500 hover:text-neutral-900 flex items-center justify-center disabled:opacity-50",
+          "aria-label": "Attach file",
+          title: "Attach file",
+          children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(FileTextIcon, { size: 14, strokeWidth: 1.5 })
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        "button",
+        {
+          type: "button",
+          disabled: busy,
+          onClick: () => setLinkOpen((v) => !v),
+          className: "w-7 h-7 rounded hover:bg-neutral-100 text-neutral-500 hover:text-neutral-900 flex items-center justify-center disabled:opacity-50",
+          "aria-label": "Attach link",
+          title: "Attach link",
+          children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Link2Icon, { size: 14, strokeWidth: 1.5 })
+        }
+      ),
+      busy && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-[10px] text-neutral-400 ml-1", children: "Uploading\u2026" })
+    ] }),
+    linkOpen && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "rounded-md border border-neutral-200 p-2 flex flex-col gap-1.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        "input",
+        {
+          type: "url",
+          value: linkUrl,
+          onChange: (e) => setLinkUrl(e.target.value),
+          placeholder: "https://\u2026",
+          className: "text-[12px] px-2 py-1 border border-neutral-200 rounded focus:outline-none focus:ring-1 focus:ring-neutral-300"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        "input",
+        {
+          type: "text",
+          value: linkName,
+          onChange: (e) => setLinkName(e.target.value),
+          placeholder: "Title (optional)",
+          className: "text-[12px] px-2 py-1 border border-neutral-200 rounded focus:outline-none focus:ring-1 focus:ring-neutral-300"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex justify-end gap-1.5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              setLinkOpen(false);
+              setLinkUrl("");
+              setLinkName("");
+            },
+            className: "text-[11px] text-neutral-500 hover:text-neutral-900 px-2 h-6 rounded hover:bg-neutral-50",
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: submitLink,
+            disabled: !linkUrl.trim() || busy,
+            className: "text-[11px] font-medium text-white bg-[#FF5E00] hover:bg-[#E05200] disabled:opacity-50 px-2 h-6 rounded",
+            children: "Add"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      "input",
+      {
+        ref: imageRef,
+        type: "file",
+        accept: "image/*",
+        className: "hidden",
+        onChange: (e) => {
+          const f = e.target.files?.[0];
+          if (f) upload(f);
+          e.target.value = "";
+        }
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      "input",
+      {
+        ref: fileRef,
+        type: "file",
+        className: "hidden",
+        onChange: (e) => {
+          const f = e.target.files?.[0];
+          if (f) upload(f);
+          e.target.value = "";
+        }
+      }
+    )
+  ] });
+}
+
+// src/components/ThreadDetailView.tsx
+var import_react20 = require("react");
+var import_jsx_runtime25 = require("react/jsx-runtime");
+function ThreadDetailView({
+  thread,
+  onBack,
+  onReply,
+  onUpdateThread,
+  onAnchorClick,
+  isInternalUser
+}) {
+  const { internalLabel } = useTaskBoardContext();
+  const [body, setBody] = (0, import_react20.useState)("");
+  const [internal, setInternal] = (0, import_react20.useState)(false);
+  const [posting, setPosting] = (0, import_react20.useState)(false);
+  const [editingTitle, setEditingTitle] = (0, import_react20.useState)(false);
+  const [titleDraft, setTitleDraft] = (0, import_react20.useState)(thread.title);
+  const messagesEndRef = (0, import_react20.useRef)(null);
+  (0, import_react20.useEffect)(() => {
+    setTitleDraft(thread.title);
+  }, [thread.title]);
+  const submit = async () => {
+    if (!body.trim()) return;
+    setPosting(true);
+    try {
+      await onReply(body.trim(), internal);
+      setBody("");
+      setInternal(false);
+      setTimeout(() => {
+        messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
+      }, 100);
+    } finally {
+      setPosting(false);
+    }
+  };
+  const commitTitle = async () => {
+    setEditingTitle(false);
+    const next = titleDraft.trim();
+    if (next && next !== thread.title) {
+      await onUpdateThread({ title: next });
+    } else {
+      setTitleDraft(thread.title);
+    }
+  };
+  const toggleStatus = async () => {
+    const next = thread.status === "complete" ? "active" : "complete";
+    await onUpdateThread({ thread_status: next });
+  };
+  const isComplete = thread.status === "complete";
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "shrink-0 bg-white px-4 py-3 border-b border-neutral-100", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex items-start justify-between gap-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+          "button",
+          {
+            onClick: onBack,
+            className: "inline-flex items-center gap-2 px-2.5 py-1.5 -ml-2 rounded-lg text-[12px] font-medium text-neutral-500 hover:text-neutral-900 hover:bg-neutral-50",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ArrowLeftIcon, { size: 14, strokeWidth: 1.5 }),
+              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { children: "All threads" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: toggleStatus,
+            className: "inline-flex items-center justify-center gap-1.5 text-[12px] font-medium text-neutral-600 hover:text-neutral-900 px-3 h-8 rounded-xl border border-neutral-200 bg-white hover:bg-neutral-50",
+            children: isComplete ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(RotateCcwIcon, { size: 12, strokeWidth: 1.5 }),
+              "Reopen"
+            ] }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CheckCircle2Icon, { size: 12, strokeWidth: 1.5 }),
+              "Mark complete"
+            ] })
+          }
+        )
+      ] }),
+      editingTitle ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        "input",
+        {
+          value: titleDraft,
+          onChange: (e) => setTitleDraft(e.target.value),
+          onBlur: commitTitle,
+          onKeyDown: (e) => {
+            if (e.key === "Enter") {
+              e.preventDefault();
+              e.target.blur();
+            }
+            if (e.key === "Escape") {
+              e.preventDefault();
+              setTitleDraft(thread.title);
+              setEditingTitle(false);
+            }
+          },
+          autoFocus: true,
+          className: "mt-2 w-full text-[15px] font-semibold text-neutral-900 leading-snug bg-transparent border-b border-[#FF5E00] focus:outline-none -mx-1 px-1"
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        "h3",
+        {
+          onClick: () => setEditingTitle(true),
+          className: "mt-2 text-[15px] font-semibold text-neutral-900 leading-snug cursor-text rounded -mx-1 px-1 hover:bg-neutral-50/60",
+          title: "Click to edit",
+          children: thread.title
+        }
+      ),
+      thread.anchor && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "mt-2", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        ContextPill,
+        {
+          variant: "amber",
+          icon: MessageSquareIcon,
+          label: `Highlight \xB7 ${sectionLabel(thread.anchor.section)}`,
+          onClick: () => thread.anchor && onAnchorClick(thread.anchor)
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex-1 overflow-y-auto p-3 flex flex-col gap-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        ThreadMessage,
+        {
+          authorName: thread.author_name,
+          createdAt: thread.created_at,
+          content: thread.rawContent,
+          isInternal: thread.is_internal,
+          internalLabel
+        }
+      ),
+      thread.replies.map((r) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        ThreadMessage,
+        {
+          authorName: r.author_name,
+          createdAt: r.created_at,
+          content: r.content,
+          isInternal: r.is_internal,
+          internalLabel
+        },
+        r.id
+      )),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { ref: messagesEndRef })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "shrink-0 p-3 border-t border-neutral-100 bg-white", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        MentionTextarea,
+        {
+          value: body,
+          onChange: setBody,
+          rows: 3,
+          placeholder: "Reply\u2026 (type @ to mention)",
+          className: "w-full rounded-lg border border-neutral-200 px-3 py-2 text-[12px] text-neutral-800 min-h-[80px] focus:outline-none focus:ring-1 focus:ring-neutral-300 focus:border-neutral-300 resize-none"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex items-center justify-end gap-2 mt-2", children: [
+        isInternalUser && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+          "button",
+          {
+            type: "button",
+            onClick: () => setInternal(!internal),
+            "aria-pressed": internal,
+            className: `inline-flex items-center gap-1.5 px-2 h-7 rounded text-[12px] font-medium transition-colors ${internal ? "bg-neutral-100 text-neutral-700" : "bg-white text-neutral-500 border border-neutral-200 hover:bg-neutral-50"}`,
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(LockIcon, { size: 14, strokeWidth: 1.5 }),
+              internal ? internalLabel : "Public"
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          "button",
+          {
+            onClick: submit,
+            disabled: !body.trim() || posting,
+            className: "inline-flex items-center justify-center px-3 h-7 rounded-lg text-[12px] font-medium text-white bg-[#FF5E00] hover:bg-[#E05200] disabled:opacity-50",
+            children: posting ? "Posting..." : "Reply"
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+function ThreadMessage({
+  authorName,
+  createdAt,
+  content,
+  isInternal,
+  internalLabel
+}) {
+  const initials = getInitials(authorName || "?");
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex gap-2.5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+      "div",
+      {
+        className: `w-7 h-7 rounded-full flex items-center justify-center text-[10px] font-semibold shrink-0 ${isInternal ? "bg-neutral-200 text-neutral-700" : "bg-[#FF5E00] text-white"}`,
+        children: initials
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex-1 min-w-0", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex items-center gap-2 mb-0.5 flex-wrap", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-[13px] font-medium text-neutral-900", children: authorName }),
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-[10px] text-neutral-400", children: timeAgo(createdAt) }),
+        isInternal && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { className: "text-[10px] text-neutral-500 bg-neutral-100 px-1.5 py-0.5 rounded inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(LockIcon, { size: 10, strokeWidth: 1.5 }),
+          internalLabel
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "text-[12px] text-neutral-700 leading-relaxed whitespace-pre-wrap", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(MentionText, { text: content }) })
+    ] })
+  ] });
+}
+
+// src/components/ThreadsPanel.tsx
+var import_jsx_runtime26 = require("react/jsx-runtime");
+function ThreadsPanel({
+  threads,
+  activity,
+  attachments,
+  open,
+  onToggle,
+  openThreadId,
+  onOpenThread,
+  pendingAnchor,
+  onClearAnchor,
+  onAnchorClick,
+  shimmeringThreadIds,
+  isInternalUser,
+  onCreateThread,
+  onCreateReply,
+  onUpdateThread,
+  onUploadAttachment,
+  onAddLinkAttachment
+}) {
+  const [tab, setTab] = (0, import_react21.useState)("threads");
+  const [composerOpen, setComposerOpen] = (0, import_react21.useState)(false);
+  const [filter, setFilter] = (0, import_react21.useState)("active");
+  const [filterMenuOpen, setFilterMenuOpen] = (0, import_react21.useState)(false);
+  const filterRef = (0, import_react21.useRef)(null);
+  (0, import_react21.useEffect)(() => {
+    if (pendingAnchor) {
+      setComposerOpen(true);
+      setTab("threads");
+      onOpenThread(null);
+    }
+  }, [pendingAnchor, onOpenThread]);
+  (0, import_react21.useEffect)(() => {
+    if (!filterMenuOpen) return;
+    const onClick = (e) => {
+      if (filterRef.current && !filterRef.current.contains(e.target)) {
+        setFilterMenuOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", onClick);
+    return () => document.removeEventListener("mousedown", onClick);
+  }, [filterMenuOpen]);
+  const filteredThreads = threads.filter((t) => t.status === filter);
+  const openThread = openThreadId ? threads.find((t) => t.id === openThreadId) : null;
+  (0, import_react21.useEffect)(() => {
+    if (openThreadId && !threads.some((t) => t.id === openThreadId)) {
+      onOpenThread(null);
+    }
+  }, [threads, openThreadId, onOpenThread]);
+  if (!open) {
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("aside", { className: "hidden xl:flex flex-col fixed top-[56px] bottom-0 right-0 w-14 border-l border-neutral-200 bg-white z-30", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "shrink-0 flex bg-white h-12 border-b border-neutral-200 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+      "button",
+      {
+        type: "button",
+        onClick: onToggle,
+        "aria-label": "Open thread panel",
+        title: "Open thread panel",
+        className: "w-7 h-7 flex items-center justify-center rounded hover:bg-neutral-100 text-neutral-400 hover:text-neutral-600",
+        children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SidebarToggleIcon, { size: 18, strokeWidth: 1.5 })
+      }
+    ) }) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("aside", { className: "hidden xl:flex flex-col fixed top-[56px] bottom-0 right-0 w-[420px] border-l border-neutral-200 bg-white z-30", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "shrink-0 flex bg-white h-12 border-b border-neutral-200 px-5 items-center justify-between", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("span", { className: "text-[13px] font-medium text-neutral-500", children: [
+        tab === "threads" ? "Threads" : "Activity",
+        " ",
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "text-neutral-400 ml-0.5", children: tab === "threads" ? threads.length : activity.length })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex items-center gap-1", role: "tablist", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              setTab("threads");
+              onOpenThread(null);
+            },
+            "aria-pressed": tab === "threads",
+            className: `w-7 h-7 flex items-center justify-center rounded ${tab === "threads" ? "bg-neutral-100 text-neutral-700" : "text-neutral-400 hover:bg-neutral-100 hover:text-neutral-600"}`,
+            "aria-label": "Threads",
+            children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ChatDotsIcon, { size: 16, strokeWidth: 1.5 })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              setTab("activity");
+              onOpenThread(null);
+            },
+            "aria-pressed": tab === "activity",
+            className: `w-7 h-7 flex items-center justify-center rounded ${tab === "activity" ? "bg-neutral-100 text-neutral-700" : "text-neutral-400 hover:bg-neutral-100 hover:text-neutral-600"}`,
+            "aria-label": "Activity",
+            children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(HistoryIcon, { size: 16, strokeWidth: 1.5 })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "w-px h-4 bg-neutral-200 mx-1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: onToggle,
+            "aria-label": "Close thread panel",
+            title: "Close thread panel",
+            className: "w-7 h-7 flex items-center justify-center rounded text-neutral-400 hover:bg-neutral-100 hover:text-neutral-600",
+            children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SidebarToggleIcon, { size: 18, strokeWidth: 1.5 })
+          }
+        )
+      ] })
+    ] }),
+    tab === "threads" && !openThread && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "shrink-0 px-4 pt-3 pb-2 bg-white relative", ref: filterRef, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+          "button",
+          {
+            onClick: () => setFilterMenuOpen(!filterMenuOpen),
+            className: "inline-flex items-center gap-1.5 text-[12px] font-medium text-neutral-700 hover:text-neutral-900",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { children: filter === "active" ? "Active threads" : "Completed threads" }),
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "text-[10px] text-neutral-400", children: filteredThreads.length }),
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ChevronDownIcon, { size: 12, strokeWidth: 1.5, className: "text-neutral-400" })
+            ]
+          }
+        ),
+        filterMenuOpen && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "absolute left-4 top-full mt-0.5 bg-white border border-neutral-200 rounded-xl shadow-lg py-1 z-20 min-w-[200px]", children: ["active", "complete"].map((f) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+          "button",
+          {
+            onClick: () => {
+              setFilter(f);
+              setFilterMenuOpen(false);
+            },
+            className: "w-full text-left px-3 py-2 text-[12px] text-neutral-700 hover:bg-neutral-50 flex items-center justify-between gap-3",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("span", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+                  CheckIcon,
+                  {
+                    size: 12,
+                    strokeWidth: 2.5,
+                    className: `text-[#FF5E00] ${filter === f ? "" : "invisible"}`
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { children: f === "active" ? "Active threads" : "Completed threads" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "text-[10px] text-neutral-400", children: threads.filter((t) => t.status === f).length })
+            ]
+          },
+          f
+        )) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex-1 overflow-y-auto px-2 flex flex-col divide-y divide-neutral-100", children: [
+        filteredThreads.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex flex-col items-center justify-center py-16 text-center", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "w-10 h-10 rounded-full bg-neutral-100 flex items-center justify-center mb-3", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ChatDotsIcon, { size: 18, strokeWidth: 1.5, className: "text-neutral-400" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-[12px] text-neutral-400", children: "No threads yet" }),
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-[10px] text-neutral-400 mt-0.5", children: "Start a thread to discuss this task." })
+        ] }),
+        filteredThreads.map((t) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+          ThreadCard,
+          {
+            thread: t,
+            onOpen: () => onOpenThread(t.id),
+            onAnchorClick,
+            shimmer: shimmeringThreadIds.has(t.id)
+          },
+          t.id
+        ))
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+        ThreadComposer,
+        {
+          attachments,
+          pendingAnchor,
+          onClearAnchor,
+          onSubmit: onCreateThread,
+          onUpload: onUploadAttachment,
+          onAddLink: onAddLinkAttachment,
+          isInternalUser,
+          open: composerOpen,
+          onOpen: () => setComposerOpen(true),
+          onClose: () => {
+            setComposerOpen(false);
+            onClearAnchor();
+          }
+        }
+      )
+    ] }),
+    tab === "threads" && openThread && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+      ThreadDetailView,
+      {
+        thread: openThread,
+        onBack: () => onOpenThread(null),
+        onReply: (content, isInternal) => onCreateReply(openThread.id, content, isInternal),
+        onUpdateThread: (body) => onUpdateThread(openThread.id, body),
+        onAnchorClick,
+        isInternalUser
+      }
+    ),
+    tab === "activity" && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ActivityList, { activity })
+  ] });
+}
+
+// src/components/HighlightBubble.tsx
+var import_jsx_runtime27 = require("react/jsx-runtime");
+function HighlightBubble({ bubble, onComment }) {
+  if (!bubble) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    "div",
+    {
+      "data-annot-bubble": true,
+      style: {
+        position: "absolute",
+        left: bubble.x,
+        top: bubble.y,
+        transform: "translate(-50%, -100%)"
+      },
+      className: "z-[90] pointer-events-auto",
+      children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+        "button",
+        {
+          type: "button",
+          onMouseDown: (e) => e.preventDefault(),
+          onClick: onComment,
+          className: "inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg bg-neutral-900 text-white text-[12px] font-medium shadow-lg hover:bg-neutral-800",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(MessageSquareIcon, { size: 14, strokeWidth: 1.5 }),
+            "Comment"
+          ]
+        }
+      )
+    }
+  );
+}
+
+// src/hooks/useTaskQuestions.ts
+var import_react22 = require("react");
+function useTaskQuestions(taskId, initial) {
+  const { service } = useTaskBoardContext();
+  const [questions, setQuestions] = (0, import_react22.useState)(initial ?? []);
+  const [loading, setLoading] = (0, import_react22.useState)(false);
+  const refresh = (0, import_react22.useCallback)(async () => {
+    if (!taskId) return;
+    setLoading(true);
+    try {
+      const list = await service.listQuestions(taskId);
+      setQuestions(list);
+    } finally {
+      setLoading(false);
+    }
+  }, [service, taskId]);
+  (0, import_react22.useEffect)(() => {
+    if (initial !== void 0) return;
+    if (!taskId) return;
+    refresh();
+  }, [taskId]);
+  const createQuestion = (0, import_react22.useCallback)(
+    async (text) => {
+      if (!taskId) return;
+      await service.createQuestion(taskId, { text });
+      await refresh();
+    },
+    [service, taskId, refresh]
+  );
+  const updateQuestion = (0, import_react22.useCallback)(
+    async (questionId, text) => {
+      if (!taskId) return;
+      await service.updateQuestion(taskId, questionId, { text });
+      await refresh();
+    },
+    [service, taskId, refresh]
+  );
+  const setStatus = (0, import_react22.useCallback)(
+    async (questionId, status) => {
+      if (!taskId) return;
+      await service.updateQuestion(taskId, questionId, { status });
+      await refresh();
+    },
+    [service, taskId, refresh]
+  );
+  const deleteQuestion = (0, import_react22.useCallback)(
+    async (questionId) => {
+      if (!taskId) return;
+      await service.deleteQuestion(taskId, questionId);
+      await refresh();
+    },
+    [service, taskId, refresh]
+  );
+  const addReply = (0, import_react22.useCallback)(
+    async (questionId, content) => {
+      if (!taskId) return;
+      await service.addQuestionReply(taskId, questionId, { content });
+      await refresh();
+    },
+    [service, taskId, refresh]
+  );
+  const deleteReply = (0, import_react22.useCallback)(
+    async (questionId, replyId) => {
+      if (!taskId) return;
+      await service.deleteQuestionReply(taskId, questionId, replyId);
+      await refresh();
+    },
+    [service, taskId, refresh]
+  );
+  return {
+    questions,
+    loading,
+    refresh,
+    setQuestions,
+    createQuestion,
+    updateQuestion,
+    setStatus,
+    deleteQuestion,
+    addReply,
+    deleteReply
+  };
+}
+
+// src/hooks/useTaskAttachments.ts
+var import_react23 = require("react");
+function useTaskAttachments(taskId, initial) {
+  const { service } = useTaskBoardContext();
+  const [attachments, setAttachments] = (0, import_react23.useState)(initial ?? []);
+  const [loading, setLoading] = (0, import_react23.useState)(false);
+  const refresh = (0, import_react23.useCallback)(async () => {
+    if (!taskId) return;
+    setLoading(true);
+    try {
+      const list = await service.listAttachments(taskId);
+      setAttachments(list);
+    } finally {
+      setLoading(false);
+    }
+  }, [service, taskId]);
+  (0, import_react23.useEffect)(() => {
+    if (initial !== void 0) return;
+    if (!taskId) return;
+    refresh();
+  }, [taskId]);
+  const uploadFile = (0, import_react23.useCallback)(
+    async (file) => {
+      if (!taskId) throw new Error("No taskId");
+      const created = await service.uploadAttachment(taskId, file);
+      await refresh();
+      return created;
+    },
+    [service, taskId, refresh]
+  );
+  const addLink = (0, import_react23.useCallback)(
+    async (payload) => {
+      if (!taskId) throw new Error("No taskId");
+      const created = await service.addLinkAttachment(taskId, payload);
+      await refresh();
+      return created;
+    },
+    [service, taskId, refresh]
+  );
+  const remove = (0, import_react23.useCallback)(
+    async (attachmentId) => {
+      if (!taskId) return;
+      await service.deleteAttachment(taskId, attachmentId);
+      await refresh();
+    },
+    [service, taskId, refresh]
+  );
+  return { attachments, loading, refresh, setAttachments, uploadFile, addLink, remove };
+}
+
+// src/hooks/useHighlightAnchor.ts
+var import_react24 = require("react");
+function useHighlightAnchor() {
+  const [bubble, setBubble] = (0, import_react24.useState)(null);
+  const [pendingAnchor, setPendingAnchor] = (0, import_react24.useState)(null);
+  (0, import_react24.useEffect)(() => {
+    const onMouseUp = () => {
+      const sel = window.getSelection();
+      if (!sel || sel.rangeCount === 0 || sel.isCollapsed) {
+        setBubble(null);
+        return;
+      }
+      const text = sel.toString().trim();
+      if (!text) {
+        setBubble(null);
+        return;
+      }
+      const range = sel.getRangeAt(0);
+      const container = range.commonAncestorContainer;
+      const el = container.nodeType === 1 ? container : container.parentElement;
+      const sectionEl = el?.closest("[data-section]");
+      if (!sectionEl) {
+        setBubble(null);
+        return;
+      }
+      const sectionKey = sectionEl.dataset.section;
+      if (!sectionKey) {
+        setBubble(null);
+        return;
+      }
+      const rect = range.getBoundingClientRect();
+      setBubble({
+        x: rect.left + rect.width / 2,
+        y: rect.top - 8 + window.scrollY,
+        section: sectionKey,
+        snippet: text.slice(0, 200)
+      });
+    };
+    const onClickAway = (e) => {
+      const target = e.target;
+      if (target.closest("[data-annot-bubble]")) return;
+      setTimeout(() => {
+        const sel = window.getSelection();
+        if (!sel || sel.isCollapsed) setBubble(null);
+      }, 0);
+    };
+    document.addEventListener("mouseup", onMouseUp);
+    document.addEventListener("mousedown", onClickAway);
+    return () => {
+      document.removeEventListener("mouseup", onMouseUp);
+      document.removeEventListener("mousedown", onClickAway);
+    };
+  }, []);
+  const clearBubble = (0, import_react24.useCallback)(() => setBubble(null), []);
+  const clearPendingAnchor = (0, import_react24.useCallback)(() => setPendingAnchor(null), []);
+  const beginAnchoredThread = (0, import_react24.useCallback)(() => {
+    if (!bubble) return null;
+    const anchor = { section: bubble.section, snippet: bubble.snippet };
+    setPendingAnchor(anchor);
+    setBubble(null);
+    return anchor;
+  }, [bubble]);
+  const focusAnchor = (0, import_react24.useCallback)((anchor) => {
+    const el = document.querySelector(`[data-section="${anchor.section}"]`);
+    if (!el) return;
+    el.scrollIntoView({ behavior: "smooth", block: "center" });
+    el.classList.add("ring-2", "ring-amber-300", "rounded-lg", "transition-all");
+    setTimeout(() => {
+      el.classList.remove("ring-2", "ring-amber-300", "rounded-lg");
+    }, 1500);
+  }, []);
+  return {
+    bubble,
+    clearBubble,
+    pendingAnchor,
+    beginAnchoredThread,
+    clearPendingAnchor,
+    focusAnchor
+  };
+}
+
+// src/components/TaskDetailView.tsx
+var import_jsx_runtime28 = require("react/jsx-runtime");
+var PANEL_OPEN_KEY = "taskboard:panelOpen";
+function TaskDetailView({
+  taskId,
+  backHref,
+  onBack,
+  breadcrumb,
+  onDeleted,
+  onNavigateToTask,
+  buildShareUrl
+}) {
+  const { service, projects, columns, priorities, tags: predefinedTags, user, internalLabel } = useTaskBoardContext();
+  const [task, setTask] = (0, import_react25.useState)(null);
+  const [comments, setComments] = (0, import_react25.useState)([]);
+  const [activity, setActivity] = (0, import_react25.useState)([]);
+  const [initialQuestions, setInitialQuestions] = (0, import_react25.useState)(void 0);
+  const [initialAttachments, setInitialAttachments] = (0, import_react25.useState)(void 0);
+  const [loading, setLoading] = (0, import_react25.useState)(true);
+  const [error, setError] = (0, import_react25.useState)("");
+  const [saving, setSaving] = (0, import_react25.useState)(false);
+  const [title, setTitle] = (0, import_react25.useState)("");
+  const [titleEditing, setTitleEditing] = (0, import_react25.useState)(false);
+  const [description, setDescription] = (0, import_react25.useState)(EMPTY_DESCRIPTION);
+  const [priority, setPriority] = (0, import_react25.useState)("medium");
+  const [taskStatus, setTaskStatus] = (0, import_react25.useState)("backlog");
+  const [tags, setTags] = (0, import_react25.useState)([]);
+  const [statusOpen, setStatusOpen] = (0, import_react25.useState)(false);
+  const [priorityOpen, setPriorityOpen] = (0, import_react25.useState)(false);
+  const [moreOpen, setMoreOpen] = (0, import_react25.useState)(false);
+  const [tagsOpen, setTagsOpen] = (0, import_react25.useState)(false);
+  const [pendingTags, setPendingTags] = (0, import_react25.useState)([]);
+  const [showOtherTagInput, setShowOtherTagInput] = (0, import_react25.useState)(false);
+  const [linkCopied, setLinkCopied] = (0, import_react25.useState)(false);
+  const statusRef = (0, import_react25.useRef)(null);
+  const priorityRef = (0, import_react25.useRef)(null);
+  const moreRef = (0, import_react25.useRef)(null);
+  const tagsRef = (0, import_react25.useRef)(null);
+  const [projectTaskIds, setProjectTaskIds] = (0, import_react25.useState)([]);
+  const [openThreadId, setOpenThreadId] = (0, import_react25.useState)(null);
+  const [shimmeringThreadIds, setShimmeringThreadIds] = (0, import_react25.useState)(/* @__PURE__ */ new Set());
+  const [panelOpen, setPanelOpen] = (0, import_react25.useState)(() => {
+    if (typeof window === "undefined") return true;
+    try {
+      const stored = window.localStorage.getItem(PANEL_OPEN_KEY);
+      return stored === null ? true : stored === "true";
+    } catch {
+      return true;
+    }
+  });
+  const togglePanel = () => {
+    setPanelOpen((prev) => {
+      const next = !prev;
+      try {
+        window.localStorage.setItem(PANEL_OPEN_KEY, String(next));
+      } catch {
+      }
+      return next;
+    });
+  };
+  const fetchTask = (0, import_react25.useCallback)(async () => {
+    try {
+      const data = await service.getTask(taskId);
+      setTask(data);
+      setTitle(data.title || "");
+      setDescription(data.description || EMPTY_DESCRIPTION);
+      setPriority(data.priority || "medium");
+      setTaskStatus(data.status || "backlog");
+      setTags(data.tags || []);
+      setComments(data.comments || []);
+      setActivity(data.activity || []);
+      setInitialQuestions(data.questions || []);
+      setInitialAttachments(data.attachments || []);
+      service.markTaskRead(taskId).catch(() => {
+      });
+    } catch {
+      setError("Could not load task.");
+    } finally {
+      setLoading(false);
+    }
+  }, [service, taskId]);
+  (0, import_react25.useEffect)(() => {
+    fetchTask();
+  }, [fetchTask]);
+  (0, import_react25.useEffect)(() => {
+    if (!task || !onNavigateToTask) return;
+    let cancelled = false;
+    (async () => {
+      try {
+        const data = await service.listTasks(task.project_slug, 200);
+        if (cancelled) return;
+        const ids = [];
+        for (const col of columns) {
+          const colData = data[col.key];
+          if (colData && Array.isArray(colData.tasks)) {
+            ids.push(...colData.tasks.map((t) => t.id));
+          }
+        }
+        setProjectTaskIds(ids);
+      } catch {
+      }
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, [task, columns, service, onNavigateToTask]);
+  (0, import_react25.useEffect)(() => {
+    const onClick = (e) => {
+      const target = e.target;
+      if (statusOpen && statusRef.current && !statusRef.current.contains(target)) setStatusOpen(false);
+      if (priorityOpen && priorityRef.current && !priorityRef.current.contains(target)) setPriorityOpen(false);
+      if (moreOpen && moreRef.current && !moreRef.current.contains(target)) setMoreOpen(false);
+      if (tagsOpen && tagsRef.current && !tagsRef.current.contains(target)) setTagsOpen(false);
+    };
+    document.addEventListener("mousedown", onClick);
+    return () => document.removeEventListener("mousedown", onClick);
+  }, [statusOpen, priorityOpen, moreOpen, tagsOpen]);
+  const questions = useTaskQuestions(taskId, initialQuestions);
+  const attachments = useTaskAttachments(taskId, initialAttachments);
+  const highlight = useHighlightAnchor();
+  (0, import_react25.useEffect)(() => {
+    if (highlight.pendingAnchor && !panelOpen) {
+      setPanelOpen(true);
+      try {
+        window.localStorage.setItem(PANEL_OPEN_KEY, "true");
+      } catch {
+      }
+    }
+  }, [highlight.pendingAnchor, panelOpen]);
+  const persist = (0, import_react25.useCallback)(
+    async (updates) => {
+      setSaving(true);
+      try {
+        const updated = await service.updateTask(taskId, updates);
+        setTask((prev) => prev ? { ...prev, ...updated } : prev);
+      } finally {
+        setSaving(false);
+      }
+    },
+    [service, taskId]
+  );
+  const handleTitleCommit = () => {
+    setTitleEditing(false);
+    if (task && title.trim() && title.trim() !== task.title) {
+      persist({ title: title.trim() });
+    } else if (task) {
+      setTitle(task.title);
+    }
+  };
+  const handleSectionChange = (section, val) => {
+    const next = { ...description, [section]: val };
+    setDescription(next);
+    persist({ description: next });
+  };
+  const handleSectionStatusChange = (section, status) => {
+    const sectionStatus = { ...description.section_status || {}, [section]: status };
+    const next = { ...description, section_status: sectionStatus };
+    setDescription(next);
+    persist({ description: next });
+  };
+  const handleStatusChange = (s) => {
+    setTaskStatus(s);
+    setStatusOpen(false);
+    persist({ status: s });
+    setTimeout(() => fetchTask(), 500);
+  };
+  const handlePriorityChange = (p) => {
+    setPriority(p);
+    setPriorityOpen(false);
+    persist({ priority: p });
+  };
+  const handleTagsCommit = () => {
+    setTags([...pendingTags]);
+    setTagsOpen(false);
+    setShowOtherTagInput(false);
+    persist({ tags: pendingTags });
+  };
+  const handleDelete = async () => {
+    if (!task) return;
+    if (!confirm(`Delete "${task.title}"? This cannot be undone.`)) return;
+    try {
+      await service.deleteTask(taskId);
+      onDeleted?.(task);
+    } catch {
+      setError("Failed to delete task.");
+    }
+  };
+  const handleShare = () => {
+    if (!task) return;
+    const defaultUrl = `${window.location.origin}/task-board/${taskId}${task.project_slug ? `?project=${task.project_slug}` : ""}`;
+    const url = buildShareUrl ? buildShareUrl(task) : defaultUrl;
+    navigator.clipboard.writeText(url).then(() => {
+      setLinkCopied(true);
+      setTimeout(() => setLinkCopied(false), 2e3);
+    });
+  };
+  const handleCreateThread = async ({
+    title: titleLine,
+    content,
+    isInternal,
+    anchor,
+    attachmentIds
+  }) => {
+    try {
+      const created = await service.addComment(taskId, {
+        content,
+        is_internal: isInternal,
+        title: titleLine || null,
+        anchor,
+        attachment_ids: attachmentIds
+      });
+      if (created.id && !titleLine) {
+        setShimmeringThreadIds((prev) => new Set(prev).add(created.id));
+        setTimeout(() => {
+          setShimmeringThreadIds((prev) => {
+            const next = new Set(prev);
+            next.delete(created.id);
+            return next;
+          });
+        }, 800);
+      }
+      highlight.clearPendingAnchor();
+      await fetchTask();
+    } catch {
+    }
+  };
+  const handleCreateReply = async (parentId, content, isInternal) => {
+    try {
+      await service.addComment(taskId, {
+        content,
+        is_internal: isInternal,
+        parent_id: parentId
+      });
+      await fetchTask();
+    } catch {
+    }
+  };
+  const handleUpdateThread = async (threadId, body) => {
+    try {
+      await service.updateThread(taskId, threadId, body);
+      await fetchTask();
+    } catch {
+    }
+  };
+  const project = (0, import_react25.useMemo)(() => {
+    if (!task) return null;
+    return projects.find((p) => p.slug === task.project_slug) ?? null;
+  }, [task, projects]);
+  const threads = (0, import_react25.useMemo)(
+    () => deriveThreads(comments, attachments.attachments),
+    [comments, attachments.attachments]
+  );
+  const statusCol = columns.find((c) => c.key === taskStatus);
+  const priorityStyle = getPriorityStyle(priority);
+  const currentIdx = task ? projectTaskIds.indexOf(task.id) : -1;
+  const prevId = currentIdx > 0 ? projectTaskIds[currentIdx - 1] : null;
+  const nextId = currentIdx >= 0 && currentIdx < projectTaskIds.length - 1 ? projectTaskIds[currentIdx + 1] : null;
+  if (loading) {
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "min-h-screen flex items-center justify-center bg-[#FAFAFA]", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "text-sm text-neutral-400", children: "Loading task\u2026" }) });
+  }
+  if (!task) {
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "min-h-screen flex items-center justify-center bg-[#FAFAFA]", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "text-center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("h1", { className: "text-2xl font-medium text-neutral-900 mb-2", children: "Task not found" }),
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("p", { className: "text-neutral-500", children: error || "This task may have been deleted." })
+    ] }) });
+  }
+  const initials = getInitials(task.created_by_name || task.created_by || "?");
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "bg-white text-neutral-900", children: [
+    breadcrumb,
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+      "div",
+      {
+        className: `flex-1 px-6 lg:px-10 pt-6 pb-24 transition-[padding] duration-200 ${panelOpen ? "xl:pr-[460px]" : "xl:pr-[88px]"}`,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center justify-between mb-6", children: [
+            onBack ? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+              "button",
+              {
+                onClick: onBack,
+                className: "flex items-center gap-2 text-neutral-500 hover:text-neutral-900 w-fit",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ArrowLeftIcon, { size: 16, strokeWidth: 1.5 }),
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-[13px] font-medium", children: "Back to Task Board" })
+                ]
+              }
+            ) : backHref ? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+              "a",
+              {
+                href: backHref,
+                className: "flex items-center gap-2 text-neutral-500 hover:text-neutral-900 w-fit",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ArrowLeftIcon, { size: 16, strokeWidth: 1.5 }),
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-[13px] font-medium", children: "Back to Task Board" })
+                ]
+              }
+            ) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", {}),
+            onNavigateToTask && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-1 shrink-0", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                "button",
+                {
+                  onClick: () => prevId && onNavigateToTask(prevId, task.project_slug),
+                  disabled: !prevId,
+                  className: "inline-flex items-center justify-center w-9 h-9 rounded-xl border border-neutral-200 text-neutral-500 hover:text-neutral-900 hover:bg-neutral-50 hover:border-neutral-300 disabled:opacity-40 disabled:hover:bg-white disabled:hover:text-neutral-500",
+                  title: "Previous task",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronLeftIcon, { size: 16, strokeWidth: 1.5 })
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                "button",
+                {
+                  onClick: () => nextId && onNavigateToTask(nextId, task.project_slug),
+                  disabled: !nextId,
+                  className: "inline-flex items-center justify-center w-9 h-9 rounded-xl border border-neutral-200 text-neutral-500 hover:text-neutral-900 hover:bg-neutral-50 hover:border-neutral-300 disabled:opacity-40 disabled:hover:bg-white disabled:hover:text-neutral-500",
+                  title: "Next task",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronRightIcon, { size: 16, strokeWidth: 1.5 })
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "mb-3 flex items-center gap-2 flex-wrap", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "inline-flex items-center gap-1.5 px-2.5 py-1 rounded-full text-[12px] font-medium bg-neutral-50 text-neutral-700 border border-neutral-200", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "font-mono", children: formatTaskId(task.id) }) }),
+            project && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-[12px] text-neutral-400", children: "in" }),
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-[12px] text-[#FF5E00] hover:text-[#E05200] font-medium", children: project.name })
+            ] })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex gap-6 items-start mb-4", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex-1 min-w-0", children: [
+              titleEditing ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                "input",
+                {
+                  value: title,
+                  onChange: (e) => setTitle(e.target.value),
+                  onBlur: handleTitleCommit,
+                  onKeyDown: (e) => {
+                    if (e.key === "Enter") {
+                      e.preventDefault();
+                      handleTitleCommit();
+                    } else if (e.key === "Escape") {
+                      e.preventDefault();
+                      setTitle(task.title);
+                      setTitleEditing(false);
+                    }
+                  },
+                  autoFocus: true,
+                  className: "w-full text-[20px] font-semibold text-neutral-900 tracking-tight leading-snug bg-transparent border-b-2 border-[#FF5E00] focus:outline-none px-1 -mx-1"
+                }
+              ) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                "h1",
+                {
+                  onClick: () => setTitleEditing(true),
+                  className: "text-[20px] font-semibold text-neutral-900 tracking-tight leading-snug cursor-text rounded px-1 -mx-1 hover:bg-neutral-50/60",
+                  title: "Click to edit",
+                  children: title || "Untitled task"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "mt-3 flex items-center gap-3 flex-wrap text-[12px] text-neutral-500", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { children: [
+                  "Created ",
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "font-medium text-neutral-700", children: formatDate(task.created_at) })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-neutral-300", children: "\xB7" }),
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { children: [
+                  "Updated",
+                  " ",
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "font-medium text-neutral-700", children: task.updated_at ? formatDate(task.updated_at) : "\u2014" })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-neutral-300", children: "\xB7" }),
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { className: "inline-flex items-center gap-1.5", children: [
+                  "Creator",
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "w-4 h-4 rounded-full bg-[#FF5E00] text-white inline-flex items-center justify-center text-[9px] font-semibold", children: initials }),
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "font-medium text-neutral-700", children: task.created_by_name || task.created_by })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-neutral-300", children: "\xB7" }),
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "inline-flex items-center gap-1.5 relative", ref: tagsRef, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { children: "Tags" }),
+                  tags.map((tag) => {
+                    const style = getTagStyle(tag);
+                    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                      "span",
+                      {
+                        className: `inline-flex items-center px-1.5 py-px text-[10px] font-medium rounded border ${style.className}`,
+                        children: style.label
+                      },
+                      tag
+                    );
+                  }),
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+                    "button",
+                    {
+                      onClick: () => {
+                        if (!tagsOpen) setPendingTags([...tags]);
+                        setTagsOpen(!tagsOpen);
+                      },
+                      className: "inline-flex items-center gap-1 px-1.5 py-0.5 rounded border border-dashed border-neutral-300 text-neutral-400 hover:text-neutral-700 hover:border-neutral-400 text-[10px]",
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(PlusIcon, { size: 10, strokeWidth: 2 }),
+                        "Edit"
+                      ]
+                    }
+                  ),
+                  tagsOpen && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "absolute top-full left-0 mt-1 bg-white border border-neutral-200 rounded-lg shadow-lg z-30 w-56", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "py-1", children: [
+                      predefinedTags.map((tag) => {
+                        const isSelected = pendingTags.includes(tag.value);
+                        return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+                          "button",
+                          {
+                            onClick: () => {
+                              setPendingTags(
+                                (prev) => isSelected ? prev.filter((t) => t !== tag.value) : [...prev, tag.value]
+                              );
+                            },
+                            className: `w-full text-left px-3 py-1.5 text-[12px] hover:bg-neutral-50 flex items-center justify-between ${isSelected ? "bg-neutral-50" : ""}`,
+                            children: [
+                              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                                "span",
+                                {
+                                  className: `inline-flex items-center px-2 py-0.5 text-[10px] font-medium rounded border ${tag.className}`,
+                                  children: tag.label
+                                }
+                              ),
+                              isSelected && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(CheckIcon, { size: 12, strokeWidth: 2.5, className: "text-[#FF5E00]" })
+                            ]
+                          },
+                          tag.value
+                        );
+                      }),
+                      pendingTags.filter((t) => !predefinedTags.some((p) => p.value === t)).map((tag) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+                        "div",
+                        {
+                          className: "w-full text-left px-3 py-1.5 text-[12px] bg-neutral-50 flex items-center justify-between",
+                          children: [
+                            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "inline-flex items-center px-2 py-0.5 text-[10px] font-medium rounded border bg-neutral-100 text-neutral-500 border-neutral-200", children: tag }),
+                            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                              "button",
+                              {
+                                onClick: () => setPendingTags((prev) => prev.filter((t) => t !== tag)),
+                                className: "text-neutral-400 hover:text-neutral-600",
+                                children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(XIcon, { size: 12, strokeWidth: 2 })
+                              }
+                            )
+                          ]
+                        },
+                        tag
+                      )),
+                      !showOtherTagInput ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                        "button",
+                        {
+                          onClick: () => setShowOtherTagInput(true),
+                          className: "w-full text-left px-3 py-1.5 text-[12px] hover:bg-neutral-50 flex items-center justify-between",
+                          children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "inline-flex items-center px-2 py-0.5 text-[10px] font-medium rounded border bg-neutral-100 text-neutral-500 border-neutral-200", children: "Other" })
+                        }
+                      ) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "px-3 py-2 bg-neutral-50/50", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                        "input",
+                        {
+                          type: "text",
+                          autoFocus: true,
+                          onKeyDown: (e) => {
+                            if (e.key === "Enter") {
+                              e.preventDefault();
+                              const val = e.currentTarget.value.trim().toLowerCase().replace(/\s+/g, "-");
+                              if (val && !pendingTags.includes(val)) {
+                                setPendingTags((prev) => [...prev, val]);
+                              }
+                              e.currentTarget.value = "";
+                              setShowOtherTagInput(false);
+                            }
+                            if (e.key === "Escape") {
+                              setShowOtherTagInput(false);
+                            }
+                          },
+                          className: "w-full px-2 py-1.5 text-[12px] border border-neutral-200 rounded-md focus:outline-none focus:ring-1 focus:ring-[#FF5E00]/20 focus:border-[#FF5E00]/50",
+                          placeholder: "Type a custom tag..."
+                        }
+                      ) })
+                    ] }),
+                    /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "border-t border-neutral-100 px-2 py-2 flex items-center justify-end gap-2", children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                        "button",
+                        {
+                          onClick: () => {
+                            setPendingTags([...tags]);
+                            setTagsOpen(false);
+                            setShowOtherTagInput(false);
+                          },
+                          className: "px-2.5 py-1 text-[11px] font-medium text-neutral-500 hover:text-neutral-700",
+                          children: "Cancel"
+                        }
+                      ),
+                      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                        "button",
+                        {
+                          onClick: handleTagsCommit,
+                          className: "px-3 py-1 text-[11px] font-medium text-white bg-[#FF5E00] hover:bg-[#E05200] rounded",
+                          children: "Save"
+                        }
+                      )
+                    ] })
+                  ] })
+                ] })
+              ] })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-2 shrink-0", children: [
+              saving && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-[11px] text-neutral-400 mr-1", children: "Saving..." }),
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "relative", ref: statusRef, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+                  "button",
+                  {
+                    onClick: () => {
+                      setStatusOpen(!statusOpen);
+                      setPriorityOpen(false);
+                      setMoreOpen(false);
+                    },
+                    className: "inline-flex items-center gap-2 h-10 px-3 rounded-xl border border-neutral-200 bg-white text-[12px] font-medium text-neutral-700 hover:text-neutral-900 hover:border-neutral-300",
+                    children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: `w-2 h-2 rounded-full ${statusCol?.color ?? "bg-neutral-400"}` }),
+                      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { children: statusCol?.label ?? taskStatus }),
+                      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronDownIcon, { size: 12, strokeWidth: 1.5, className: "text-neutral-400" })
+                    ]
+                  }
+                ),
+                statusOpen && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "absolute right-0 top-full mt-1 w-52 bg-white border border-neutral-200 rounded-xl shadow-lg py-1 z-40", children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+                  "button",
+                  {
+                    onClick: () => handleStatusChange(col.key),
+                    className: `w-full text-left px-3 py-2 text-[12px] text-neutral-700 hover:bg-neutral-50 flex items-center gap-2 ${taskStatus === col.key ? "font-medium bg-neutral-50" : ""}`,
+                    children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: `w-2 h-2 rounded-full ${col.color}` }),
+                      col.label
+                    ]
+                  },
+                  col.key
+                )) })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "relative", ref: priorityRef, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+                  "button",
+                  {
+                    onClick: () => {
+                      setPriorityOpen(!priorityOpen);
+                      setStatusOpen(false);
+                      setMoreOpen(false);
+                    },
+                    className: `inline-flex items-center gap-2 h-10 px-3 rounded-xl border text-[12px] font-medium transition-colors ${priorityStyle.className}`,
+                    children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { children: priorityStyle.label }),
+                      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronDownIcon, { size: 12, strokeWidth: 1.5, className: "opacity-50" })
+                    ]
+                  }
+                ),
+                priorityOpen && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "absolute right-0 top-full mt-1 w-44 bg-white border border-neutral-200 rounded-xl shadow-lg py-1 z-40", children: priorities.map((p) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                  "button",
+                  {
+                    onClick: () => handlePriorityChange(p.value),
+                    className: `w-full text-left px-3 py-2 text-[12px] hover:bg-neutral-50 flex items-center gap-2 ${priority === p.value ? "bg-neutral-50" : ""}`,
+                    children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                      "span",
+                      {
+                        className: `inline-flex items-center px-2 py-0.5 text-[10px] font-medium rounded border ${p.className}`,
+                        children: p.label
+                      }
+                    )
+                  },
+                  p.value
+                )) })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "relative", ref: moreRef, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                  "button",
+                  {
+                    onClick: () => {
+                      setMoreOpen(!moreOpen);
+                      setStatusOpen(false);
+                      setPriorityOpen(false);
+                    },
+                    className: "w-10 h-10 flex items-center justify-center rounded-xl border border-neutral-200 bg-white text-neutral-500 hover:text-neutral-900 hover:border-neutral-300",
+                    "aria-label": "More actions",
+                    children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(MoreVerticalIcon, { size: 16, strokeWidth: 1.5 })
+                  }
+                ),
+                moreOpen && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "absolute right-0 top-full mt-1 w-40 bg-white border border-neutral-200 rounded-xl shadow-lg py-1 z-40", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+                    "button",
+                    {
+                      onClick: () => {
+                        setMoreOpen(false);
+                        handleShare();
+                      },
+                      className: "w-full text-left px-3 py-2 text-[12px] text-neutral-700 hover:bg-neutral-50 flex items-center gap-2.5",
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Share2Icon, { size: 14, strokeWidth: 1.5, className: "text-neutral-400" }),
+                        linkCopied ? "Copied!" : "Share"
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+                    "button",
+                    {
+                      onClick: () => {
+                        setMoreOpen(false);
+                        handleDelete();
+                      },
+                      className: "w-full text-left px-3 py-2 text-[12px] text-red-600 hover:bg-red-50 flex items-center gap-2.5",
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(TrashIcon, { size: 14, strokeWidth: 1.5 }),
+                        "Delete"
+                      ]
+                    }
+                  )
+                ] })
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex flex-col gap-10 mt-10", children: [
+            DESCRIPTION_SECTIONS.map((section) => {
+              const status = description.section_status?.[section.key] === "approved" ? "approved" : "draft";
+              return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                DescriptionSection,
+                {
+                  sectionKey: section.key,
+                  label: section.label,
+                  placeholder: section.placeholder ?? "",
+                  value: description[section.key] || "",
+                  onChange: (v) => handleSectionChange(section.key, v),
+                  status,
+                  onStatusChange: (s) => handleSectionStatusChange(section.key, s),
+                  saving
+                },
+                section.key
+              );
+            }),
+            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+              OutstandingQuestionsSection,
+              {
+                questions: questions.questions,
+                currentUsername: user.username,
+                onCreate: questions.createQuestion,
+                onSetStatus: questions.setStatus,
+                onDelete: questions.deleteQuestion,
+                onAddReply: questions.addReply
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+              AttachmentsSection,
+              {
+                attachments: attachments.attachments,
+                onUpload: attachments.uploadFile,
+                onAddLink: (url, name) => attachments.addLink({ url, name }),
+                onDelete: attachments.remove
+              }
+            )
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+      ThreadsPanel,
+      {
+        threads,
+        activity,
+        attachments: attachments.attachments,
+        open: panelOpen,
+        onToggle: togglePanel,
+        openThreadId,
+        onOpenThread: setOpenThreadId,
+        pendingAnchor: highlight.pendingAnchor,
+        onClearAnchor: highlight.clearPendingAnchor,
+        onAnchorClick: highlight.focusAnchor,
+        shimmeringThreadIds,
+        isInternalUser: !!user.is_internal,
+        onCreateThread: handleCreateThread,
+        onCreateReply: handleCreateReply,
+        onUpdateThread: handleUpdateThread,
+        onUploadAttachment: attachments.uploadFile,
+        onAddLinkAttachment: (url, name) => attachments.addLink({ url, name })
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(HighlightBubble, { bubble: highlight.bubble, onComment: highlight.beginAnchoredThread })
+  ] });
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  ActivityList,
+  ArrowLeftIcon,
+  AttachmentsSection,
   BellIcon,
   BoardSkeleton,
+  Bold,
+  ChatDotsIcon,
+  CheckCircle2Icon,
   CheckIcon,
   ChevronDownIcon,
+  ChevronLeftIcon,
+  ChevronRightIcon,
+  Code,
+  ContextPill,
+  CornerUpLeftIcon,
   CreateTaskModal,
   DEFAULT_COLUMNS,
+  DEFAULT_INTERNAL_LABEL,
   DEFAULT_PAGE_SIZE,
   DEFAULT_PRIORITIES,
   DESCRIPTION_SECTIONS,
+  DescriptionSection,
   EMPTY_DESCRIPTION,
+  ExternalLinkIcon,
   FeedbackIcon,
+  FileTextIcon,
   FilterBar,
   FilterIcon,
+  Heading2,
+  HelpCircleIcon,
+  HighlightBubble,
+  HistoryIcon,
+  ImageIcon,
+  Italic,
   KanbanColumn,
   KanbanIcon,
+  Link2Icon,
   LinkIcon,
+  List,
+  ListOrdered,
   LockIcon,
+  MarkdownEditor,
+  MarkdownView,
   MentionText,
   MentionTextarea,
   MessageSquareIcon,
+  MoreVerticalIcon,
   NotificationBell,
+  OutstandingQuestionsSection,
   POSITION_GAP,
   PREDEFINED_TAGS,
   PencilIcon,
   PlusIcon,
   PriorityBadge,
+  Quote,
+  RotateCcwIcon,
+  Share2Icon,
+  SidebarToggleIcon,
   SkeletonCard,
   SkeletonPulse,
   TagBadge,
@@ -2349,24 +5756,39 @@ function TaskBoard({
   TaskBoardProvider,
   TaskCard,
   TaskDetailPanel,
+  TaskDetailView,
+  ThreadCard,
+  ThreadComposer,
+  ThreadDetailView,
+  ThreadsPanel,
   TrashIcon,
   UserAvatar,
   XIcon,
   createTaskBoardService,
+  deriveThreads,
   formatDate,
   formatDateTime,
+  formatTaskId,
   getDescriptionPreview,
   getInitials,
   getPriorityStyle,
   getTagStyle,
   getUserProjects,
   hasDescription,
+  htmlToMd,
+  mdToHtml,
+  parseDate,
+  sectionLabel,
+  timeAgo,
   toDisplayText,
   toStoredText,
+  useHighlightAnchor,
   useShareLink,
   useTaskActions,
+  useTaskAttachments,
   useTaskBoard,
   useTaskBoardContext,
-  useTaskDetail
+  useTaskDetail,
+  useTaskQuestions
 });
 //# sourceMappingURL=index.js.map