@devalok/shilp-sutra-karm 0.1.0 → 0.2.0

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

@@ -1,109 +1,109 @@
-import { jsx as r, jsxs as c, Fragment as U } from "react/jsx-runtime";
-import * as d from "react";
-import { cn as _ } from "@devalok/shilp-sutra/ui";
-import { Sheet as ee, SheetContent as ie, SheetTitle as re } from "@devalok/shilp-sutra/ui";
-import { VisuallyHidden as se } from "@devalok/shilp-sutra/ui";
+import { jsx as r, jsxs as a, Fragment as ee } from "react/jsx-runtime";
+import * as c from "react";
+import { cn as L } from "@devalok/shilp-sutra/ui";
+import { Sheet as ie, SheetContent as re, SheetTitle as se } from "@devalok/shilp-sutra/ui";
+import { VisuallyHidden as le } from "@devalok/shilp-sutra/ui";
 import { Skeleton as t } from "@devalok/shilp-sutra/ui";
-import { Tabs as le, TabsList as ce, TabsTrigger as de } from "@devalok/shilp-sutra/ui";
-import { TaskProperties as te } from "./task-properties.js";
-import { SubtasksTab as ae } from "./subtasks-tab.js";
+import { Tabs as ae, TabsList as ce, TabsTrigger as te } from "@devalok/shilp-sutra/ui";
+import { TaskProperties as de } from "./task-properties.js";
+import { SubtasksTab as fe } from "./subtasks-tab.js";
 import { ReviewTab as me } from "./review-tab.js";
-import { ConversationTab as fe } from "./conversation-tab.js";
-import { FilesTab as ne } from "./files-tab.js";
-import { ActivityTab as oe } from "./activity-tab.js";
-import { IconListCheck as be, IconGitPullRequest as he, IconMessageCircle as ue, IconPaperclip as pe, IconActivity as ve } from "@tabler/icons-react";
+import { ConversationTab as ne } from "./conversation-tab.js";
+import { FilesTab as oe } from "./files-tab.js";
+import { ActivityTab as be } from "./activity-tab.js";
+import { IconListCheck as pe, IconGitPullRequest as he, IconMessageCircle as ue, IconPaperclip as ve, IconActivity as xe } from "@tabler/icons-react";
 const z = [
-  { id: "subtasks", label: "Subtasks", icon: be },
+  { id: "subtasks", label: "Subtasks", icon: pe },
   { id: "review", label: "Review", icon: he },
   { id: "conversation", label: "Conversation", icon: ue },
-  { id: "files", label: "Files", icon: pe },
-  { id: "activity", label: "Activity", icon: ve }
+  { id: "files", label: "Files", icon: ve },
+  { id: "activity", label: "Activity", icon: xe }
 ];
