npx shadcn@latest add @vibra/widget-people-overview-people-statsPeople headline
Headcount against the start of the quarter, this week's attendance against last week's, the leave requests waiting and the average KPI; reads peopleStats().
The whole dashboard — every page under one sidebar, the sample data they read — is one command. Or take a page at a time: each one brings the sidebar with it.
npx shadcn@latest add @vibra/people/peoplePeople dashboardnpx shadcn@latest add @vibra/people-overview/people/directoryTeam directorynpx shadcn@latest add @vibra/people-directory/people/rolesPermissions matrixnpx shadcn@latest add @vibra/people-roles/people/invitationsPending invitationsnpx shadcn@latest add @vibra/people-invitations/people/leaderboardLeaderboardnpx shadcn@latest add @vibra/people-leaderboard/people/leaveLeavenpx shadcn@latest add @vibra/people-leaveSingle cards cut from these pages, each installed on its own.
npx shadcn@latest add @vibra/widget-people-overview-people-statsHeadcount against the start of the quarter, this week's attendance against last week's, the leave requests waiting and the average KPI; reads peopleStats().
npx shadcn@latest add @vibra/widget-people-overview-headcount-by-typeFull-time against contract headcount as two tinted tiles, each with how it has moved since last quarter; reads headcountByType().
npx shadcn@latest add @vibra/widget-people-overview-attendance-chartMonday to Friday stacked as on time, late and absent, with the week's rate against last week's and how many arrived late; reads attendanceWeek().
npx shadcn@latest add @vibra/widget-people-overview-work-calendarThe month with a count on every day that has something on it, and the picked day's meetings, deadlines, releases and time off; reads calendarEvents().
npx shadcn@latest add @vibra/widget-people-overview-employees-tableEveryone on the payroll — searchable, filterable by department, sortable and paged — with the rows the filters leave exported as CSV; reads employeeRows().
npx shadcn@latest add @vibra/widget-people-overview-leave-queueThe requests waiting on a decision, each approved or declined through the server where it stands, a refusal said above the queue; reads leaveQueue().
npx shadcn@latest add @vibra/widget-people-overview-departmentsHeadcount by department as one segmented bar, then a tile a department with its count and its share, in the bar's own colours; reads departments().
npx shadcn@latest add @vibra/widget-people-overview-arrivalsWhen people clock in, as an hour-by-weekday grid, darker where more of them arrive; reads arrivals().
npx shadcn@latest add @vibra/widget-people-directory-team-summaryThe people in the workspace and how many of them are active, the seats offered and not yet taken, and the seats the plan includes; reads summary().
npx shadcn@latest add @vibra/widget-people-leave-leave-statsWhat is waiting on a decision, who is out today, the working days of approved leave this month and how the decided requests went; reads leaveRows().
npx shadcn@latest add @vibra/widget-people-leave-month-stripThe month as one strip of days, each with how many are out on approved leave and how many more have asked, the picked day's names listed under it; reads leaveRows().
Every figure on these pages is read from these repositories of the sample store. Swap one for your own API and each page that reads it follows.