svelte-gantt

Integrate and customize the SVAR Svelte Gantt component in Svelte and SvelteKit applications.

250|40|Updated Oct 4, 2024
One-click install
npx skills add https://github.com/svar-widgets/gantt --skill svelte-gantt
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: svelte-gantt
Source: https://github.com/svar-widgets/gantt/tree/main/docs/.skill
Command: npx skills add https://github.com/svar-widgets/gantt --skill svelte-gantt

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill eliminates the need to search through scattered documentation to implement, configure, and customize the SVAR Svelte Gantt component for project timeline visualization, saving developers hours of trial and error when building task management, scheduling, and resource planning interfaces.

Core Features & Use Cases

  • Comprehensive Component Guidance: Covers all core Gantt components including the main timeline grid, toolbar, context menu, task editor, tooltips, header menu, and light/dark Willow theme wrappers.
  • Full Configuration & Customization Support: Includes instructions for task and link data setup, custom time scales, zoom, markers, holiday highlighting, CSS styling via variables, and pro features like critical path, baselines, rollups, auto-scheduling, and undo/redo.
  • Real-World Use Case: A developer building a project management SvelteKit app can use this Skill to quickly implement a drag-and-drop Gantt chart with custom task editors, REST data persistence, and MS Project import/export functionality.

Quick Start

Use the svelte-gantt skill to add a basic interactive Gantt chart with sample task data and the Willow theme to your Svelte component.

Frequently Asked Questions about svelte-gantt

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add an interactive Gantt chart with drag-and-drop to a SvelteKit app?

To add an interactive Gantt chart to SvelteKit, integrate the SVAR Svelte Gantt component, which provides drag-and-drop task editing, custom time scales, and a light or dark Willow theme out of the box.

Can I customize the task editor and toolbar in a Svelte project timeline component?

Yes, the Svelte project timeline component supports full customization of the toolbar, context menu, tooltips, and task editor, allowing you to tailor the interface to your specific project management requirements.

Does the SVAR Svelte Gantt support REST API integration for task data persistence?

The SVAR Svelte Gantt supports REST API integration, enabling persistent task and link storage by connecting the component directly to your REST data providers for project data synchronization.

What's the best way to configure critical path and auto-scheduling in a Svelte Gantt chart?

Configuring critical path and auto-scheduling in a Svelte Gantt chart utilizes the component's pro features, alongside baselines, rollups, and undo/redo, to automate task dependency logic and visualize project delays.

How do I apply custom CSS styling and holiday highlighting to a Svelte Gantt timeline?

Apply custom CSS styling and holiday highlighting to a Svelte Gantt timeline by modifying CSS variables and using the component's built-in markers, ensuring the visual schedule matches your application's theme.

Can I import and export MS Project files using a Svelte Gantt chart component?

Yes, you can import and export MS Project files using the Svelte Gantt chart component, facilitating seamless migration of existing project timelines and task schedules into your Svelte application.