docs/components/data/ProjectDashboard

ProjectDashboard

Project overview dashboard.

import { ProjectDashboard } from '@ybouhjira/hyperkit';

#Playground

Edit the code — the preview recompiles and re-renders as you type.

Live playground
Loading preview…

#Props

PropTypeDefaultDescription
projectName *string
milestones *readonly MilestoneData[]
issues *readonly IssueData[]
onRefresh() => void
onIssueClick(issue: IssueData) => void
onMilestoneClick(milestone: MilestoneData) => void
filter'open' | 'closed' | 'all'
onFilterChange(filter: 'open' | 'closed' | 'all') => void
styleJSX.CSSProperties
classstring

* required prop.

#Design Tokens

This component reads the following CSS custom properties. Override them globally or per-instance to restyle it — see the CSS Variables guide.

  • --sk-project-dashboard-
  • --sk-project-dashboard-progress-high
  • --sk-project-dashboard-progress-low
  • --sk-project-dashboard-progress-medium
  • --sk-project-dashboard-state-closed
  • --sk-project-dashboard-state-open