@object-ui/plugin-gantt 0.3.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 ObjectQL
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,260 @@
+# @object-ui/plugin-gantt
+
+Gantt chart plugin for Object UI - Visualize project timelines and task dependencies.
+
+## Features
+
+- **Gantt Charts** - Interactive Gantt chart visualization
+- **Task Dependencies** - Link tasks with dependencies
+- **Timeline View** - Visualize project schedules
+- **Task Management** - Create, edit, and track tasks
+- **Responsive** - Scrollable timeline for large projects
+- **Customizable** - Tailwind CSS styling support
+
+## Installation
+
+```bash
+pnpm add @object-ui/plugin-gantt
+```
+
+## Usage
+
+### Automatic Registration (Side-Effect Import)
+
+```typescript
+// In your app entry point (e.g., App.tsx or main.tsx)
+import '@object-ui/plugin-gantt';
+
+// Now you can use gantt types in your schemas
+const schema = {
+  type: 'gantt',
+  tasks: [
+    {
+      id: '1',
+      name: 'Project Setup',
+      start: '2024-01-01',
+      end: '2024-01-05',
+      progress: 100
+    }
+  ]
+};
+```
+
+### Manual Registration
+
+```typescript
+import { ganttComponents } from '@object-ui/plugin-gantt';
+import { ComponentRegistry } from '@object-ui/core';
+
+// Register gantt components
+Object.entries(ganttComponents).forEach(([type, component]) => {
+  ComponentRegistry.register(type, component);
+});
+```
+
+## Schema API
+
+### Gantt Chart
+
+Display project timeline with tasks:
+
+```typescript
+{
+  type: 'gantt',
+  tasks: GanttTask[],
+  viewMode?: 'day' | 'week' | 'month',
+  onTaskClick?: (task) => void,
+  onTaskUpdate?: (task) => void,
+  className?: string
+}
+```
+
+### Task Structure
+
+```typescript
+interface GanttTask {
+  id: string;
+  name: string;
+  start: string;                  // ISO date string
+  end: string;                    // ISO date string
+  progress: number;               // 0-100
+  dependencies?: string[];         // Task IDs
+  assignee?: string;
+  color?: string;                 // Tailwind color class
+}
+```
+
+## Examples
+
+### Basic Gantt Chart
+
+```typescript
+const schema = {
+  type: 'gantt',
+  viewMode: 'week',
+  tasks: [
+    {
+      id: '1',
+      name: 'Project Planning',
+      start: '2024-01-01',
+      end: '2024-01-07',
+      progress: 100,
+      color: 'bg-blue-500'
+    },
+    {
+      id: '2',
+      name: 'Design Phase',
+      start: '2024-01-08',
+      end: '2024-01-21',
+      progress: 75,
+      dependencies: ['1'],
+      color: 'bg-purple-500'
+    },
+    {
+      id: '3',
+      name: 'Development',
+      start: '2024-01-22',
+      end: '2024-02-15',
+      progress: 30,
+      dependencies: ['2'],
+      color: 'bg-green-500'
+    },
+    {
+      id: '4',
+      name: 'Testing',
+      start: '2024-02-16',
+      end: '2024-02-28',
+      progress: 0,
+      dependencies: ['3'],
+      color: 'bg-orange-500'
+    }
+  ]
+};
+```
+
+### Interactive Gantt
+
+```typescript
+const schema = {
+  type: 'gantt',
+  tasks: [/* tasks */],
+  onTaskClick: (task) => {
+    console.log('Task clicked:', task);
+    // Show task details
+  },
+  onTaskUpdate: (updatedTask) => {
+    console.log('Task updated:', updatedTask);
+    // Save changes to backend
+  }
+};
+```
+
+### With ObjectQL Integration
+
+```typescript
+const schema = {
+  type: 'object-gantt',
+  object: 'project_tasks',
+  nameField: 'name',
+  startField: 'start_date',
+  endField: 'end_date',
+  progressField: 'completion_percentage',
+  dependenciesField: 'dependent_task_ids'
+};
+```
+
+## View Modes
+
+The Gantt chart supports different time scales:
+
+- **day** - Day-by-day view
+- **week** - Week-by-week view
+- **month** - Month-by-month view
+
+```typescript
+const schema = {
+  type: 'gantt',
+  viewMode: 'month',
+  tasks: [/* tasks */]
+};
+```
+
+## Task Dependencies
+
+Link tasks to show dependencies:
+
+```typescript
+const tasks = [
+  {
+    id: 'task-1',
+    name: 'Foundation',
+    start: '2024-01-01',
+    end: '2024-01-10',
+    progress: 100
+  },
+  {
+    id: 'task-2',
+    name: 'Building',
+    start: '2024-01-11',
+    end: '2024-01-25',
+    progress: 50,
+    dependencies: ['task-1']  // Depends on task-1
+  },
+  {
+    id: 'task-3',
+    name: 'Finishing',
+    start: '2024-01-26',
+    end: '2024-02-05',
+    progress: 0,
+    dependencies: ['task-2']  // Depends on task-2
+  }
+];
+```
+
+## Integration with Data Sources
+
+```typescript
+import { createObjectStackAdapter } from '@object-ui/data-objectstack';
+
+const dataSource = createObjectStackAdapter({
+  baseUrl: 'https://api.example.com',
+  token: 'your-auth-token'
+});
+
+const schema = {
+  type: 'object-gantt',
+  dataSource,
+  object: 'tasks',
+  fields: {
+    name: 'task_name',
+    start: 'start_date',
+    end: 'end_date',
+    progress: 'progress_percent'
+  }
+};
+```
+
+## TypeScript Support
+
+```typescript
+import type { GanttSchema, GanttTask } from '@object-ui/plugin-gantt';
+
+const task: GanttTask = {
+  id: '1',
+  name: 'My Task',
+  start: '2024-01-01',
+  end: '2024-01-10',
+  progress: 50,
+  dependencies: []
+};
+
+const gantt: GanttSchema = {
+  type: 'gantt',
+  viewMode: 'week',
+  tasks: [task]
+};
+```
+
+## License
+
+MIT

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export * from './src/index'
+export {}