Complete users list page template with table, search, filters, pagination, and actions. A full-screen template for displaying and managing lists of data with comprehensive controls.

Overview

UsersListTemplate is a ready-to-use template that combines AppShell, DataTableToolbar, DataTable, and PaginationFooter into a complete users list page. It includes sidebar navigation, header, search, filters, table with selection, and pagination.

Install

1

Examples

Code Examples

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

Props

• sidebar - Sidebar navigation content (optional)
• sidebarHeader - Sidebar header (optional)
• sidebarFooter - Sidebar footer (optional)
• headerLinks - Header navigation links (optional)
• data - Table data array (required)
• columns - Table columns configuration (required)
• search - Search value (optional)
• onSearchChange - Search change handler (optional)
• filters - Filters configuration (optional)
• filterValues - Current filter values (optional)
• onFilterChange - Filter change handler (optional)
• primaryActions - Primary action buttons (optional)
• secondaryActions - Secondary action buttons (optional)
• selectedRows - Selected rows (optional)
• onSelectionChange - Selection change handler (optional)
• currentPage - Current page (default: 1)
• totalPages - Total pages (optional)
• totalItems - Total items (optional)
• pageSize - Items per page (default: 10)
• onPageChange - Page change handler (optional)
• onPageSizeChange - Page size change handler (optional)
• onRowClick - Row click handler (optional)
• emptyMessage - Empty state message (default: "No users found")

Features

• Complete page layout with AppShell
• Search and filter functionality
• Table with selection support
• Pagination controls
• Primary and secondary actions
• Empty state handling
• Fully accessible

Related Blocks

• AppShell - Base shell component
• DataTableToolbar - Toolbar component
• PaginationFooter - Pagination component
• DataTable - Table component

Accessibility

UsersListTemplate inherits accessibility from all its component parts. All controls are keyboard accessible and follow ARIA best practices.