@devalok/shilp-sutra-karm 0.18.1 → 0.19.0

package/llms.txt

@@ -10,14 +10,14 @@ pnpm add @devalok/shilp-sutra-karm
 
 // Per-module imports (recommended):
 import { KanbanBoard } from '@devalok/shilp-sutra-karm/board'
-import { TaskDetailPanel } from '@devalok/shilp-sutra-karm/tasks'
+import { TaskPanel, TaskColumnPicker, SubtasksTab } from '@devalok/shilp-sutra-karm/tasks'
 import { ChatPanel } from '@devalok/shilp-sutra-karm/chat'
 import { AttendanceCTA, DailyBrief } from '@devalok/shilp-sutra-karm/dashboard'
 import { AccentProvider, ClientPortalHeader, ProjectCard } from '@devalok/shilp-sutra-karm/client'
 import { AdminDashboard, BreakAdmin } from '@devalok/shilp-sutra-karm/admin'
 
 // Or from root barrel:
-import { KanbanBoard, TaskDetailPanel, ChatPanel } from '@devalok/shilp-sutra-karm'
+import { KanbanBoard, TaskPanel, ChatPanel } from '@devalok/shilp-sutra-karm'
 
 ## Module Reference
 
@@ -50,17 +50,42 @@ and state updates. Example wiring a custom column header action:
   />
 
 ### Tasks (`/tasks`)
+
+**TaskPanel (v2 composition API — recommended)**
+Headless compound component. Shell subcomponents:
+- TaskPanel (root): children, className — flex column container
+- TaskPanel.Header: children, className — top section with border
+- TaskPanel.Title: value, editable?, onUpdate?, subtask?, className — inline-editable heading
+- TaskPanel.Properties: children, className — property rows container
+- TaskPanel.Property: icon, label, children, className — single property row (120px label + flex value)
+- TaskPanel.Tabs: defaultTab, onTabChange?, children — tab system (children must be TaskPanel.Tab)
+- TaskPanel.Tab: id, label, icon?, children — declarative tab definition
+- TaskPanel.Loading: className — skeleton placeholder
+
+**Pickers (7)** — all support readOnly?, className?, forwardRef
+- TaskColumnPicker: columns[], value(string), onChange(id)
+- TaskPriorityPicker: value(Priority), onChange(priority)
+- TaskMemberPicker: members[], value(string|null), onChange(id|null), placeholder?
+- TaskAssigneePicker: members[], value(Member[]), onAssign(id), onUnassign(id)
+- TaskDatePicker: value(Date|string|null), onChange(date|null), presets?(default:true)
+- TaskLabelEditor: value(string[]), onChange(labels), availableLabels?(LabelOption[])
+- TaskVisibilityPicker: value(Visibility), onChange(v), confirmOnPublic?
+
+**Tab Pieces (16)** — for custom tab layouts
+Subtasks: SubtaskProgress(completed,total), SubtaskList(children), SubtaskItem(subtask,isComplete,onToggle?,onClick?), SubtaskAddForm(onCreate)
+Conversation: MessageList(children,autoScroll?), MessageBubble(comment,clientMode?,renderViewer?), MessageInput(onSubmit,renderEditor?,clientMode?), VisibilityWarning
+Files: FileDropZone(onUpload,isUploading?,accept?), FileList(children), FileItem(file,onDelete?,readOnly?)
+Review: ReviewCard(review,onUpdateStatus?), ReviewResponseForm(reviewId,onSubmit), ReviewRequestButton(members,onRequest)
+Activity: ActivityTimeline(children), ActivityEntry(entry)
+
+**Pre-assembled tabs** (unchanged from v0.18.0, usable inside TaskPanel.Tab):
+- SubtasksTab, ConversationTab, FilesTab, ReviewTab, ActivityTab
+
+**TaskDetailPanel (deprecated)** — monolithic v0.18.0 component, still exported. Migrate to TaskPanel.
 - TaskDetailPanel: task(FullTask|null), open, onOpenChange, columns[], members[], activities[], clientMode?, onTitleUpdate, onPropertyUpdate, onAssign, onUnassign, onCreateSubtask, onToggleSubtask, onRequestReview, onUpdateReviewStatus + more callbacks
 - TaskProperties: task, columns[], members[], onUpdate, onAssign, onUnassign, readOnly?, editableFields?, renderPriorityIndicator?, renderDatePicker?
