PageTeam Pro

Part of Pro. Versions up to 0.10 of the open source package include it under MIT; later releases keep it in Pro.

Team and roles page. Slots: stats, members, roles, invite.

Jump to API reference

Import

Vue
import { UiPageTeam } from '@ziyarago/ui-pro/vue'

Default

Team and roles

Section

Summary slot
Members slot
Roles and permissions slot
Invite slot
Vue
<UiPageTeam title="Team and roles" subtitle="Section">
  <template #stats>Summary slot</template>
  <template #members>Members slot</template>
  <template #roles>Roles and permissions slot</template>
  <template #invite>Invite slot</template>
</UiPageTeam>

API reference

Team template: member stats, members table, roles and permissions matrix, and an invite form.

Props

PropType and valuesDefaultDescription
titlestring—Page heading. The built-in header renders only when title is set and the header slot is empty.
subtitlestring—Caption under the heading.
crumbs{ label: string; href?: string }[]—Breadcrumb trail above the title.

Slots

Vue: named slots. React: a prop with the same name; default is children.

headerCustom page header; replaces the built-in title/subtitle/crumbs header.
actionsButtons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
statsCounters; KpiTile, StatsCard.
membersMembers; DataTable with UserCell, Select, Badge.
rolesPermissions matrix; DataTable with Checkbox cells.
inviteInvite form; Card, TextField, Select, Button.

Notes

  • Place inside AppShell; fill only the slots you need.
  • Members and roles share the main column; the invite form is the side column.