@memberjunction/ng-tasks 2.105.0

package/.turbo/turbo-build.log

@@ -0,0 +1,4 @@
+
+> @memberjunction/ng-tasks@2.105.0 build
+> ngc
+

package/CHANGELOG.md

@@ -0,0 +1,10 @@
+# @memberjunction/ng-tasks
+
+## 2.105.0
+
+### Patch Changes
+
+- Updated dependencies [4807f35]
+- Updated dependencies [9b67e0c]
+  - @memberjunction/core-entities@2.105.0
+  - @memberjunction/core@2.105.0

package/README.md

@@ -0,0 +1,233 @@
+# @memberjunction/ng-tasks
+
+Angular components for task visualization and management with Gantt chart support.
+
+## Features
+
+- 📋 **Simple List View** - Clean hierarchical task list with indentation for subtasks
+- 📊 **Gantt Chart View** - Timeline visualization using Frappe Gantt
+- 🔄 **View Toggle** - Easy switching between list and Gantt views
+- 🎨 **Clean Design** - Modern, minimal UI that matches MemberJunction aesthetics
+- 📦 **Standalone Components** - Can be used independently or together
+- 🔗 **Dependency Support** - Visualizes task dependencies and relationships
+
+## Installation
+
+This package is part of the MemberJunction monorepo. Install from the repository root:
+
+```bash
+npm install
+```
+
+## Components
+
+### TaskComponent
+
+Main component that composes SimpleTaskViewer and GanttTaskViewer with view toggle.
+
+```typescript
+import { TaskComponent } from '@memberjunction/ng-tasks';
+
+@Component({
+  template: `
+    <mj-task
+      [tasks]="myTasks"
+      [title]="'Project Tasks'"
+      [description]="'Tasks for the current project'"
+      [viewMode]="'simple'"
+      (taskClicked)="onTaskClick($event)"
+      (viewModeChanged)="onViewModeChange($event)">
+    </mj-task>
+  `
+})
+export class MyComponent {
+  myTasks: TaskEntity[] = [...];
+
+  onTaskClick(task: TaskEntity) {
+    console.log('Task clicked:', task);
+  }
+
+  onViewModeChange(mode: TaskViewMode) {
+    console.log('View mode changed to:', mode);
+  }
+}
+```
+
+**Inputs:**
+- `tasks: TaskEntity[]` - Array of tasks to display
+- `title?: string` - Optional header title
+- `description?: string` - Optional header description
+- `showHeader: boolean` - Whether to show the header (default: true)
+- `viewMode: TaskViewMode` - Initial view mode: 'simple' or 'gantt' (default: 'simple')
+
+**Outputs:**
+- `taskClicked: EventEmitter<TaskEntity>` - Emitted when a task is clicked
+- `viewModeChanged: EventEmitter<TaskViewMode>` - Emitted when view mode changes
+
+### SimpleTaskViewerComponent
+
+Displays tasks in a clean, hierarchical list format.
+
+```typescript
+import { SimpleTaskViewerComponent } from '@memberjunction/ng-tasks';
+
+@Component({
+  template: `
+    <mj-simple-task-viewer
+      [tasks]="myTasks"
+      (taskClicked)="onTaskClick($event)">
+    </mj-simple-task-viewer>
+  `
+})
+export class MyComponent {
+  myTasks: TaskEntity[] = [...];
+}
+```
+
+**Features:**
+- Hierarchical display with indentation
+- Expand/collapse for tasks with subtasks
+- Status icons with color coding
+- Due dates and assignee information
+- Click to interact with tasks
+
+### GanttTaskViewerComponent
+
+Displays tasks in a Gantt chart timeline using Frappe Gantt.
+
+```typescript
+import { GanttTaskViewerComponent } from '@memberjunction/ng-tasks';
+
+@Component({
+  template: `
+    <mj-gantt-task-viewer
+      [tasks]="myTasks"
+      (taskClicked)="onTaskClick($event)">
+    </mj-gantt-task-viewer>
+  `
+})
+export class MyComponent {
+  myTasks: TaskEntity[] = [...];
+}
+```
+
+**Features:**
+- Timeline-based visualization
+- Task dependencies with arrows
+- Progress indicators
+- Interactive task bars
+- Hover tooltips with task details
+- Multiple view modes (Day, Week, Month)
+
+## Task Data Structure
+
+Tasks must be `TaskEntity` objects from `@memberjunction/core-entities`. Key fields:
+
+```typescript
+interface TaskEntity {
+  ID: string;
+  Title: string;
+  Description?: string;
+  Status: 'Pending' | 'In Progress' | 'Complete';
+  StartDate?: Date;
+  DueDate?: Date;
+  DependsOnTaskID?: string;  // For task dependencies
+  AssignedTo?: string;
+  // ... other MJ entity fields
+}
+```
+
+## Task Dependencies
+
+Tasks can have dependencies using the `DependsOnTaskID` field:
+
+```typescript
+const tasks = [
+  {
+    ID: 'task-1',
+    Title: 'Design Database Schema',
+    Status: 'Complete',
+    StartDate: new Date('2025-01-01'),
+    DueDate: new Date('2025-01-05')
+  },
+  {
+    ID: 'task-2',
+    Title: 'Implement Backend API',
+    Status: 'In Progress',
+    StartDate: new Date('2025-01-06'),
+    DueDate: new Date('2025-01-15'),
+    DependsOnTaskID: 'task-1'  // Depends on task-1
+  },
+  {
+    ID: 'task-3',
+    Title: 'Build Frontend UI',
+    Status: 'Pending',
+    StartDate: new Date('2025-01-16'),
+    DueDate: new Date('2025-01-25'),
+    DependsOnTaskID: 'task-2'  // Depends on task-2
+  }
+];
+```
+
+In **Simple View**, dependent tasks are indented under their parent tasks.
+In **Gantt View**, dependency arrows connect the tasks.
+
+## Styling
+
+The components use a clean, modern design that matches MemberJunction's aesthetic:
+
+- **Colors:** Blue (#3B82F6) for primary actions, gray scale for text
+- **Typography:** System fonts with consistent sizing
+- **Spacing:** Comfortable padding and margins
+- **Icons:** Font Awesome icons throughout
+
+You can customize styles by targeting the component classes or using Angular's view encapsulation.
+
+## Integration with Conversations
+
+The ng-tasks package is designed to work seamlessly with the conversations package:
+
+```typescript
+import { TaskComponent } from '@memberjunction/ng-tasks';
+
+@Component({
+  selector: 'mj-tasks-full-view',
+  imports: [TaskComponent],
+  template: `
+    <mj-task
+      [tasks]="allTasks"
+      [title]="'All Tasks'"
+      [viewMode]="'simple'"
+      (taskClicked)="navigateToTask($event)">
+    </mj-task>
+  `
+})
+export class TasksFullViewComponent {
+  // ... component implementation
+}
+```
+
+## Browser Support
+
+- Chrome/Edge (latest)
+- Firefox (latest)
+- Safari (latest)
+
+## Dependencies
+
+- **Angular:** ^18.0.0
+- **Frappe Gantt:** ^0.6.1 (for Gantt view)
+- **@memberjunction/core:** ^2.104.0
+- **@memberjunction/core-entities:** ^2.104.0
+
+## License
+
+MIT
+
+## Contributing
+
+This package is part of the MemberJunction open-source project. Contributions are welcome!
+
+## Support
+
+For issues or questions, please file an issue on the [MemberJunction GitHub repository](https://github.com/MemberJunction/MJ).

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export * from './public-api';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/index.js

@@ -0,0 +1,2 @@
+export * from './public-api';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/lib/components/gantt-task-viewer.component.d.ts

@@ -0,0 +1,44 @@
+import { EventEmitter, OnChanges, AfterViewInit, ElementRef, OnDestroy } from '@angular/core';
+import { TaskEntity, TaskDependencyEntity } from '@memberjunction/core-entities';
+import * as i0 from "@angular/core";
+/**
+ * Gantt chart view for tasks using DHTMLX Gantt
+ */
+export declare class GanttTaskViewerComponent implements OnChanges, AfterViewInit, OnDestroy {
+    tasks: TaskEntity[];
+    taskDependencies: TaskDependencyEntity[];
+    agentRunMap?: Map<string, string>;
+    taskClicked: EventEmitter<TaskEntity>;
+    openEntityRecord: EventEmitter<{
+        entityName: string;
+        recordId: string;
+    }>;
+    ganttContainer: ElementRef<HTMLDivElement>;
+    selectedTask: TaskEntity | null;
+    detailPanelWidth: number;
+    private ganttInitialized;
+    private isResizing;
+    private resizeStartX;
+    private resizeStartWidth;
+    ngAfterViewInit(): void;
+    ngOnChanges(): void;
+    ngOnDestroy(): void;
+    private initGantt;
+    private updateGanttData;
+    private convertToGanttFormat;
+    private calculateDuration;
+    private formatDateForDHTMLX;
+    getAgentRunId(task: TaskEntity): string | null;
+    closeDetailPanel(): void;
+    onOpenEntityRecord(event: {
+        entityName: string;
+        recordId: string;
+    }): void;
+    startResize(event: MouseEvent): void;
+    handleResize(event: MouseEvent): void;
+    stopResize(): void;
+    private expandAllAndSelectRoot;
+    static ɵfac: i0.ɵɵFactoryDeclaration<GanttTaskViewerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GanttTaskViewerComponent, "mj-gantt-task-viewer", never, { "tasks": { "alias": "tasks"; "required": false; }; "taskDependencies": { "alias": "taskDependencies"; "required": false; }; "agentRunMap": { "alias": "agentRunMap"; "required": false; }; }, { "taskClicked": "taskClicked"; "openEntityRecord": "openEntityRecord"; }, never, never, true, never>;
+}
+//# sourceMappingURL=gantt-task-viewer.component.d.ts.map

package/dist/lib/components/gantt-task-viewer.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"gantt-task-viewer.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/gantt-task-viewer.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,UAAU,EAAa,SAAS,EAAgB,MAAM,eAAe,CAAC;AAEjJ,OAAO,EAAE,UAAU,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;;AAIjF;;GAEG;AACH,qBAwGa,wBAAyB,YAAW,SAAS,EAAE,aAAa,EAAE,SAAS;IACzE,KAAK,EAAE,UAAU,EAAE,CAAM;IACzB,gBAAgB,EAAE,oBAAoB,EAAE,CAAM;IAC9C,WAAW,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACjC,WAAW,2BAAkC;IAC7C,gBAAgB;oBAAkC,MAAM;kBAAY,MAAM;OAAM;IAE1C,cAAc,EAAG,UAAU,CAAC,cAAc,CAAC,CAAC;IAErF,YAAY,EAAE,UAAU,GAAG,IAAI,CAAQ;IACvC,gBAAgB,EAAE,MAAM,CAAO;IAEtC,OAAO,CAAC,gBAAgB,CAAS;IACjC,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,YAAY,CAAK;IACzB,OAAO,CAAC,gBAAgB,CAAK;IAE7B,eAAe;IAWf,WAAW;IAgBX,WAAW;IAOX,OAAO,CAAC,SAAS;IAgFjB,OAAO,CAAC,eAAe;IAgCvB,OAAO,CAAC,oBAAoB;IA6J5B,OAAO,CAAC,iBAAiB;IASzB,OAAO,CAAC,mBAAmB;IAOpB,aAAa,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,GAAG,IAAI;IAI9C,gBAAgB,IAAI,IAAI;IAIxB,kBAAkB,CAAC,KAAK,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI;IAIzE,WAAW,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI;IAQ3C,YAAY,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI;IAWrC,UAAU,IAAI,IAAI;IAYlB,OAAO,CAAC,sBAAsB;yCA3XnB,wBAAwB;2CAAxB,wBAAwB;CA0ZpC"}