{"_id":"@demmarl/schedule-timeline","_rev":"5-4f589ef42f74bd642e2969f94d341132","name":"@demmarl/schedule-timeline","dist-tags":{"latest":"1.2.0"},"versions":{"1.0.0":{"name":"@demmarl/schedule-timeline","version":"1.0.0","keywords":["react","schedule","timeline","calendar","component","typescript","tcmx","programming-contest","event-schedule"],"author":{"name":"DEmmaRL","email":"diegoriverajobs@gmail.com"},"license":"Apache-2.0","_id":"@demmarl/schedule-timeline@1.0.0","maintainers":[{"name":"demmarl","email":"demmarlmiau@gmail.com"}],"homepage":"https://github.com/DEmmaRL/schedule-timeline#readme","bugs":{"url":"https://github.com/DEmmaRL/schedule-timeline/issues"},"dist":{"shasum":"d344a9efb67fefce56df27db66a1ed977655b190","tarball":"https://registry.npmjs.org/@demmarl/schedule-timeline/-/schedule-timeline-1.0.0.tgz","fileCount":11,"integrity":"sha512-kemW7RLJPPcgxIM3Vj9A4qqRa+t446MFDJo6w26V2IBH2h8WBzIS5oQr63xQgSoUYbayAIYcz5EfNIcRZMATHA==","signatures":[{"sig":"MEUCIQCuX3aZzhMgw3RSnvZM1fW6ckMkwHyErGzK7Z2i3aCtzAIgW3AG1GtzuU2KxGrGw2T0+ZxUkyvzZ8RU091PKIfzDtY=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":79299},"jest":{"preset":"ts-jest","testEnvironment":"jsdom","moduleNameMapping":{"\\.(css|less|scss|sass)$":"identity-obj-proxy"},"setupFilesAfterEnv":["<rootDir>/src/setupTests.ts"]},"main":"dist/index.js","type":"module","types":"dist/index.d.ts","module":"dist/index.esm.js","gitHead":"370044fc71b172457f8f900c18f8a105de2c0026","scripts":{"dev":"rollup -c -w","lint":"eslint src --ext .ts,.tsx","test":"jest","build":"rollup -c","dev-app":"npm run build && cd dev-app && npm run dev","test:watch":"jest --watch","dev-app:build":"cd dev-app && npm run build","test:coverage":"jest --coverage","prepublishOnly":"npm run build","dev-app:install":"cd dev-app && npm install"},"_npmUser":{"name":"demmarl","email":"demmarlmiau@gmail.com"},"repository":{"url":"git+https://github.com/DEmmaRL/schedule-timeline.git","type":"git"},"_npmVersion":"10.9.2","description":"A flexible and customizable schedule timeline component for React","directories":{},"_nodeVersion":"23.8.0","dependencies":{"tslib":"^2.6.2"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.0.0","tslib":"^2.8.1","rollup":"^4.0.0","ts-jest":"^29.0.0","typescript":"^5.0.0","@types/jest":"^29.0.0","@types/react":"^18.0.0","@types/react-dom":"^18.0.0","identity-obj-proxy":"^3.0.0","@testing-library/react":"^14.0.0","jest-environment-jsdom":"^29.0.0","@rollup/plugin-commonjs":"^25.0.0","@rollup/plugin-typescript":"^11.0.0","@testing-library/jest-dom":"^6.0.0","@rollup/plugin-node-resolve":"^15.0.0","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0"},"_npmOperationalInternal":{"tmp":"tmp/schedule-timeline_1.0.0_1754927942021_0.7338898934201008","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@demmarl/schedule-timeline","version":"1.0.1","keywords":["react","schedule","timeline","calendar","component","typescript","tcmx","programming-contest","event-schedule"],"author":{"name":"DEmmaRL","email":"diegoriverajobs@gmail.com"},"license":"Apache-2.0","_id":"@demmarl/schedule-timeline@1.0.1","maintainers":[{"name":"demmarl","email":"demmarlmiau@gmail.com"}],"homepage":"https://github.com/DEmmaRL/schedule-timeline#readme","bugs":{"url":"https://github.com/DEmmaRL/schedule-timeline/issues"},"dist":{"shasum":"687012d517911229a86a0c3f02cb9fde7a111f16","tarball":"https://registry.npmjs.org/@demmarl/schedule-timeline/-/schedule-timeline-1.0.1.tgz","fileCount":11,"integrity":"sha512-kA+m0aO0tkNU1XAgNVHDOsfJe/eU9QgRndbJzrm3Z2Z4cH7blypqu/fgfwy8gxjlB56W4FksDcxENkiGM5Km5A==","signatures":[{"sig":"MEQCIDpQ62A3JV7zdE1c6odLzMFKnuSUllMuqaXhq1qR8z97AiB0a/K7zddSSzZ1Tz58By/QgZn3qQgIRAiRB//yHCklfQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":79396},"jest":{"preset":"ts-jest","testEnvironment":"jsdom","moduleNameMapping":{"\\.(css|less|scss|sass)$":"identity-obj-proxy"},"setupFilesAfterEnv":["<rootDir>/src/setupTests.ts"]},"main":"dist/index.js","type":"module","types":"dist/index.d.ts","module":"dist/index.esm.js","gitHead":"49e585f353dd8c0f90f990a4a3a6ff2ead77f8e8","scripts":{"dev":"rollup -c -w","lint":"eslint src --ext .ts,.tsx","test":"jest","build":"rollup -c","dev-app":"npm run build && cd dev-app && npm run dev","test:watch":"jest --watch","dev-app:build":"cd dev-app && npm run build","test:coverage":"jest --coverage","prepublishOnly":"npm run build","dev-app:install":"cd dev-app && npm install"},"_npmUser":{"name":"demmarl","email":"demmarlmiau@gmail.com"},"repository":{"url":"git+https://github.com/DEmmaRL/schedule-timeline.git","type":"git"},"_npmVersion":"10.9.2","description":"A flexible and customizable schedule timeline component for React","directories":{},"_nodeVersion":"23.8.0","dependencies":{"tslib":"^2.6.2"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.0.0","tslib":"^2.8.1","rollup":"^4.0.0","ts-jest":"^29.0.0","typescript":"^5.0.0","@types/jest":"^29.0.0","@types/react":"^18.0.0","@types/react-dom":"^18.0.0","identity-obj-proxy":"^3.0.0","@testing-library/react":"^14.0.0","jest-environment-jsdom":"^29.0.0","@rollup/plugin-commonjs":"^25.0.0","@rollup/plugin-typescript":"^11.0.0","@testing-library/jest-dom":"^6.0.0","@rollup/plugin-node-resolve":"^15.0.0","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0"},"_npmOperationalInternal":{"tmp":"tmp/schedule-timeline_1.0.1_1755113052022_0.622913201417362","host":"s3://npm-registry-packages-npm-production"}},"1.2.0":{"name":"@demmarl/schedule-timeline","version":"1.2.0","description":"A flexible and customizable schedule timeline component for React","type":"module","main":"dist/index.js","module":"dist/index.esm.js","types":"dist/index.d.ts","scripts":{"build":"rollup -c","dev":"rollup -c -w","test":"jest","test:watch":"jest --watch","test:coverage":"jest --coverage","lint":"eslint src --ext .ts,.tsx","prepublishOnly":"npm run build","dev-app":"npm run build && cd dev-app && npm run dev","dev-app:install":"cd dev-app && npm install","dev-app:build":"cd dev-app && npm run build"},"keywords":["react","schedule","timeline","calendar","component","typescript","tcmx","programming-contest","event-schedule"],"author":{"name":"DEmmaRL","email":"diegoriverajobs@gmail.com"},"license":"Apache-2.0","dependencies":{"tslib":"^2.6.2"},"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0"},"devDependencies":{"@rollup/plugin-commonjs":"^25.0.0","@rollup/plugin-node-resolve":"^15.0.0","@rollup/plugin-typescript":"^11.0.0","@testing-library/jest-dom":"^6.0.0","@testing-library/react":"^14.0.0","@types/jest":"^29.0.0","@types/react":"^18.0.0","@types/react-dom":"^18.0.0","identity-obj-proxy":"^3.0.0","jest":"^29.0.0","jest-environment-jsdom":"^29.0.0","rollup":"^4.0.0","rollup-plugin-peer-deps-external":"^2.2.4","ts-jest":"^29.0.0","tslib":"^2.8.1","typescript":"^5.0.0"},"jest":{"preset":"ts-jest","testEnvironment":"jsdom","setupFilesAfterEnv":["<rootDir>/src/setupTests.ts"],"moduleNameMapping":{"\\.(css|less|scss|sass)$":"identity-obj-proxy"}},"repository":{"type":"git","url":"git+https://github.com/DEmmaRL/schedule-timeline.git"},"bugs":{"url":"https://github.com/DEmmaRL/schedule-timeline/issues"},"homepage":"https://github.com/DEmmaRL/schedule-timeline#readme","_id":"@demmarl/schedule-timeline@1.2.0","gitHead":"d84117f68c2e79002ece4b2a2fa8594fbd5286cd","_nodeVersion":"23.8.0","_npmVersion":"10.9.2","dist":{"integrity":"sha512-nhLvH7j/UckVNSn0VOEUk8I99dRNj4j87ILgCE4Yg4nRR6n17g8muXBhHJBwUnSJn7m11ITq0Yloi2MRaJUP/Q==","shasum":"49ae795c11268ee153829d86205c41bdd7d97e65","tarball":"https://registry.npmjs.org/@demmarl/schedule-timeline/-/schedule-timeline-1.2.0.tgz","fileCount":16,"unpackedSize":155112,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQCWUk0baDxCd1TSVn5Nr6equUNgleC2S2JQykbBfH5a0gIgIqripUXu9FLHSrrC/4znnW9fRxUNBrri2XRt4eZH++I="}]},"_npmUser":{"name":"demmarl","email":"demmarlmiau@gmail.com"},"directories":{},"maintainers":[{"name":"demmarl","email":"demmarlmiau@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/schedule-timeline_1.2.0_1755130108391_0.8033328178095689"},"_hasShrinkwrap":false}},"time":{"created":"2025-08-11T15:59:01.962Z","modified":"2025-08-14T00:08:28.829Z","1.0.0":"2025-08-11T15:59:02.191Z","1.0.1":"2025-08-13T19:24:12.240Z","1.1.0":"2025-08-13T22:34:33.737Z","1.2.0":"2025-08-14T00:08:28.599Z"},"bugs":{"url":"https://github.com/DEmmaRL/schedule-timeline/issues"},"author":{"name":"DEmmaRL","email":"diegoriverajobs@gmail.com"},"license":"Apache-2.0","homepage":"https://github.com/DEmmaRL/schedule-timeline#readme","keywords":["react","schedule","timeline","calendar","component","typescript","tcmx","programming-contest","event-schedule"],"repository":{"type":"git","url":"git+https://github.com/DEmmaRL/schedule-timeline.git"},"description":"A flexible and customizable schedule timeline component for React","maintainers":[{"name":"demmarl","email":"demmarlmiau@gmail.com"}],"readme":"# Schedule Timeline Component\n\nA flexible and customizable schedule timeline component for React applications. Perfect for displaying event schedules, daily agendas, conference programs, and more.\n\nOriginally created for and inspired by the ICPC TCMX 2025, this component has been generalized to work with any type of schedule or timeline.\n\n## Features\n\n- 📅 **Flexible scheduling**: Support for multi-day schedules with customizable time ranges\n- 🎨 **Customizable themes**: Built-in color themes and support for custom styling\n- 📱 **Responsive design**: Works great on desktop and mobile devices\n- ⚡ **TypeScript support**: Full TypeScript support with comprehensive type definitions\n- 🎯 **Interactive**: Click and hover event handlers for activities\n- 🔧 **Highly configurable**: Extensive configuration options for different use cases\n- 🗄️ **Database integration**: Built-in support for loading/saving schedule data\n- 📋 **ICS support**: Import and export standard calendar files (.ics)\n- 🔄 **Auto-save**: Automatic data persistence with configurable intervals\n- ✏️ **Editable**: Built-in editing capabilities with the ScheduleManager component\n\n## Demo\n\nhttps://github.com/user-attachments/assets/d6bd78c7-2878-47b9-9845-8cf1dfd55f81\n\n## Quick Start\n\n### Installation\n\n```bash\nnpm install @demmarl/schedule-timeline\n```\n\n### Basic Usage\n\n```tsx\nimport React from 'react';\nimport { ScheduleTimeline, Event } from '@demmarl/schedule-timeline';\n\nconst MySchedule = () => {\n  // Simple array of events - can come from anywhere (API, database, file, etc.)\n  const events: Event[] = [\n    {\n      id: 1,\n      title: 'Opening Ceremony',\n      startTime: '09:00',\n      endTime: '10:00',\n      date: '2024-03-21',\n      type: 'opening',\n      description: 'Welcome and event presentation',\n    },\n    {\n      id: 2,\n      title: 'Workshop Session',\n      startTime: '10:00',\n      endTime: '12:00',\n      date: '2024-03-21',\n      type: 'theory',\n    },\n    {\n      id: 3,\n      title: 'Lunch Break',\n      startTime: '12:00',\n      endTime: '13:00',\n      date: '2024-03-21',\n      type: 'break',\n    },\n    {\n      id: 4,\n      title: 'Competition',\n      startTime: '09:00',\n      endTime: '14:00',\n      date: '2024-03-22',\n      type: 'contest',\n    },\n  ];\n\n  return (\n    <ScheduleTimeline\n      events={events}\n      onEventClick={(event) => {\n        console.log('Clicked:', event.title);\n      }}\n    />\n  );\n};\n```\n\n### Loading Events from API/Database\n\n```tsx\nimport React from 'react';\nimport { ScheduleTimeline, Event } from '@demmarl/schedule-timeline';\n\nconst ApiSchedule = () => {\n  const [events, setEvents] = React.useState<Event[]>([]);\n\n  React.useEffect(() => {\n    const loadEvents = async () => {\n      // Load from your API/database\n      const response = await fetch('/api/events');\n      const data = await response.json();\n      \n      // Convert your data format to Event[]\n      const formattedEvents: Event[] = data.map((item: any) => ({\n        id: item.id,\n        title: item.name,\n        startTime: item.start_time,\n        endTime: item.end_time,\n        date: item.event_date,\n        type: item.category,\n        description: item.details,\n      }));\n      \n      setEvents(formattedEvents);\n    };\n\n    loadEvents();\n  }, []);\n\n  return (\n    <ScheduleTimeline\n      events={events}\n      onEventClick={(event) => {\n        // Handle event clicks - open modal, navigate, etc.\n        console.log('Event clicked:', event);\n      }}\n    />\n  );\n};\n```\n\n### Using Helper Functions\n\n```tsx\nimport { ScheduleTimeline, createEvent, createDayEvents } from '@demmarl/schedule-timeline';\n\nconst HelperExample = () => {\n  const events = [\n    // Create individual events\n    createEvent('Registration', '08:00', '09:00', '2024-03-21', {\n      type: 'registration',\n      description: 'Participant registration'\n    }),\n    \n    // Create multiple events for the same day\n    ...createDayEvents('2024-03-21', [\n      {\n        title: 'Keynote',\n        startTime: '09:00',\n        endTime: '10:00',\n        type: 'opening',\n      },\n      {\n        title: 'Workshop',\n        startTime: '10:30',\n        endTime: '12:00',\n        type: 'theory',\n      },\n    ]),\n  ];\n\n  return <ScheduleTimeline events={events} />;\n};\n```\n\n## Development & Testing\n\n### Interactive Development App\n\nThis project includes a development app for testing and visualizing the component:\n\n```bash\n# Option 1: Using the convenience script\n./dev.sh\n\n# Option 2: Manual steps\nnpm run build           # Build the library\ncd dev-app && npm install && npm run dev\n\n# Option 3: Using npm scripts\nnpm run dev-app         # Builds library and starts dev-app\n```\n\nOpen `http://localhost:5173/` to see interactive examples with:\n- Multiple schedule configurations\n- Different themes and styling options\n- Interactive event handlers\n- Custom renderers\n\n### Development Workflow\n\nWhen making changes to the library:\n\n1. **Edit source files** in `src/`\n2. **Rebuild the library**: `npm run build`\n3. **Dev-app updates automatically** (thanks to Vite's hot reload)\n\n### Running Tests\n\n```bash\nnpm test              # Run tests\nnpm run test:coverage # Run tests with coverage\nnpm run test:watch    # Run tests in watch mode\n```\n\n## Working with Your Data\n\nThe beauty of this approach is that you can use **any data source** and **any data format**. Just convert your data to the simple `Event[]` format:\n\n### From Database\n\n```tsx\n// Your database might return data like this:\nconst dbData = [\n  { id: 1, name: 'Meeting', start: '09:00', end: '10:00', day: '2024-03-21', category: 'work' },\n  { id: 2, name: 'Lunch', start: '12:00', end: '13:00', day: '2024-03-21', category: 'break' },\n];\n\n// Convert to Event[] format:\nconst events: Event[] = dbData.map(item => ({\n  id: item.id,\n  title: item.name,\n  startTime: item.start,\n  endTime: item.end,\n  date: item.day,\n  type: item.category,\n}));\n\n<ScheduleTimeline events={events} />\n```\n\n### From API Response\n\n```tsx\nconst loadEvents = async () => {\n  const response = await fetch('/api/schedule');\n  const apiData = await response.json();\n  \n  // Convert whatever format your API returns:\n  const events = apiData.schedule.map(item => ({\n    id: item.eventId,\n    title: item.eventName,\n    startTime: item.startHour,\n    endTime: item.endHour,\n    date: item.eventDate,\n    type: item.eventType,\n    description: item.notes,\n  }));\n  \n  setEvents(events);\n};\n```\n\n### Saving Changes\n\n```tsx\nconst handleEventClick = async (event: Event) => {\n  // Edit the event however you want\n  const updatedEvent = { ...event, title: 'Updated Title' };\n  \n  // Update your local state\n  setEvents(prev => prev.map(e => e.id === event.id ? updatedEvent : e));\n  \n  // Save to your backend in whatever format you need\n  await fetch('/api/events/' + event.id, {\n    method: 'PUT',\n    body: JSON.stringify({\n      name: updatedEvent.title,\n      start_time: updatedEvent.startTime,\n      end_time: updatedEvent.endTime,\n      // ... your format\n    }),\n  });\n};\n```\n\n## ICS Standard Support\n\nThe library includes built-in support for the ICS (iCalendar) standard, making it easy to import/export calendar data that works with Google Calendar, Outlook, Apple Calendar, and more.\n\n### Export to ICS\n\n```tsx\nimport { downloadICS, eventsToICS } from '@demmarl/schedule-timeline';\n\nconst MySchedule = () => {\n  const events = [/* your events */];\n\n  const exportToCalendar = () => {\n    // Download as .ics file\n    downloadICS(events, 'my-schedule.ics', 'My Event Schedule');\n  };\n\n  const getICSContent = () => {\n    // Get ICS content as string (for API calls, etc.)\n    const icsContent = eventsToICS(events, 'My Calendar');\n    return icsContent;\n  };\n\n  return (\n    <div>\n      <ScheduleTimeline events={events} />\n      <button onClick={exportToCalendar}>\n        Add to Calendar\n      </button>\n    </div>\n  );\n};\n```\n\n### Import from ICS\n\n```tsx\nimport { loadICSFile, icsToEvents } from '@demmarl/schedule-timeline';\n\nconst ImportExample = () => {\n  const [events, setEvents] = useState([]);\n\n  const handleFileImport = async (event) => {\n    const file = event.target.files[0];\n    if (file) {\n      try {\n        const importedEvents = await loadICSFile(file);\n        setEvents(prev => [...prev, ...importedEvents]);\n      } catch (error) {\n        console.error('Import failed:', error);\n      }\n    }\n  };\n\n  const handleICSContent = (icsContent: string) => {\n    // Parse ICS content from API, clipboard, etc.\n    const events = icsToEvents(icsContent);\n    setEvents(events);\n  };\n\n  return (\n    <div>\n      <input type=\"file\" accept=\".ics\" onChange={handleFileImport} />\n      <ScheduleTimeline events={events} />\n    </div>\n  );\n};\n```\n\n## Advanced Configuration\n\n```tsx\nimport { ScheduleTimeline, colorThemes } from '@demmarl/schedule-timeline';\n\nconst AdvancedSchedule = () => {\n  const config = {\n    startHour: 8,\n    endHour: 20,\n    pixelsPerMinute: 3,\n    showTimeMarkers: true,\n    timeMarkerInterval: 30, // Every 30 minutes\n  };\n\n  const customTheme = {\n    ...colorThemes.minimal,\n    workshop: { background: 'bg-indigo-200', text: 'text-indigo-900' },\n    networking: { background: 'bg-emerald-200', text: 'text-emerald-900' },\n  };\n\n  return (\n    <ScheduleTimeline\n      schedule={schedule}\n      config={config}\n      colorTheme={customTheme}\n      className=\"my-custom-timeline\"\n      onActivityClick={handleActivityClick}\n      onActivityHover={handleActivityHover}\n    />\n  );\n};\n```\n\n## Custom Activity Renderer\n\n```tsx\nconst CustomSchedule = () => {\n  const customRenderer = (activity, style) => (\n    <div className=\"custom-activity\" style={style}>\n      <div className=\"activity-icon\">🎯</div>\n      <div className=\"activity-content\">\n        <h4>{activity.title}</h4>\n        <p>{activity.description}</p>\n      </div>\n    </div>\n  );\n\n  return (\n    <ScheduleTimeline\n      schedule={schedule}\n      customActivityRenderer={customRenderer}\n    />\n  );\n};\n```\n\n## API Reference\n//TODO\n### ScheduleTimelineProps\n\n| Prop | Type | Default | Description |\n|------|------|---------|-------------|\n| `schedule` | `DaySchedule[]` | **required** | Array of day schedules |\n| `config` | `TimelineConfig` | `{}` | Timeline configuration options |\n| `colorTheme` | `ColorTheme` | `defaultTheme` | Color theme for activities |\n| `className` | `string` | `''` | Additional CSS classes |\n| `onActivityClick` | `(activity, dayIndex) => void` | `undefined` | Click handler for activities |\n| `onActivityHover` | `(activity, dayIndex) => void` | `undefined` | Hover handler for activities |\n| `customActivityRenderer` | `(activity, style) => ReactNode` | `undefined` | Custom activity renderer |\n| `showHeader` | `boolean` | `true` | Show day headers |\n| `headerClassName` | `string` | `''` | Additional CSS classes for headers |\n| `activityClassName` | `string` | `''` | Additional CSS classes for activities |\n\n### TimelineConfig\n\n| Property | Type | Default | Description |\n|----------|------|---------|-------------|\n| `startHour` | `number` | `8` | Start hour (24-hour format) |\n| `endHour` | `number` | `19.5` | End hour (supports decimals) |\n| `pixelsPerMinute` | `number` | `2.2` | Vertical scaling factor |\n| `showTimeMarkers` | `boolean` | `true` | Show time markers on the left |\n| `timeMarkerInterval` | `number` | `60` | Interval between time markers (minutes) |\n| `responsive` | `boolean` | `true` | Enable responsive design |\n\n### Activity\n\n| Property | Type | Required | Description |\n|----------|------|----------|-------------|\n| `time` | `string` | ✅ | Time range (e.g., \"9:00 - 10:00\") |\n| `title` | `string` | ✅ | Activity title |\n| `type` | `string` | ❌ | Activity type for theming |\n| `id` | `string \\| number` | ❌ | Unique identifier |\n| `description` | `string` | ❌ | Additional description |\n| `color` | `string` | ❌ | Custom background color |\n| `textColor` | `string` | ❌ | Custom text color |\n\n## Built-in Themes\n\n- `colorThemes.default` - Colorful theme with distinct colors for different activity types\n- `colorThemes.minimal` - Clean, minimal theme with subtle colors\n- `colorThemes.dark` - Dark theme for dark mode interfaces\n\n## Styling\n\nThe component uses Tailwind CSS classes by default, but you can override styles using:\n\n1. **Custom CSS classes**: Pass `className`, `headerClassName`, or `activityClassName`\n2. **Custom themes**: Define your own `ColorTheme` object\n3. **Inline colors**: Set `color` and `textColor` on individual activities\n4. **Custom renderer**: Use `customActivityRenderer` for complete control\n\n## License\n\nApache-2.0\n\n## Contributing\n\nContributions are welcome! Please feel free to submit a Pull Request.\n","readmeFilename":"README.md"}