-- ActivityTab: activities(AuditLogEntry[])
-- ConversationTab: comments[], taskVisibility, onPostComment, clientMode?, renderEditor?, renderViewer?
-- FilesTab: files[], onUpload, onDelete, isUploading?, readOnly?
-- ReviewTab: reviews[], members[], onRequestReview, onUpdateStatus
-- SubtasksTab: subtasks[], onCreateSubtask, onToggleSubtask, onClickSubtask?, readOnly?
-
-Type: ExtraTab = { id: string, label: string, icon?: ReactNode, content: ReactNode, position?: 'before' | 'after' }
-TaskDetailPanel opens as a Sheet with tabs: Properties, Subtasks, Review, Conversation, Files, Activity. Supports extraTabs?: ExtraTab[] for custom tabs.
-Supports clientMode for read-only client portal views.
+
+Shared types: Priority, Visibility, CommentAuthorType, LabelOption, Member, Column, Subtask, ReviewRequest, Comment, TaskFile, AuditLogEntry
 Priority values: 'LOW' | 'MEDIUM' | 'HIGH' | 'URGENT'
 Visibility: 'INTERNAL' | 'EVERYONE'
 
@@ -128,7 +153,7 @@ BreakRequestStatus: 'PENDING' | 'APPROVED' | 'REJECTED' | 'CANCELLED'
 
 - All components are callback-driven (emit updates via on* props, no internal state management)
 - Admin components use compound pattern with React Context (AdminDashboard.Root provides context to children)
-- Client mode: TaskDetailPanel, TaskProperties, FilesTab support readOnly + editableFields for client portal
+- Client mode: All pickers support readOnly. TaskDetailPanel (deprecated), TaskProperties, FilesTab support readOnly + editableFields for client portal. With TaskPanel v2, control client mode by choosing which pickers/tabs to render.
 - Chat supports streaming: pass isStreaming + streamingText for live AI responses
 - Board uses dnd-kit: KanbanBoard handles all drag state, emits onTaskMove with final position
 - All dates default to IST (Asia/Kolkata) timezone in admin utilities
@@ -136,7 +161,9 @@ BreakRequestStatus: 'PENDING' | 'APPROVED' | 'REJECTED' | 'CANCELLED'
 ## Common Mistakes -- DO NOT
 
 - DO NOT manage DnD state outside KanbanBoard — it handles sensors, collision detection, and sorting internally
