Gantt Chart
Диаграммы Ганта с зависимостями и перетаскиванием. Pro · Работа и команды › Планирование
Установка
npx valyro-cli@latest login
npx valyro-cli@latest add gantt-chartnpm install valyro-ui-pro
import 'valyro-ui-pro/styles.css';
import { GanttChart } from 'valyro-ui-pro';Пропсы
| Prop | Type | Default | |
|---|---|---|---|
tasks * | GanttTask[] | Rows of the timeline, listed under their phase in array order; tasks without a valid start are skipped. | |
groups | GanttGroup[] | [] | Phases in display order; tasks reference them with group. |
zoom | 'day' | 'week' | 'month' | 'week' | Time scale: one column per day, week or month. Default week. |
defaultCollapsed | string[] | Phases collapsed on first render. | |
today | Date | null | Day marked with the today line. Default: the current date; null hides the line. | |
onTaskChange | (task: GanttTask, change: GanttTaskChange) => void | Makes bars draggable (move, or resize by an end) and keyboard-editable; called with the new dates. | |
rowHeight | number | 36 | Row height in px. Default 36. |
taskColumnWidth | number | 220 | Width of the sticky task-name column in px (narrower in small containers). Default 220. |
weekStartsOn | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 1 | 0 = Sunday, 1 = Monday: where week columns start. Default 1. |
locale | string | BCP 47 locale for dates and numbers. Default: the ThemeProvider locale, then the browser's. | |
labels | Partial<GanttChartLabels> | Overrides for the built-in strings. | |
loading | boolean | false | Shows a placeholder while data loads. |
ariaLabel * | string | Accessible name of the timeline (also the caption of its sr-only data table). |
Похожие компоненты
- Calendar View — Календарь событий
- Scheduler — Планировщик: день, неделя, месяц и таймлайн ресурсов, drag & drop, повторы
- Kanban Board — Доска задач
- Booking Slots — Запись на встречу: календарь, слоты в часовом поясе гостя, форма и подтверждение
- CRM Pipeline — Воронка сделок: этапы, суммы и вероятности, перетаскивание между этапами
- Approval Flow — Многоэтапное согласование: последовательные и параллельные этапы, решения с причиной, история
- Goal Tracker — OKR: цели и ключевые результаты, статусы, уверенность, чек-ины с историей
- Onboarding Checklist — Чек-лист онбординга: прогресс, подсказки с CTA, скрытие и празднование
- Course Path Navigator — Карта курса: модули, блокировки, прогресс и навыки, список на узком экране
- Team Members — Участники команды: роли, приглашения по email, ожидающие инвайты, счётчик мест
- Org Chart — Оргструктура: дерево с зумом и панорамой, поиск, сворачивание веток
- Activity Feed — Лента активности
Назад: Kanban Board · Далее: Booking Slots · Весь раздел «Работа и команды»