{"_id":"vue-apexgantt","_rev":"4-b15b6a49870a89f88bed92dc0ad16094","name":"vue-apexgantt","dist-tags":{"latest":"1.1.2"},"versions":{"1.0.0":{"name":"vue-apexgantt","version":"1.0.0","keywords":["vue","vue3","gantt","gantt-chart","apexgantt","timeline","project-management"],"author":"","_id":"vue-apexgantt@1.0.0","maintainers":[{"name":"junedchhipa","email":"info@apexcharts.com"}],"dist":{"shasum":"f93b393052c9e660e7c739047a22e6ce7d826702","tarball":"https://registry.npmjs.org/vue-apexgantt/-/vue-apexgantt-1.0.0.tgz","fileCount":9,"integrity":"sha512-EChJ/VTbl/yAS+lh3W2GaJyxJyzYCxwYZDWjJezrQny0wbPndBgmDDnIVTSm+UsE4NpbponbxfXnLq67GmoQ5w==","signatures":[{"sig":"MEUCIEkdUlVzh4F5+olbclQCM3f1Sgjx0Zt1+7R+5p7LqyuuAiEAhZmmSDzBVSCk6tsIJ7bKRQGmf9ydCivqIDWVELTEWcE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":23313},"main":"./dist/vue-apexgantt.umd.js","type":"module","types":"./dist/index.d.ts","module":"./dist/vue-apexgantt.es.js","exports":{".":{"import":{"types":"./dist/index.d.ts","default":"./dist/vue-apexgantt.es.js"},"require":{"types":"./dist/index.d.ts","default":"./dist/vue-apexgantt.umd.js"}}},"gitHead":"dba9461a14dab7f5a292a66a0e1741fc9c99916d","scripts":{"dev":"vite","build":"vite build","preview":"vite preview","type-check":"vue-tsc --noEmit"},"_npmUser":{"name":"junedchhipa","email":"info@apexcharts.com"},"repository":{"url":"","type":"git"},"_npmVersion":"11.3.0","description":"Vue 3 wrapper for ApexGantt - Interactive Gantt chart library","directories":{},"_nodeVersion":"24.2.0","dependencies":{"apexgantt":"^3.4.1"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.4.0","vite":"^5.0.0","vue-tsc":"^2.0.0","typescript":"^5.3.0","@types/node":"^20.0.0","vite-plugin-dts":"^3.7.0","@vitejs/plugin-vue":"^5.0.0"},"peerDependencies":{"vue":"^3.3.0"},"_npmOperationalInternal":{"tmp":"tmp/vue-apexgantt_1.0.0_1765303862500_0.28228107102123934","host":"s3://npm-registry-packages-npm-production"}},"1.1.0":{"name":"vue-apexgantt","version":"1.1.0","keywords":["vue","vue3","gantt","gantt-chart","apexgantt","timeline","project-management"],"author":"","_id":"vue-apexgantt@1.1.0","maintainers":[{"name":"junedchhipa","email":"info@apexcharts.com"}],"homepage":"https://github.com/apexcharts/vue-apexgantt#readme","bugs":{"url":"https://github.com/apexcharts/vue-apexgantt/issues"},"dist":{"shasum":"4a95128db58a9396035cbe7156707aa8bda7a243","tarball":"https://registry.npmjs.org/vue-apexgantt/-/vue-apexgantt-1.1.0.tgz","fileCount":9,"integrity":"sha512-j6LFLzpecEVn2eaWPcHfMiAq/hMKy/x/o4i2SxEzcn1UlYrsk934W0blSJ0lA4b0FmZetDvHqNU14g7tVauxKw==","signatures":[{"sig":"MEUCIGvgL6DVqC3C8OiT5+ak+FMhlYMR1wCqBbKr3zWZ0xiiAiEAlbIAplHRhSeCSI25LXyPvTePSgH3oqZ3KK/19XO+v9I=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/vue-apexgantt@1.1.0","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":25507},"main":"./dist/vue-apexgantt.umd.js","type":"module","types":"./dist/index.d.ts","module":"./dist/vue-apexgantt.es.js","exports":{".":{"import":{"types":"./dist/index.d.ts","default":"./dist/vue-apexgantt.es.js"},"require":{"types":"./dist/index.d.ts","default":"./dist/vue-apexgantt.umd.js"}}},"gitHead":"f9a3245ab931df505593a0fd372c693def1570f3","scripts":{"dev":"vite","build":"vite build","preview":"vite preview","build:demo":"vite build --config vite.config.demo.ts","type-check":"vue-tsc --noEmit"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:f0f117dd-9df8-4d35-bab2-7b27e6f072ba"}},"repository":{"url":"git+https://github.com/apexcharts/vue-apexgantt.git","type":"git"},"_npmVersion":"11.12.1","description":"Vue 3 wrapper for ApexGantt - Interactive Gantt chart library","directories":{},"_nodeVersion":"20.20.2","_hasShrinkwrap":false,"devDependencies":{"vue":"^3.4.0","vite":"^5.0.0","vue-tsc":"^2.0.0","apexgantt":"^3.10.2","typescript":"^5.3.0","@types/node":"^20.0.0","vite-plugin-dts":"^3.7.0","@vitejs/plugin-vue":"^5.0.0"},"peerDependencies":{"vue":"^3.3.0","apexgantt":">=3.10.2"},"_npmOperationalInternal":{"tmp":"tmp/vue-apexgantt_1.1.0_1775647556566_0.9575416839509692","host":"s3://npm-registry-packages-npm-production"}},"1.1.1":{"name":"vue-apexgantt","version":"1.1.1","keywords":["vue","vue3","gantt","gantt-chart","apexgantt","timeline","project-management"],"author":"","_id":"vue-apexgantt@1.1.1","maintainers":[{"name":"junedchhipa","email":"info@apexcharts.com"}],"homepage":"https://github.com/apexcharts/vue-apexgantt#readme","bugs":{"url":"https://github.com/apexcharts/vue-apexgantt/issues"},"dist":{"shasum":"0474ea55730e685090cf507be934df6acaa09711","tarball":"https://registry.npmjs.org/vue-apexgantt/-/vue-apexgantt-1.1.1.tgz","fileCount":9,"integrity":"sha512-iuF/u9uckNtrHqCGsr7jVjsDBho2lhocPkG4+/rUGQq8hh8liCpck8ukjgU7gZ5Xxmv4l2QmGn63Qp0fhUDtDw==","signatures":[{"sig":"MEQCIGrdjH7bCJu1w7OdQhbanMOnclGeDs2019w9vVLVEseqAiBpyM7XOF9fOeLEpp3sloIa2OCL0tHoMi+Gy8GTes6xmA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/vue-apexgantt@1.1.1","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":26838},"main":"./dist/vue-apexgantt.umd.js","type":"module","types":"./dist/index.d.ts","module":"./dist/vue-apexgantt.es.js","exports":{".":{"import":{"types":"./dist/index.d.ts","default":"./dist/vue-apexgantt.es.js"},"require":{"types":"./dist/index.d.ts","default":"./dist/vue-apexgantt.umd.js"}}},"gitHead":"6aa3ba7fc00d70df010101894f129fd825ba15b7","scripts":{"dev":"vite","build":"vite build","preview":"vite preview","build:demo":"vite build --config vite.config.demo.ts","type-check":"vue-tsc --noEmit"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:f0f117dd-9df8-4d35-bab2-7b27e6f072ba"}},"repository":{"url":"git+https://github.com/apexcharts/vue-apexgantt.git","type":"git"},"_npmVersion":"12.0.1","description":"Vue 3 wrapper for ApexGantt - Interactive Gantt chart library","directories":{},"_nodeVersion":"24.18.0","_hasShrinkwrap":false,"devDependencies":{"vue":"^3.4.0","vite":"^5.0.0","vue-tsc":"^2.0.0","apexgantt":"^3.16.0","typescript":"^5.3.0","@types/node":"^20.0.0","vite-plugin-dts":"^3.7.0","@vitejs/plugin-vue":"^5.0.0"},"peerDependencies":{"vue":"^3.3.0","apexgantt":">=3.11.0"},"_npmOperationalInternal":{"tmp":"tmp/vue-apexgantt_1.1.1_1784633906632_0.802735417505607","host":"s3://npm-registry-packages-npm-production"}},"1.1.2":{"_id":"vue-apexgantt@1.1.2","bugs":{"url":"https://github.com/apexcharts/vue-apexgantt/issues"},"dist":{"shasum":"94f9525d2c4d8451b1623de1869b5f70eb872807","tarball":"https://registry.npmjs.org/vue-apexgantt/-/vue-apexgantt-1.1.2.tgz","fileCount":9,"integrity":"sha512-4C2xDlSK+zIoaHWZ1KfywXwnSwko+jdN7xR0zrD7m0ykFy/STSuFfgDncNyeMtgsO14qlxfE8n/GH9ZRG0FAyg==","signatures":[{"sig":"MEYCIQCTk5cAqiq/YTL2JbTNTsPy3/vddHbm2L6p0owDwCEE0QIhANomxZzFbR8Y6us/IAg0M7N3c3Rbx1dGoaghYbtCZNDF","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIFmWzX5+sgWiAonIMRAZieEa8/r00sQU8DVIs/jA38PXAiEA+LoNiqFzWJ/9rlCkOQBQg7rqNuYqN31/w+fr4HbKjWg="}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/vue-apexgantt@1.1.2","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":30697},"main":"./dist/vue-apexgantt.umd.js","name":"vue-apexgantt","type":"module","types":"./dist/index.d.ts","author":"","module":"./dist/vue-apexgantt.es.js","exports":{".":{"import":{"types":"./dist/index.d.ts","default":"./dist/vue-apexgantt.es.js"},"require":{"types":"./dist/index.d.ts","default":"./dist/vue-apexgantt.umd.js"}}},"gitHead":"0d5575c4538928a798aef3eaa1d6437ff6af8a1e","license":"SEE LICENSE IN LICENSE","scripts":{"dev":"vite","build":"vite build","preview":"vite preview","build:demo":"vite build --config vite.config.demo.ts","type-check":"vue-tsc --noEmit"},"version":"1.1.2","_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:f0f117dd-9df8-4d35-bab2-7b27e6f072ba"}},"homepage":"https://github.com/apexcharts/vue-apexgantt#readme","keywords":["vue","vue3","gantt","gantt-chart","apexgantt","timeline","project-management"],"repository":{"url":"git+https://github.com/apexcharts/vue-apexgantt.git","type":"git"},"_npmVersion":"12.0.2","description":"Vue 3 wrapper for ApexGantt - Interactive Gantt chart library","directories":{},"maintainers":[{"name":"junedchhipa","email":"info@apexcharts.com"}],"_nodeVersion":"24.20.0","_hasShrinkwrap":false,"devDependencies":{"vue":"^3.4.0","vite":"^5.0.0","vue-tsc":"^2.0.0","apexgantt":"^3.16.0","typescript":"^5.3.0","@types/node":"^20.0.0","vite-plugin-dts":"^3.7.0","@vitejs/plugin-vue":"^5.0.0"},"peerDependencies":{"vue":"^3.3.0","apexgantt":">=3.11.0"},"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/vue-apexgantt_1.1.2_1789477187029_0.20888345455700663"}}},"time":{"created":"2025-12-09T18:11:02.499Z","modified":"2026-09-15T12:59:47.504Z","1.0.0":"2025-12-09T18:11:02.639Z","1.1.0":"2026-04-08T11:25:56.717Z","1.1.1":"2026-07-21T11:38:26.768Z","1.1.2":"2026-09-15T12:59:47.108Z"},"bugs":{"url":"https://github.com/apexcharts/vue-apexgantt/issues"},"homepage":"https://github.com/apexcharts/vue-apexgantt#readme","keywords":["vue","vue3","gantt","gantt-chart","apexgantt","timeline","project-management"],"repository":{"url":"git+https://github.com/apexcharts/vue-apexgantt.git","type":"git"},"description":"Vue 3 wrapper for ApexGantt - Interactive Gantt chart library","maintainers":[{"name":"junedchhipa","email":"info@apexcharts.com"}],"readme":"# Vue Gantt Chart Component — vue-apexgantt\n\nA Vue 3 Gantt chart component for interactive project timelines. Render tasks, dependencies, milestones, critical path, baselines, and annotations as a fully drag-and-drop schedule — with reactive props, typed emits, a `useGanttData` composable, template refs, and Composition API support.\n\n📚 **Documentation:** [apexcharts.com/apexgantt/docs](https://apexcharts.com/apexgantt/docs/) · 🎬 **Live demos:** [apexcharts.com/apexgantt/demos](https://apexcharts.com/apexgantt/demos/) · 📦 **npm:** [vue-apexgantt](https://www.npmjs.com/package/vue-apexgantt) · 📖 **Guide:** [Vue Gantt Chart](https://apexcharts.com/vue-gantt-chart/) · 🌐 **Part of** [ApexGantt](https://apexcharts.com/apexgantt/) — one Gantt component for JavaScript, React, Angular, and Vue.\n\n## Installation\n\n```bash\nnpm install vue-apexgantt apexgantt\n# or\nyarn add vue-apexgantt apexgantt\n# or\npnpm add vue-apexgantt apexgantt\n```\n\n## License Setup\n\nIf you have a commercial license, set it once at app initialization before rendering any charts:\n\n```ts\nimport { setApexGanttLicense } from 'vue-apexgantt';\n\n// call this at the top of your app\nsetApexGanttLicense('your-license-key-here');\n```\n\n**Example with Vue app entry point:**\n\n```ts\n// main.ts\nimport { createApp } from 'vue';\nimport { setApexGanttLicense } from 'vue-apexgantt';\nimport App from './App.vue';\n\n// set license before rendering\nsetApexGanttLicense('your-license-key-here');\n\ncreateApp(App).mount('#app');\n```\n\n## Quick Start\n\n```vue\n<template>\n  <ApexGanttChart\n    :tasks=\"tasks\"\n    view-mode=\"week\"\n    height=\"500px\"\n  />\n</template>\n\n<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { ApexGanttChart } from 'vue-apexgantt';\nimport type { TaskInput } from 'vue-apexgantt';\n\nconst tasks = ref<TaskInput[]>([\n  {\n    id: 'task-1',\n    name: 'Project Planning',\n    startTime: '01-01-2024',\n    endTime: '01-08-2024',\n    progress: 75,\n  },\n  {\n    id: 'task-2',\n    name: 'Development',\n    startTime: '01-09-2024',\n    endTime: '01-20-2024',\n    progress: 40,\n    dependency: 'task-1',\n  },\n]);\n</script>\n```\n\n## API Reference\n\n### Component Props\n\n| Prop        | Type                       | Default   | Description                                          |\n| ----------- | -------------------------- | --------- | ---------------------------------------------------- |\n| `tasks`     | `TaskInput[]`              | Required  | Array of tasks to display                            |\n| `options`   | `Partial<GanttUserOptions>`| `{}`      | ApexGantt configuration options                      |\n| `width`     | `string \\| number`         | `'100%'`  | Chart width                                          |\n| `height`    | `string \\| number`         | `'500px'` | Chart height                                         |\n| `pixelsPerDay` | `number`                | `4.9`     | Continuous zoom level (pixels-per-day). Header tier is auto-picked: `0.5` ≈ year, `4.9` ≈ month, `25.7` ≈ week, `80` = day |\n| `theme`     | `'light' \\| 'dark'`        | `'light'` | Color theme                                          |\n| `className` | `string`                   | `''`      | CSS class name                                       |\n| `style`     | `CSSProperties`            | `{}`      | Inline styles                                        |\n\n### Component Events\n\n| Event                 | Payload Type                      | Description                        |\n| --------------------- | --------------------------------- | ---------------------------------- |\n| `taskUpdate`          | `TaskUpdateEventDetail`           | Fired when a task is being updated |\n| `taskUpdateSuccess`   | `TaskUpdateSuccessEventDetail`    | Fired after successful task update |\n| `taskValidationError` | `TaskValidationErrorEventDetail`  | Fired when validation fails        |\n| `taskUpdateError`     | `TaskUpdateErrorEventDetail`      | Fired when update fails            |\n| `taskDragged`         | `TaskDraggedEventDetail`          | Fired when a task is dragged       |\n| `taskResized`         | `TaskResizedEventDetail`          | Fired when a task is resized       |\n\n### Event Handling Example\n\n```vue\n<template>\n  <ApexGanttChart\n    :tasks=\"tasks\"\n    @task-dragged=\"handleTaskDragged\"\n    @task-resized=\"handleTaskResized\"\n    @task-update-success=\"handleTaskUpdateSuccess\"\n  />\n</template>\n\n<script setup lang=\"ts\">\nimport type { \n  TaskDraggedEventDetail,\n  TaskResizedEventDetail,\n  TaskUpdateSuccessEventDetail \n} from 'vue-apexgantt';\n\nconst handleTaskDragged = (detail: TaskDraggedEventDetail) => {\n  console.log('Task dragged:', detail);\n  // save to backend, etc.\n};\n\nconst handleTaskResized = (detail: TaskResizedEventDetail) => {\n  console.log('Task resized:', detail);\n};\n\nconst handleTaskUpdateSuccess = (detail: TaskUpdateSuccessEventDetail) => {\n  console.log('Task updated:', detail);\n};\n</script>\n```\n\n### Template Ref Methods\n\nAccess chart methods using template ref:\n\n```vue\n<template>\n  <ApexGanttChart\n    ref=\"ganttRef\"\n    :tasks=\"tasks\"\n  />\n  \n  <button @click=\"handleZoomIn\">Zoom In</button>\n  <button @click=\"handleZoomOut\">Zoom Out</button>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { ApexGanttChart } from 'vue-apexgantt';\n\nconst ganttRef = ref<InstanceType<typeof ApexGanttChart> | null>(null);\n\nconst handleZoomIn = () => {\n  ganttRef.value?.zoomIn();\n};\n\nconst handleZoomOut = () => {\n  ganttRef.value?.zoomOut();\n};\n\n// available methods:\n// ganttRef.value?.update(options)\n// ganttRef.value?.updateTask(taskId, data)\n// ganttRef.value?.zoomIn()\n// ganttRef.value?.zoomOut()\n// ganttRef.value?.destroy()\n// ganttRef.value?.getInstance() // get raw ApexGantt instance\n</script>\n```\n\n## Composables\n\n### useGanttData\n\nParse external data into ApexGantt format:\n\n```vue\n<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { ApexGanttChart, useGanttData } from 'vue-apexgantt';\nimport type { ParsingConfig } from 'vue-apexgantt';\n\n// raw API data\nconst apiData = ref([\n  {\n    task_id: 'T1',\n    task_name: 'Design Phase',\n    start_date: '01-01-2024',\n    end_date: '01-15-2024',\n    completion: 0.75,\n  },\n  // ...more tasks\n]);\n\n// parsing configuration\nconst parsingConfig: ParsingConfig = {\n  id: 'task_id',\n  name: 'task_name',\n  startTime: 'start_date',\n  endTime: 'end_date',\n  progress: {\n    key: 'completion',\n    transform: (value) => value * 100, // convert to percentage\n  },\n};\n\n// parse data\nconst tasks = useGanttData({\n  data: apiData,\n  parsing: parsingConfig,\n});\n</script>\n\n<template>\n  <ApexGanttChart :tasks=\"tasks\" />\n</template>\n```\n\n### Nested Objects & Transforms\n\nUse dot notation for nested properties:\n\n```ts\nconst nestedData = ref([\n  {\n    project: {\n      task: { id: 'T1', title: 'Design' },\n      dates: { start: '01-01-2024', end: '01-15-2024' },\n      status: { completion: 0.75 },\n    },\n  },\n]);\n\nconst tasks = useGanttData({\n  data: nestedData,\n  parsing: {\n    id: 'project.task.id',\n    name: 'project.task.title',\n    startTime: 'project.dates.start',\n    endTime: 'project.dates.end',\n    progress: {\n      key: 'project.status.completion',\n      transform: (value) => value * 100,\n    },\n  },\n});\n```\n\n## Advanced Usage\n\n### Custom Options\n\n```vue\n<template>\n  <ApexGanttChart\n    :tasks=\"tasks\"\n    :options=\"ganttOptions\"\n    view-mode=\"week\"\n    theme=\"dark\"\n  />\n</template>\n\n<script setup lang=\"ts\">\nimport type { GanttUserOptions } from 'vue-apexgantt';\n\nconst ganttOptions: Partial<GanttUserOptions> = {\n  enableTaskDrag: true,\n  enableTaskResize: true,\n  enableTaskEdit: true,\n  barBackgroundColor: '#537CFA',\n  rowBackgroundColors: ['#FFFFFF', '#F8F9FA'],\n  // ...more options\n};\n</script>\n```\n\n### Dynamic Zoom\n\n```vue\n<template>\n  <div>\n    <select v-model.number=\"pixelsPerDay\">\n      <option :value=\"80\">Day</option>\n      <option :value=\"25.7\">Week</option>\n      <option :value=\"4.9\">Month</option>\n      <option :value=\"1.6\">Quarter</option>\n      <option :value=\"0.5\">Year</option>\n    </select>\n    \n    <ApexGanttChart\n      :tasks=\"tasks\"\n      :pixels-per-day=\"pixelsPerDay\"\n    />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref } from 'vue';\n\nconst pixelsPerDay = ref(4.9);\n</script>\n```\n\n### Theme Switching\n\n```vue\n<template>\n  <div>\n    <button @click=\"toggleTheme\">\n      {{ theme === 'light' ? '🌙 Dark' : '☀️ Light' }}\n    </button>\n    \n    <ApexGanttChart\n      :tasks=\"tasks\"\n      :theme=\"theme\"\n    />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport type { ThemeMode } from 'vue-apexgantt';\n\nconst theme = ref<ThemeMode>('light');\n\nconst toggleTheme = () => {\n  theme.value = theme.value === 'light' ? 'dark' : 'light';\n};\n</script>\n```\n\n## TypeScript Support\n\nThe package includes full TypeScript definitions. Import types as needed:\n\n```ts\nimport type {\n  TaskInput,\n  TaskType,\n  ThemeMode,\n  GanttUserOptions,\n  ParsingConfig,\n  TaskUpdateEventDetail,\n  TaskDraggedEventDetail,\n  TaskResizedEventDetail,\n  // ...more types\n} from 'vue-apexgantt';\n```\n\n## Development\n\n### Setup\n\n```bash\n# install dependencies\nnpm install\n\n# run demo app\nnpm run dev\n\n# build library\nnpm run build\n\n# type check\nnpm run type-check\n```\n\n### Testing Examples Locally\n\nThe demo app is included in the repository:\n\n```bash\nnpm install\nnpm run dev\n```\n\nThe demo app will be available at `http://localhost:5173` and includes:\n\n- **Basic Example**: Simple Gantt with zoom controls\n- **Advanced Example**: View mode switching, theme toggle, interaction controls\n- **Events Example**: Interactive testing of drag, resize, and update events\n- **Data Parsing Example**: Using `useGanttData` with nested data structures\n\n## Browser Support\n\n- Vue 3.3+ (Vue 2 is not supported)\n- Modern browsers (Chrome, Firefox, Safari, Edge)\n- Requires ES2020+ support\n\n## Related\n\n- [**ApexGantt — multi-framework hub**](https://apexcharts.com/apexgantt/) — overview across all supported frameworks\n- **Other ApexGantt wrappers:** [`react-apexgantt`](https://www.npmjs.com/package/react-apexgantt) · [`ngx-apexgantt`](https://www.npmjs.com/package/ngx-apexgantt) (Angular) · [`apexgantt`](https://www.npmjs.com/package/apexgantt) (JavaScript core)\n- **All ApexGantt demos:** [apexcharts.com/apexgantt/demos](https://apexcharts.com/apexgantt/demos/)\n\n## License\n\nSee [LICENSE](LICENSE) for details. Commercial licenses available at [apexcharts.com/pricing](https://apexcharts.com/pricing/).\n\n## About\n\nA Vue 3 wrapper for [ApexGantt](https://github.com/apexcharts/apexgantt) — a JavaScript library to create interactive Gantt charts.\n","readmeFilename":"README.md","license":"SEE LICENSE IN LICENSE"}