-function xe() {
-  return /* @__PURE__ */ c("div", { className: "space-y-ds-06 p-ds-06", children: [
+function ye() {
+  return /* @__PURE__ */ a("div", { className: "space-y-ds-06 p-ds-06", children: [
     /* @__PURE__ */ r(t, { className: "h-ds-xs-plus w-3/4 bg-field" }),
-    /* @__PURE__ */ r("div", { className: "space-y-ds-04", children: Array.from({ length: 6 }).map((i, m) => /* @__PURE__ */ c("div", { className: "flex items-center gap-ds-04", children: [
-      /* @__PURE__ */ r(t, { className: "h-4 w-[120px] bg-field" }),
-      /* @__PURE__ */ r(t, { className: "h-4 flex-1 bg-field" })
-    ] }, m)) }),
-    /* @__PURE__ */ r("div", { className: "flex gap-ds-05 border-b border-border pb-ds-03", children: Array.from({ length: 5 }).map((i, m) => /* @__PURE__ */ r(t, { className: "h-3 w-16 bg-field" }, m)) }),
-    /* @__PURE__ */ c("div", { className: "space-y-ds-04", children: [
+    /* @__PURE__ */ r("div", { className: "space-y-ds-04", children: Array.from({ length: 6 }).map((V, i) => /* @__PURE__ */ a("div", { className: "flex items-center gap-ds-04", children: [
+      /* @__PURE__ */ r(t, { className: "h-[16px] w-[120px] bg-field" }),
+      /* @__PURE__ */ r(t, { className: "h-[16px] flex-1 bg-field" })
+    ] }, i)) }),
+    /* @__PURE__ */ r("div", { className: "flex gap-ds-05 border-b border-border pb-ds-03", children: Array.from({ length: 5 }).map((V, i) => /* @__PURE__ */ r(t, { className: "h-[12px] w-[64px] bg-field" }, i)) }),
+    /* @__PURE__ */ a("div", { className: "space-y-ds-04", children: [
       /* @__PURE__ */ r(t, { className: "h-ds-md w-full bg-field" }),
       /* @__PURE__ */ r(t, { className: "h-ds-md w-full bg-field" }),
       /* @__PURE__ */ r(t, { className: "h-ds-md w-4/5 bg-field" })
     ] })
   ] });
 }
-function ye({
+const Ne = c.forwardRef(function({
   task: i,
-  loading: m = !1,
-  open: h,
-  onOpenChange: G,
+  loading: G = !1,
+  open: b,
+  onOpenChange: H,
   columns: f,
   members: j,
-  activities: H = [],
-  enrichedComments: J,
+  activities: J = [],
+  enrichedComments: P,
   clientMode: s = !1,
   clientEditableFields: A = ["priority", "dueDate"],
-  onTitleUpdate: u,
-  onPropertyUpdate: p,
-  onAssign: v,
-  onUnassign: x,
-  onCreateSubtask: y,
-  onToggleSubtask: N,
-  onRequestReview: T,
-  onUpdateReviewStatus: w,
-  onPostComment: g,
-  onUploadFile: I,
-  onDeleteFile: D,
-  onTabChange: E,
+  onTitleUpdate: p,
+  onPropertyUpdate: h,
+  onAssign: u,
+  onUnassign: v,
+  onCreateSubtask: x,
+  onToggleSubtask: y,
+  onRequestReview: N,
+  onUpdateReviewStatus: T,
+  onPostComment: w,
+  onUploadFile: g,
+  onDeleteFile: I,
+  onTabChange: D,
   renderEditor: Q,
   renderViewer: W,
   renderPriorityIndicator: X,
   renderDatePicker: Y,
   isUploading: Z = !1
-}) {
-  var C, K, L;
-  const [a, B] = d.useState(s ? "conversation" : "subtasks"), [V, n] = d.useState(!1), [O, o] = d.useState(""), b = d.useRef(null);
-  d.useEffect(() => {
-    i && (o(i.title), n(!1));
-  }, [i == null ? void 0 : i.id]), d.useEffect(() => {
-    h && B(s ? "conversation" : "subtasks");
-  }, [h, s]);
+}, Te) {
+  var _, C, K;
+  const [d, B] = c.useState(s ? "conversation" : "subtasks"), [E, m] = c.useState(!1), [O, n] = c.useState(""), o = c.useRef(null);
+  c.useEffect(() => {
+    i && (n(i.title), m(!1));
+  }, [i == null ? void 0 : i.id]), c.useEffect(() => {
+    b && B(s ? "conversation" : "subtasks");
+  }, [b, s]);
   const $ = (e) => {
-    B(e), E == null || E(e);
+    B(e), D == null || D(e);
   }, S = () => {
-    n(!1);
+    m(!1);
     const e = O.trim();
-    e && e !== (i == null ? void 0 : i.title) ? u == null || u(e) : i && o(i.title);
+    e && e !== (i == null ? void 0 : i.title) ? p == null || p(e) : i && n(i.title);
   }, q = (e) => {
-    e.key === "Enter" && (e.preventDefault(), S()), e.key === "Escape" && (n(!1), i && o(i.title));
+    e.key === "Enter" && (e.preventDefault(), S()), e.key === "Escape" && (m(!1), i && n(i.title));
   };
-  d.useEffect(() => {
-    V && b.current && (b.current.focus(), b.current.select());
-  }, [V]);
-  const P = (C = f.find((e) => e.isTerminal)) == null ? void 0 : C.id, R = ((K = f.find((e) => e.isDefault)) == null ? void 0 : K.id) || ((L = f[0]) == null ? void 0 : L.id) || "", F = s ? z.filter((e) => e.id === "conversation") : z, k = J || (i == null ? void 0 : i.comments) || [];
-  return /* @__PURE__ */ r(ee, { open: h, onOpenChange: G, children: /* @__PURE__ */ c(
-    ie,
+  c.useEffect(() => {
+    E && o.current && (o.current.focus(), o.current.select());
+  }, [E]);
+  const R = (_ = f.find((e) => e.isTerminal)) == null ? void 0 : _.id, F = ((C = f.find((e) => e.isDefault)) == null ? void 0 : C.id) || ((K = f[0]) == null ? void 0 : K.id) || "", k = s ? z.filter((e) => e.id === "conversation") : z, M = P || (i == null ? void 0 : i.comments) || [];
+  return /* @__PURE__ */ r(ie, { open: b, onOpenChange: H, children: /* @__PURE__ */ a(
+    re,
     {
       side: "right",
-      className: _(
+      className: L(
         /* intentional: task detail side panel takes 40% of screen, min 380px for form usability */
         "w-full sm:max-w-none sm:w-[40%] min-w-[380px] p-0",
         "flex flex-col overflow-hidden",
         "border-l border-border bg-layer-01"
       ),
       children: [
-        /* @__PURE__ */ r(se, { children: /* @__PURE__ */ r(re, { children: (i == null ? void 0 : i.title) || "Task Details" }) }),
-        m || !i ? /* @__PURE__ */ r(xe, {}) : /* @__PURE__ */ c(U, { children: [
-          /* @__PURE__ */ c("div", { className: "shrink-0 border-b border-border px-ds-06 pb-ds-05 pt-ds-06", children: [
-            !s && V ? /* @__PURE__ */ r(
+        /* @__PURE__ */ r(le, { children: /* @__PURE__ */ r(se, { children: (i == null ? void 0 : i.title) || "Task Details" }) }),
+        G || !i ? /* @__PURE__ */ r(ye, {}) : /* @__PURE__ */ a(ee, { children: [
+          /* @__PURE__ */ a("div", { className: "shrink-0 border-b border-border px-ds-06 pb-ds-05 pt-ds-06", children: [
+            !s && E ? /* @__PURE__ */ r(
               "input",
               {
-                ref: b,
+                ref: o,
                 type: "text",
                 value: O,
-                onChange: (e) => o(e.target.value),
+                onChange: (e) => n(e.target.value),
                 onBlur: S,
                 onKeyDown: q,
                 className: "w-full bg-transparent text-ds-lg font-semibold text-text-primary outline-none"
@@ -113,8 +113,8 @@ function ye({
               /* @__PURE__ */ r(
                 "h2",
                 {
-                  onClick: s ? void 0 : () => n(!0),
-                  className: _(
+                  onClick: s ? void 0 : () => m(!0),
+                  className: L(
                     "text-ds-lg font-semibold text-text-primary",
                     !s && "cursor-text hover:text-interactive transition-colors"
                   ),
@@ -124,85 +124,85 @@ function ye({
             ),
             i.parentTaskId && /* @__PURE__ */ r("p", { className: "mt-ds-02 text-ds-sm text-text-placeholder", children: "Subtask" })
           ] }),
-          /* @__PURE__ */ c("div", { className: "flex-1 overflow-y-auto", children: [
+          /* @__PURE__ */ a("div", { className: "flex-1 overflow-y-auto", children: [
             /* @__PURE__ */ r("div", { className: "border-b border-border px-ds-06 py-ds-05", children: /* @__PURE__ */ r(
-              te,
+              de,
               {
                 task: i,
                 columns: f,
                 members: j,
                 onUpdate: (e, l) => {
-                  s && !A.includes(e) || p == null || p(e, l);
+                  s && !A.includes(e) || h == null || h(e, l);
                 },
-                onAssign: (e) => v == null ? void 0 : v(e),
-                onUnassign: (e) => x == null ? void 0 : x(e),
+                onAssign: (e) => u == null ? void 0 : u(e),
+                onUnassign: (e) => v == null ? void 0 : v(e),
                 readOnly: s,
                 editableFields: s ? A : void 0,
                 renderPriorityIndicator: X,
                 renderDatePicker: Y
               }
             ) }),
-            /* @__PURE__ */ r("div", { className: "sticky top-0 z-raised bg-layer-01 px-ds-06", children: /* @__PURE__ */ r(le, { value: a, onValueChange: $, children: /* @__PURE__ */ r(ce, { variant: "line", children: F.map((e) => /* @__PURE__ */ c(de, { value: e.id, children: [
+            /* @__PURE__ */ r("div", { className: "sticky top-0 z-raised bg-layer-01 px-ds-06", children: /* @__PURE__ */ r(ae, { value: d, onValueChange: $, children: /* @__PURE__ */ r(ce, { variant: "line", children: k.map((e) => /* @__PURE__ */ a(te, { value: e.id, children: [
               /* @__PURE__ */ r(e.icon, { className: "h-ico-sm w-ico-sm", stroke: 1.5 }),
               e.label
             ] }, e.id)) }) }) }),
-            /* @__PURE__ */ c("div", { className: "px-ds-06 py-ds-05", children: [
-              a === "subtasks" && /* @__PURE__ */ r(
-                ae,
+            /* @__PURE__ */ a("div", { className: "px-ds-06 py-ds-05", children: [
+              d === "subtasks" && /* @__PURE__ */ r(
+                fe,
                 {
                   subtasks: i.subtasks ?? [],
-                  terminalColumnId: P,
+                  terminalColumnId: R,
                   projectId: i.projectId,
                   parentTaskId: i.id,
-                  defaultColumnId: R,
+                  defaultColumnId: F,
                   onCreateSubtask: s ? () => {
-                  } : (e) => y == null ? void 0 : y(e),
+                  } : (e) => x == null ? void 0 : x(e),
                   onToggleSubtask: s ? () => {
-                  } : (e, l) => N == null ? void 0 : N(e, l),
+                  } : (e, l) => y == null ? void 0 : y(e, l),
                   readOnly: s
                 }
               ),
-              a === "review" && !s && /* @__PURE__ */ r(
+              d === "review" && !s && /* @__PURE__ */ r(
                 me,
                 {
                   reviews: i.reviewRequests,
                   members: j,
-                  onRequestReview: (e) => T == null ? void 0 : T(e),
-                  onUpdateStatus: (e, l, M) => w == null ? void 0 : w(e, l, M)
+                  onRequestReview: (e) => N == null ? void 0 : N(e),
+                  onUpdateStatus: (e, l, U) => T == null ? void 0 : T(e, l, U)
                 }
               ),
-              a === "conversation" && /* @__PURE__ */ r(
-                fe,
+              d === "conversation" && /* @__PURE__ */ r(
+                ne,
                 {
-                  comments: k,
+                  comments: M,
                   taskVisibility: i.visibility,
-                  onPostComment: (e, l) => g == null ? void 0 : g(e, l),
+                  onPostComment: (e, l) => w == null ? void 0 : w(e, l),
                   clientMode: s,
                   renderEditor: Q,
                   renderViewer: W
                 }
               ),
-              a === "files" && /* @__PURE__ */ r(
-                ne,
+              d === "files" && /* @__PURE__ */ r(
+                oe,
                 {
                   files: i.files ?? [],
                   onUpload: s ? () => {
-                  } : (e, l) => I == null ? void 0 : I(e, l),
+                  } : (e, l) => g == null ? void 0 : g(e, l),
                   onDelete: s ? () => {
-                  } : (e) => D == null ? void 0 : D(e),
+                  } : (e) => I == null ? void 0 : I(e),
                   isUploading: Z,
                   readOnly: s
                 }
               ),
-              a === "activity" && /* @__PURE__ */ r(oe, { activities: H })
+              d === "activity" && /* @__PURE__ */ r(be, { activities: J })
             ] })
           ] })
         ] })
       ]
     }
   ) });
-}
-ye.displayName = "TaskDetailPanel";
+});
+Ne.displayName = "TaskDetailPanel";
 export {
-  ye as TaskDetailPanel
+  Ne as TaskDetailPanel
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devalok/shilp-sutra-karm",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Domain components for Karm — board, tasks, chat, dashboard, client, and admin",
   "license": "MIT",
   "type": "module",
@@ -43,7 +43,8 @@
   ],
   "scripts": {
     "build": "vite build",
-    "typecheck": "tsc --noEmit"
+    "typecheck": "tsc --noEmit",
+    "lint": "eslint src/"
   },
   "peerDependencies": {
     "@devalok/shilp-sutra": ">=0.1.0",