Component Reference
All components exported by @conduction/nextcloud-vue, organized by category.
Standalone playground
Every component page below embeds a live demo via <Playground /> — that's the canonical way to preview a component. If you want the full Vue Styleguidist UI on its own (no narrative, just the interactive sandbox), it's mounted by the gh-pages deploy at /styleguide/ — same component set, deep-link via /styleguide/#!/CnDataTable.
Page Layout
| Component | Description |
|---|---|
| CnIndexPage | Schema-driven list page with table, filters, pagination, and CRUD dialogs |
| CnIndexSidebar | Tabbed sidebar with search, filter, and column visibility controls |
| CnFacetSidebar | Faceted search sidebar auto-generated from schema |
Data Display
| Component | Description |
|---|---|
| CnDataTable | Sortable data table with selection and schema-driven columns |
| CnCellRenderer | Type-aware cell renderer for schema-driven tables |
| CnObjectCard | Schema-driven card for object display |
| CnCardGrid | Responsive CSS grid for CnObjectCard instances |
| CnStatusBadge | Color-coded pill badge for status/priority |
| CnKpiGrid | Responsive grid layout for KPI cards |
| CnStatsBlock | Statistics card with icon, count, and breakdown |
| CnProgressBar | Labeled horizontal progress bars with variant colors |
| CnItemCard | Compact card for sidebar list items with icon, title, and actions |
Data Actions
| Component | Description |
|---|---|
| CnFilterBar | Search and filter controls row |
| CnPagination | Full pagination with page numbers and size selector |
| CnRowActions | Action menu for table rows and cards |
| CnMassActionBar | Mass action dropdown for selected items |
Dialogs
| Component | Description |
|---|---|
| CnDeleteDialog | Two-phase single-item delete confirmation |
| CnCopyDialog | Two-phase single-item copy with naming pattern |
| CnFormDialog | Schema-driven create/edit form dialog with async select and custom option slots |
| CnAdvancedFormDialog | Create/edit with properties table, JSON tab, and optional metadata/store |
| CnMassDeleteDialog | Two-phase mass delete with item review |
| CnMassCopyDialog | Two-phase mass copy with pattern selector |
| CnMassExportDialog | Export format selection dialog |
| CnMassImportDialog | File upload with options and results summary |
Settings
| Component | Description |
|---|---|
| CnSettingsCard | Collapsible card for settings sections |
| CnSettingsSection | Admin settings section with loading/error states |
| CnConfigurationCard | Configuration card with title, actions, and status |
| CnVersionInfoCard | App version information card for admin settings |
| CnRegisterMapping | OpenRegister register/schema configuration panel |
Cards
| Component | Description |
|---|---|
| CnCard | Generic prop-driven card with title, icon, description, labels, stats, and active state |
Utilities
| Export | Description |
|---|---|
| CnIcon | Renders MDI icon by PascalCase name from extensible registry |
| registerIcons | Register MDI icon components at app boot |