Component Showcase
Explore 41 production-ready React components, with dedicated drop-in support for SharePoint Framework
Accordion
This is the accordion content. It can contain any React components, text, images, forms, or other nested accordions.
- Feature 1
- Feature 2
- Feature 3
Expandable/collapsible content sections with smooth animations
ActionPersona
User persona display with optional action buttons
AppParametersSPFx Only
Centralized configuration management from SharePoint lists
AppShield
Global error boundary with fallback UI and error logging
BreadCrumb
Breadcrumb navigation with overflow handling, custom separators, and icons
Carousel
Responsive carousel/slider with auto-play, touch gestures, and keyboard navigation
ComboBoxPeoplePickerSPFx Only
Combo box style people picker with type-ahead search
ConfirmDialog
Modal confirmation dialog with customizable actions
CopyBox
Text display with one-click copy-to-clipboard functionality
DataForm
Platform-agnostic form component with validation, custom field renderers, changed-field payloads, and SharePoint / Dataverse adapters
DataGrid
ID⇅ | Name *⇅ | Department⇅ | Status⇅ | Date⇅ | Date & Time⇅ | Progress⇅ |
|---|
High-performance editable grid with sorting, inline editing and custom cell renderers
DataMatrix
| region \ product | Widget A | Widget B | Widget C | (Blank) | Total |
|---|---|---|---|---|---|
| East | 1100 $ | — | 1300 $ | — | 2400 $ |
| North | 2000 $ | 1500 $ | — | 600 $ | 4100 $ |
| South | 2000 $ | 1800 $ | 900 $ | — | 4700 $ |
| West | — | 2200 $ | 1700 $ | — | 3900 $ |
| (Blank) | 500 $ | — | — | — | 500 $ |
| Total | 5600 $ | 5500 $ | 3900 $ | 600 $ | 15600 $ |
Transforms a flat dataset into a pivot-style matrix, grouping records by configurable row and column fields and displaying aggregated values as counts or sums in a clean, modern grid layout
DataTable
Generic data table with DetailsList and responsive tile view. Supports filtering, sorting, search, export, and column selection. Use useSharePointDataTable for SharePoint integration
DocumentManager
Full-featured document management with grid/list views, upload, multi-select, and SharePoint adapter
DropFileArea
Drag-and-drop file upload zone with preview
ExportToExcelSPFx Only
One-click export of data to Excel format
ExtendedSearchBox
Enhanced search box with debounce and clear functionality
Grid
Flexible responsive grid system with configurable columns and gaps
ImagePickerSPFx Only
Image selection with preview and upload capabilities
ImpactFeasibilityMatrix
A 2×2 impact/feasibility prioritisation matrix that plots items into four fixed quadrants (Quick Wins, Major Projects, Fill-ins, Resource Drains) with configurable ranges, schema mapping, token-based theming and per-quadrant maximize/minimize
InfoTooltip
Contextual help tooltips with customizable trigger and content
LibraryAttachmentsSPFx Only
Manage SharePoint library attachments with upload/download
ListFormSPFx OnlyDeprecated
Auto-generated forms from SharePoint list schemas with validation
ListViewSPFx OnlyDeprecated
Feature-rich data table with sorting, filtering, pagination and bulk actions
ListViewPivotSPFx Only
Tab-based navigation for switching ListView contexts
Loading
Inline loading spinner with optional label
LoadingPanel
Full-area loading overlay with backdrop
MessageBar
Dismissible notification bar for info, warning, error and success messages
NotificationCenter
Notification management with bell icon, panel, and toasts. Supports Web Storage, SharePoint, or custom backends
Pager
| ID | Name | Description |
|---|---|---|
| #1 | Item 1 | This is a description for item 1 |
| #2 | Item 2 | This is a description for item 2 |
Pagination control with page size options
PeoplePickerSPFx Only
SharePoint people/group picker with search and validation
Planner
Gantt-style timeline planner with drag-and-drop, grouping and period views
ProgressBar
Determinate or indeterminate progress indicator
Rating
Star or circle rating display with half-value support and interactive mode
RoosterRichText
Rich text editor powered by Rooster.js
StatusBadge
Visual status indicators with customizable colors and labels
Stepper
Visual stepper indicator with step progression
TaskManager
Not Started
3In Progress
3Completed
1Blocked
1Task management with Kanban board and list views. Drag & drop reordering, status columns, and SharePoint integration via useSharePointTaskManager hook
Timeline
Visualizes key milestones and progress across a timeline
TreeView
Hierarchical tree view with drag & drop, custom rendering, and responsive burger menu
VersionHistoryFormSPFx Only
Display and manage SharePoint item version history