-- DO NOT forget to pass both open AND onOpenChange to TaskDetailPanel (it's a controlled Sheet)
+- DO NOT use TaskDetailPanel for new code — use TaskPanel composition API instead
+- DO NOT forget to pass both open AND onOpenChange to TaskDetailPanel if still using the deprecated API (it's a controlled Sheet)
+- DO NOT use TaskPanel.Tab outside TaskPanel.Tabs — Tabs extracts props from Tab children
 - DO NOT use AdminDashboard sub-components outside AdminDashboard.Root — they depend on context
 - DO NOT use BreakAdmin sub-components outside BreakAdmin.Root — same compound pattern
 - DO NOT pass raw Date objects for task dates — use ISO strings (the components parse them internally)

package/package.json

@@ -1,82 +1,82 @@
-{
-  "name": "@devalok/shilp-sutra-karm",
-  "version": "0.18.1",
-  "description": "Domain components for Karm — board, tasks, chat, dashboard, client, and admin",
-  "license": "MIT",
-  "type": "module",
-  "main": "./dist/index.js",
-  "module": "./dist/index.js",
-  "types": "./dist/index.d.ts",
-  "sideEffects": [
-    "**/*.css"
-  ],
-  "exports": {
-    ".": {
-      "import": "./dist/index.js",
-      "default": "./dist/index.js",
-      "types": "./dist/index.d.ts"
-    },
-    "./board": {
-      "import": "./dist/board/index.js",
-      "default": "./dist/board/index.js",
-      "types": "./dist/board/index.d.ts"
-    },
-    "./tasks": {
-      "import": "./dist/tasks/index.js",
-      "default": "./dist/tasks/index.js",
-      "types": "./dist/tasks/index.d.ts"
-    },
-    "./chat": {
-      "import": "./dist/chat/index.js",
-      "default": "./dist/chat/index.js",
-      "types": "./dist/chat/index.d.ts"
-    },
-    "./dashboard": {
-      "import": "./dist/dashboard/index.js",
-      "default": "./dist/dashboard/index.js",
-      "types": "./dist/dashboard/index.d.ts"
-    },
-    "./client": {
-      "import": "./dist/client/index.js",
-      "default": "./dist/client/index.js",
-      "types": "./dist/client/index.d.ts"
-    },
-    "./admin": {
-      "import": "./dist/admin/index.js",
-      "default": "./dist/admin/index.js",
-      "types": "./dist/admin/index.d.ts"
-    },
-    "./docs/*": "./docs/components/*"
-  },
-  "files": [
-    "dist",
-    "docs/components",
-    "README.md",
-    "llms.txt"
-  ],
-  "scripts": {
-    "build": "vite build && node scripts/inject-use-client.mjs",
-    "typecheck": "tsc --noEmit",
-    "lint": "eslint src/",
-    "prepublishOnly": "pnpm build"
-  },
-  "peerDependencies": {
-    "@devalok/shilp-sutra": ">=0.18.0",
-    "@tabler/icons-react": "^3.0.0",
-    "framer-motion": "^12.0.0",
-    "react": "^18 || ^19",
-    "react-dom": "^18 || ^19"
-  },
-  "devDependencies": {
-    "@devalok/shilp-sutra": "workspace:*",
-    "@dnd-kit/core": "^6.3.1",
-    "@dnd-kit/sortable": "^10.0.0",
-    "@dnd-kit/utilities": "^3.2.2",
-    "class-variance-authority": "^0.7.1",
-    "clsx": "^2.1.1",
-    "date-fns": "^4.1.0",
-    "framer-motion": "^12.36.0",
-    "react-markdown": "^10.1.0",
-    "tailwind-merge": "^3.0.1"
-  }
-}
+{
+  "name": "@devalok/shilp-sutra-karm",
+  "version": "0.19.0",
+  "description": "Domain components for Karm — board, tasks, chat, dashboard, client, and admin",
+  "license": "MIT",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "default": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./board": {
+      "import": "./dist/board/index.js",
+      "default": "./dist/board/index.js",
+      "types": "./dist/board/index.d.ts"
+    },
+    "./tasks": {
+      "import": "./dist/tasks/index.js",
+      "default": "./dist/tasks/index.js",
+      "types": "./dist/tasks/index.d.ts"
+    },
+    "./chat": {
+      "import": "./dist/chat/index.js",
+      "default": "./dist/chat/index.js",
+      "types": "./dist/chat/index.d.ts"
+    },
+    "./dashboard": {
+      "import": "./dist/dashboard/index.js",
+      "default": "./dist/dashboard/index.js",
+      "types": "./dist/dashboard/index.d.ts"
+    },
+    "./client": {
+      "import": "./dist/client/index.js",
+      "default": "./dist/client/index.js",
+      "types": "./dist/client/index.d.ts"
+    },
+    "./admin": {
+      "import": "./dist/admin/index.js",
+      "default": "./dist/admin/index.js",
+      "types": "./dist/admin/index.d.ts"
+    },
+    "./docs/*": "./docs/components/*"
+  },
+  "files": [
+    "dist",
+    "docs/components",
+    "README.md",
+    "llms.txt"
+  ],
+  "scripts": {
+    "build": "vite build && node scripts/inject-use-client.mjs",
+    "typecheck": "tsc --noEmit",
+    "lint": "eslint src/",
+    "prepublishOnly": "pnpm build"
+  },
+  "peerDependencies": {
+    "@devalok/shilp-sutra": ">=0.18.0",
+    "@tabler/icons-react": "^3.0.0",
+    "framer-motion": "^12.0.0",
+    "react": "^18 || ^19",
+    "react-dom": "^18 || ^19"
+  },
+  "devDependencies": {
+    "@devalok/shilp-sutra": "workspace:*",
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "date-fns": "^4.1.0",
+    "framer-motion": "^12.36.0",
+    "react-markdown": "^10.1.0",
+    "tailwind-merge": "^3.0.1"
+  }
+}