{
"$schema": "https://ui.shadcn.com/schema/registry.json",
"name": "mzizi",
"homepage": "https://mzizi.dev",
"items": [
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["documentation", "assurance"],
"dependencies": [],
"description": "N8 assurance probe that validates WCAG compliance and color-blindness safety across every semantic-color pair. Runs daily via pg_cron, detects regressions, and files a Fundi issue for each. Uses Machado/Oliveira/Fernandes (2009) linear-RGB simulation matrices for protanopia, deuteranopia, tritanopia, and achromatopsia. Includes an audit_exempt flag so decorative borders covered by WCAG 1.4.11 non-text-contrast exemption are correctly skipped.",
"docs": "Use it for: Daily WCAG and color-blindness validation across every semantic-color pair, Continuous regression detection — any token change that breaks a11y is caught within 24h, Pre-launch accessibility gate — ensures palette is colorblind-safe before each release, Fundi-integrated healing loop — new failures create GitHub issues automatically, On-demand validation — call run_accessibility_audit() in migrations or CI.\nVariants: scheduled-daily, on-demand, ci-gate.\nIncludes: Machado/Oliveira/Fernandes (2009) linear-RGB simulation matrices, Covers protanopia, deuteranopia, tritanopia, and achromatopsia, WCAG 2.1 contrast ratio computation per simulated pair, Configurable contrast floor (default 3.0 for WCAG AA large text), audit_exempt flag skips decorative pairs per WCAG 1.4.11 exemption, Regression detection — files Fundi issues only for NEW failures, not existing ones, Severity assignment — high for foreground/error/success pairs, medium for others, Scheduled via pg_cron (daily 02:00 UTC), SQL-only implementation — no edge function required.\nAccessibility: Output structured as fundi_issues row plus brand_accessibility_checks flag updates, Findings include pair_name, theme_mode, fg/bg hex, contrast ratio, simulated safety flags, Machine-readable via get_accessibility_summary() for dashboard consumption, Remediation guidance: pair with icon/label, or adjust hex to exceed floor, Results exposed through fundi_issues table and the Fundi healing loop.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/accessibility-audit",
"files": [
{
"path": "components/registry/n8-assurance/accessibility-audit.md",
"target": "docs/accessibility-audit-pipeline.md",
"type": "registry:file"
}
],
"meta": {
"a11y": [
"Output structured as fundi_issues row plus brand_accessibility_checks flag updates",
"Findings include pair_name, theme_mode, fg/bg hex, contrast ratio, simulated safety flags",
"Machine-readable via get_accessibility_summary() for dashboard consumption",
"Remediation guidance: pair with icon/label, or adjust hex to exceed floor",
"Results exposed through fundi_issues table and the Fundi healing loop"
],
"collection": "documentation",
"features": [
"Machado/Oliveira/Fernandes (2009) linear-RGB simulation matrices",
"Covers protanopia, deuteranopia, tritanopia, and achromatopsia",
"WCAG 2.1 contrast ratio computation per simulated pair",
"Configurable contrast floor (default 3.0 for WCAG AA large text)",
"audit_exempt flag skips decorative pairs per WCAG 1.4.11 exemption",
"Regression detection — files Fundi issues only for NEW failures, not existing ones",
"Severity assignment — high for foreground/error/success pairs, medium for others",
"Scheduled via pg_cron (daily 02:00 UTC)",
"SQL-only implementation — no edge function required"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Daily WCAG and color-blindness validation across every semantic-color pair",
"Continuous regression detection — any token change that breaks a11y is caught within 24h",
"Pre-launch accessibility gate — ensures palette is colorblind-safe before each release",
"Fundi-integrated healing loop — new failures create GitHub issues automatically",
"On-demand validation — call run_accessibility_audit() in migrations or CI"
],
"variants": ["scheduled-daily", "on-demand", "ci-gate"]
},
"name": "accessibility-audit",
"registryDependencies": [],
"title": "Accessibility Audit",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui"],
"description": "A vertically stacked set of interactive headings that reveal content.",
"docs": "Use it for: FAQ sections with expandable questions, Product detail expandable specifications, Settings pages with collapsible sections, Documentation with expandable subsections, Multi-section forms with progressive disclosure.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/accordion",
"files": [
{
"path": "components/registry/n2-primitives/accordion.tsx",
"target": "components/ui/accordion.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"FAQ sections with expandable questions",
"Product detail expandable specifications",
"Settings pages with collapsible sections",
"Documentation with expandable subsections",
"Multi-section forms with progressive disclosure"
],
"variants": ["default", "sm", "lg"]
},
"name": "accordion",
"registryDependencies": [],
"title": "Accordion",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Chronological action list with timeline pattern for dashboards and profiles.",
"docs": "Use it for: User profile activity timeline, Project activity feed in dashboards, Admin audit timeline, Version history and changelog display, Team collaboration activity in workspace apps.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/activity-feed",
"files": [
{
"path": "components/registry/n2-primitives/activity-feed.tsx",
"target": "components/ui/activity-feed.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"User profile activity timeline",
"Project activity feed in dashboards",
"Admin audit timeline",
"Version history and changelog display",
"Team collaboration activity in workspace apps"
],
"variants": ["default", "sm", "lg"]
},
"name": "activity-feed",
"registryDependencies": [],
"title": "Activity Feed",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Structured address form with street, city, state, postal code, and country fields with African countries prioritized.",
"docs": "Use it for: Checkout shipping address collection, User profile address fields, Business location registration, Event venue address input, Delivery address selection in BushTrade.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/address-input",
"files": [
{
"path": "components/registry/n2-primitives/address-input.tsx",
"target": "components/ui/address-input.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Checkout shipping address collection",
"User profile address fields",
"Business location registration",
"Event venue address input",
"Delivery address selection in BushTrade"
],
"variants": ["default"]
},
"name": "address-input",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/input"],
"title": "Address Input",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Admin/back-office page. Tabbed admin interface with sidebar navigation, content area, and action bar. For Mukoko Console admin, B2B partner dashboards, org management.",
"docs": "Use it for: nhimbe, console, bushtrade.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/admin-page",
"files": [
{
"path": "components/registry/n6-pages/admin-page.tsx",
"target": "components/ui/admin-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["nhimbe", "console", "bushtrade"],
"variants": ["default", "loading"]
},
"name": "admin-page",
"registryDependencies": [],
"title": "Admin Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Chronological event list grouped by date.",
"docs": "Use it for: Calendar agenda views grouped by date, Event schedule listings, Booking timeline displays, Personal task view by due date, Appointment summary pages.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/agenda-view",
"files": [
{
"path": "components/registry/n2-primitives/agenda-view.tsx",
"target": "components/ui/agenda-view.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Calendar agenda views grouped by date",
"Event schedule listings",
"Booking timeline displays",
"Personal task view by due date",
"Appointment summary pages"
],
"variants": ["default", "sm", "lg"]
},
"name": "agenda-view",
"registryDependencies": [],
"title": "Agenda View",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Complete AI conversation interface with message history, streaming, and suggested prompts.",
"docs": "Use it for: Conversational AI interfaces in Claude-style tools, Customer support chatbots with history, AI-assisted content creation flows, Developer tools with code-generating copilots, Mukoko-embedded AI features with African language support.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/ai-chat",
"files": [
{
"path": "components/registry/n2-primitives/ai-chat.tsx",
"target": "components/ui/ai-chat.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Conversational AI interfaces in Claude-style tools",
"Customer support chatbots with history",
"AI-assisted content creation flows",
"Developer tools with code-generating copilots",
"Mukoko-embedded AI features with African language support"
],
"variants": ["default", "sm", "lg"]
},
"name": "ai-chat",
"registryDependencies": [],
"title": "AI Chat",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Thumbs up/down rating for AI responses with optional text feedback.",
"docs": "Use it for: Quality rating on AI-generated responses, Collecting user feedback on AI accuracy, A/B testing different LLM outputs, Moderation signals for content review, Improving prompt engineering through feedback loops.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/ai-feedback",
"files": [
{
"path": "components/registry/n2-primitives/ai-feedback.tsx",
"target": "components/ui/ai-feedback.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Quality rating on AI-generated responses",
"Collecting user feedback on AI accuracy",
"A/B testing different LLM outputs",
"Moderation signals for content review",
"Improving prompt engineering through feedback loops"
],
"variants": ["default", "sm", "lg"]
},
"name": "ai-feedback",
"registryDependencies": [],
"title": "AI Feedback",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Structured AI output card with markdown rendering and action buttons.",
"docs": "Use it for: Structured AI output with action buttons (copy, share, regenerate), AI summaries with citation links, Research assistant responses with expandable sections, Code generation results with language-specific syntax, Translation results with confidence scoring.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/ai-response-card",
"files": [
{
"path": "components/registry/n2-primitives/ai-response-card.tsx",
"target": "components/ui/ai-response-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Structured AI output with action buttons (copy, share, regenerate)",
"AI summaries with citation links",
"Research assistant responses with expandable sections",
"Code generation results with language-specific syntax",
"Translation results with confidence scoring"
],
"variants": ["default", "sm", "lg"]
},
"name": "ai-response-card",
"registryDependencies": [],
"title": "AI Response Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["safety"],
"dependencies": [],
"description": "AI safety utilities: input validation, prompt injection detection, and rate limiting.",
"docs": "Use it for: Access control, Security gate, Verification check.\nVariants: allowed, blocked, loading.\nIncludes: Y-axis safety spine, Renders children when check passes, Branded explanation when blocked, Web3 integration.\nAccessibility: Screen reader announces gate state, Focus management on state change.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/ai-safety",
"files": [
{
"path": "components/registry/n4-safety/ai-safety.tsx",
"target": "lib/ai-safety.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": [
"Screen reader announces gate state",
"Focus management on state change"
],
"collection": "safety",
"features": [
"Y-axis safety spine",
"Renders children when check passes",
"Branded explanation when blocked",
"Web3 integration"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Access control", "Security gate", "Verification check"],
"variants": ["allowed", "blocked", "loading"]
},
"name": "ai-safety",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/observability"],
"title": "AI Safety",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["class-variance-authority"],
"description": "Displays a callout for important information.",
"docs": "Use it for: Inline form error and success messages, Contextual warnings in admin interfaces, Informational callouts in documentation, Account status notifications, Feature announcement banners within pages.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/alert",
"files": [
{
"path": "components/registry/n2-primitives/alert.tsx",
"target": "components/ui/alert.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Inline form error and success messages",
"Contextual warnings in admin interfaces",
"Informational callouts in documentation",
"Account status notifications",
"Feature announcement banners within pages"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "alert",
"registryDependencies": [],
"title": "Alert",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui"],
"description": "A modal dialog that interrupts the user with important content and expects a response.",
"docs": "Use it for: Destructive action confirmations (delete, cancel), Irreversible operation warnings, Account closure confirmations, Critical permission changes, Data loss prevention prompts.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/alert-dialog",
"files": [
{
"path": "components/registry/n2-primitives/alert-dialog.tsx",
"target": "components/ui/alert-dialog.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Destructive action confirmations (delete, cancel)",
"Irreversible operation warnings",
"Account closure confirmations",
"Critical permission changes",
"Data loss prevention prompts"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "alert-dialog",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/button"],
"title": "Alert Dialog",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["recharts"],
"description": "KPI metric card with sparkline chart, period comparison (vs last week/month/year), and drill-down action. The standard analytics widget for the Nyuchi Console and all 7 Nyuchi product dashboards.",
"docs": "Use it for: console.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/analytics-dashboard-card",
"files": [
{
"path": "components/registry/n2-primitives/analytics-dashboard-card.tsx",
"target": "components/ui/analytics-dashboard-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["console"],
"variants": ["default"]
},
"name": "analytics-dashboard-card",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/chart"
],
"title": "Analytics Dashboard Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Analytics dashboard page. KPI cards, time-series charts, data tables, date range picker, export controls. Used by Mukoko Console, Nyuchi Web Services, and B2B partners. Open data compatible — sections can be made public. Competitors: Grafana, Google Analytics, Metabase.",
"docs": "Use it for: nhimbe, news, console, wallet, bushtrade.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/analytics-dashboard-page",
"files": [
{
"path": "components/registry/n6-pages/analytics-dashboard-page.tsx",
"target": "components/ui/analytics-dashboard-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["nhimbe", "news", "console", "wallet", "bushtrade"],
"variants": ["default", "loading"]
},
"name": "analytics-dashboard-page",
"registryDependencies": [],
"title": "Analytics Dashboard Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Ancestral MIT display for deceased community members. Shows the person's fixed age, memorial badge, heritage data contribution status, and ancestral pool participation. Implements the visual layer of the MIT Ancestral Lifecycle Protocol.",
"docs": "Use it for: wallet.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/ancestry-memorial",
"files": [
{
"path": "components/registry/n2-primitives/ancestry-memorial.tsx",
"target": "components/ui/ancestry-memorial.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["wallet"],
"variants": ["default", "sm", "lg"]
},
"name": "ancestry-memorial",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/avatar",
"https://api.mzizi.dev/v1/ui/badge"
],
"title": "Ancestry Memorial",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["class-variance-authority"],
"description": "Dismissible top-of-page banner for announcements with mineral-colored variants.",
"docs": "Use it for: Site-wide announcements (new features, maintenance), Promotional campaign banners, Beta program and early access announcements, Important deadline reminders, Service degradation notifications.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/announcement-bar",
"files": [
{
"path": "components/registry/n2-primitives/announcement-bar.tsx",
"target": "components/ui/announcement-bar.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Site-wide announcements (new features, maintenance)",
"Promotional campaign banners",
"Beta program and early access announcements",
"Important deadline reminders",
"Service degradation notifications"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "announcement-bar",
"registryDependencies": [],
"title": "Announcement Bar",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "API explorer/playground page. Endpoint browser, request builder, response viewer, auth token input. For Nyuchi Web Services API docs. Competitors: Swagger UI, Postman, Stripe API Reference.",
"docs": "Use it for: console.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/api-explorer-page",
"files": [
{
"path": "components/registry/n6-pages/api-explorer-page.tsx",
"target": "components/ui/api-explorer-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["console"],
"variants": ["default", "loading"]
},
"name": "api-explorer-page",
"registryDependencies": [],
"title": "API Explorer Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Masked/revealable API key with copy and regenerate actions.",
"docs": "Use it for: API key display in developer dashboard, Secret reveal with copy-to-clipboard, Webhook signing secret management, OAuth client secret display, Third-party integration credential viewing.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/api-key-display",
"files": [
{
"path": "components/registry/n2-primitives/api-key-display.tsx",
"target": "components/ui/api-key-display.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"API key display in developer dashboard",
"Secret reveal with copy-to-clipboard",
"Webhook signing secret management",
"OAuth client secret display",
"Third-party integration credential viewing"
],
"variants": ["default", "sm", "lg"]
},
"name": "api-key-display",
"registryDependencies": [],
"title": "API Key Display",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "API quota visualization with current usage, rate limit status, and throttling indicator. Shows requests/second, daily quota, and monthly billing period. Used in Nyuchi API Platform dashboard and developer portal.",
"docs": "Use it for: console.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/api-usage-meter",
"files": [
{
"path": "components/registry/n2-primitives/api-usage-meter.tsx",
"target": "components/ui/api-usage-meter.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["console"],
"variants": ["default"]
},
"name": "api-usage-meter",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/progress"
],
"title": "API Usage Meter",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["shell"],
"dependencies": ["radix-ui"],
"description": "Ecosystem app selector popover with grid of Nyuchi app icons.",
"docs": "Use it for: Ecosystem app navigation (Bundu/Mukoko/Nyuchi/Shamwari/Nhimbe), Cross-app launcher in shared header, Quick app-switching in multi-product suites, Mini-app grid in unified platform shell, Nyuchi super-app navigation surface.\nVariants: default.\nIncludes: App shell infrastructure, Cross-layer wiring (L7→L8→L9), data-slot + data-portal DOM attributes, Harness integration.\nAccessibility: Focus-visible ring on interactive elements, ARIA role, ARIA attributes.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/app-switcher",
"files": [
{
"path": "components/registry/n7-shell/app-switcher.tsx",
"target": "components/ui/app-switcher.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Focus-visible ring on interactive elements",
"ARIA role",
"ARIA attributes"
],
"collection": "shell",
"features": [
"App shell infrastructure",
"Cross-layer wiring (L7→L8→L9)",
"data-slot + data-portal DOM attributes",
"Harness integration"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": [
"Ecosystem app navigation (Bundu/Mukoko/Nyuchi/Shamwari/Nhimbe)",
"Cross-app launcher in shared header",
"Quick app-switching in multi-product suites",
"Mini-app grid in unified platform shell",
"Nyuchi super-app navigation surface"
],
"variants": ["default"]
},
"name": "app-switcher",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/popover",
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/nyuchi-harness"
],
"title": "App Switcher",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Medical appointment card showing provider name, specialty, date/time, location, and join/cancel actions. Maps to health.medical_appointment (Schema.org ScheduleAction). Used in Health mini-app and Nyuchi Medical provider views.",
"docs": "Use it for: health.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/appointment-card",
"files": [
{
"path": "components/registry/n2-primitives/appointment-card.tsx",
"target": "components/ui/appointment-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["health"],
"variants": ["default", "sm", "lg"]
},
"name": "appointment-card",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/avatar",
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/badge"
],
"title": "Appointment Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "SVG radial arc gauge (270° sweep, open at bottom). Displays a percentage value as a filled arc with the value text centered inside. Uses stroke-dasharray animation. Proper role=\"meter\" with aria-valuenow/min/max. Used for UV index, trust scores, completion percentages, health metrics, battery levels — any bounded numeric value. Production-proven in mukoko-weather MetricCard.",
"docs": "Use it for: planner, wallet, transport.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/arc-gauge",
"files": [
{
"path": "components/registry/n2-primitives/arc-gauge.tsx",
"target": "components/ui/arc-gauge.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["planner", "wallet", "transport"],
"variants": ["default", "sm", "lg"]
},
"name": "arc-gauge",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/utils"],
"title": "Arc Gauge",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Nyuchi ecosystem architecture specification — local-first data strategy and sovereignty assessment.",
"docs": "Use it for: Architecture specification display in the registry, Sovereignty assessment documentation, Data-layer strategy visualization, System design reference for AI assistants, Architecture review and audit tooling.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/architecture",
"files": [
{
"path": "components/registry/n2-primitives/architecture.ts",
"target": "lib/architecture.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Architecture specification display in the registry",
"Sovereignty assessment documentation",
"Data-layer strategy visualization",
"System design reference for AI assistants",
"Architecture review and audit tooling"
],
"variants": ["default"]
},
"name": "architecture",
"registryDependencies": [],
"title": "Architecture",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Article/news reading page. Hero image, headline, author, read time, content body, source badge, related articles. Competitors: Medium, BBC, Al Jazeera.",
"docs": "Use it for: pulse, bytes, news.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/article-page",
"files": [
{
"path": "components/registry/n6-pages/article-page.tsx",
"target": "components/ui/article-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["pulse", "bytes", "news"],
"variants": ["default", "loading"]
},
"name": "article-page",
"registryDependencies": [],
"title": "Article Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui"],
"description": "Displays content within a desired ratio.",
"docs": "Use it for: Video embed containers maintaining 16:9, Image cards maintaining square format, Map containers with fixed ratio, Chart containers with responsive aspect, Media previews with consistent proportions.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/aspect-ratio",
"files": [
{
"path": "components/registry/n2-primitives/aspect-ratio.tsx",
"target": "components/ui/aspect-ratio.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Video embed containers maintaining 16:9",
"Image cards maintaining square format",
"Map containers with fixed ratio",
"Chart containers with responsive aspect",
"Media previews with consistent proportions"
],
"variants": ["default"]
},
"name": "aspect-ratio",
"registryDependencies": [],
"title": "Aspect Ratio",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "User/team member selector for task assignment. Shows avatar, name, and availability indicator. Supports single and multi-select. Used in task assignment, event organiser roles, Circle admin assignment, and any workflow where items are assigned to people.",
"docs": "Use it for: circles, planner.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/assignee-picker",
"files": [
{
"path": "components/registry/n2-primitives/assignee-picker.tsx",
"target": "components/ui/assignee-picker.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["circles", "planner"],
"variants": ["default", "sm", "lg"]
},
"name": "assignee-picker",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/combobox",
"https://api.mzizi.dev/v1/ui/avatar",
"https://api.mzizi.dev/v1/ui/badge"
],
"title": "Assignee Picker",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Audio playback with progress bar, play/pause, and speed control.",
"docs": "Use it for: Podcast playback in Mukoko media, Voice note playback in chat, Audio article playback with speed control, Language lesson audio in learning apps, Music preview players in catalog pages.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/audio-player",
"files": [
{
"path": "components/registry/n2-primitives/audio-player.tsx",
"target": "components/ui/audio-player.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Podcast playback in Mukoko media",
"Voice note playback in chat",
"Audio article playback with speed control",
"Language lesson audio in learning apps",
"Music preview players in catalog pages"
],
"variants": ["default", "sm", "lg"]
},
"name": "audio-player",
"registryDependencies": [],
"title": "Audio Player",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Waveform visualization for audio recording, playback, and editing. Shows amplitude over time with playhead position. Used for voice notes in Campfire, audio content in Bytes, and podcast previews.",
"docs": "Use it for: campfire, bytes.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/audio-waveform",
"files": [
{
"path": "components/registry/n2-primitives/audio-waveform.tsx",
"target": "components/ui/audio-waveform.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["campfire", "bytes"],
"variants": ["default"]
},
"name": "audio-waveform",
"registryDependencies": [],
"title": "Audio Waveform",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Audit event display with actor, action, target, timestamp.",
"docs": "Use it for: Admin audit trail entries (who changed what when), Security event log display, Compliance audit history views, Moderation action log for community spaces, API access log with endpoint and response.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/audit-log-entry",
"files": [
{
"path": "components/registry/n2-primitives/audit-log-entry.tsx",
"target": "components/ui/audit-log-entry.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Admin audit trail entries (who changed what when)",
"Security event log display",
"Compliance audit history views",
"Moderation action log for community spaces",
"API access log with endpoint and response"
],
"variants": ["default", "sm", "lg"]
},
"name": "audit-log-entry",
"registryDependencies": [],
"title": "Audit Log Entry",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Author profile card with avatar, bio, works count, subscriber count, revenue sharing indicator, and follow button. Maps to identity.person + novels.work tables. Used on novel detail pages and author directory.",
"docs": "Use it for: novels.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/author-bio-card",
"files": [
{
"path": "components/registry/n2-primitives/author-bio-card.tsx",
"target": "components/ui/author-bio-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["novels"],
"variants": ["default", "sm", "lg"]
},
"name": "author-bio-card",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/avatar",
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/nyuchi-verified-badge"
],
"title": "Author Bio Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Text input with async suggestion dropdown, loading states, and keyboard navigation.",
"docs": "Use it for: Search input with suggestions, Location autocomplete with city/place predictions, User mention lookups, Tag suggestions during composition, Product search with real-time suggestions.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/autocomplete",
"files": [
{
"path": "components/registry/n2-primitives/autocomplete.tsx",
"target": "components/ui/autocomplete.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Search input with suggestions",
"Location autocomplete with city/place predictions",
"User mention lookups",
"Tag suggestions during composition",
"Product search with real-time suggestions"
],
"variants": ["default", "sm", "lg"]
},
"name": "autocomplete",
"registryDependencies": [],
"title": "Autocomplete",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui"],
"description": "An image element with a fallback for representing the user.",
"docs": "Use it for: User identity in headers and comments, Profile pictures throughout the app, Team member displays, Initial-based fallbacks for missing images, Author attribution in articles and posts.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/avatar",
"files": [
{
"path": "components/registry/n2-primitives/avatar.tsx",
"target": "components/ui/avatar.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"User identity in headers and comments",
"Profile pictures throughout the app",
"Team member displays",
"Initial-based fallbacks for missing images",
"Author attribution in articles and posts"
],
"variants": ["default", "sm", "lg"]
},
"name": "avatar",
"registryDependencies": [],
"title": "Avatar",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Overlapping avatar stack with +N overflow indicator for team displays.",
"docs": "Use it for: Team member displays in project cards, Assignee previews on tasks, Reviewer lists on pull requests and docs, Attendee previews on events, Contributor lists with +N overflow.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/avatar-group",
"files": [
{
"path": "components/registry/n2-primitives/avatar-group.tsx",
"target": "components/ui/avatar-group.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Team member displays in project cards",
"Assignee previews on tasks",
"Reviewer lists on pull requests and docs",
"Attendee previews on events",
"Contributor lists with +N overflow"
],
"variants": ["default", "sm", "lg"]
},
"name": "avatar-group",
"registryDependencies": [],
"title": "Avatar Group",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["class-variance-authority", "radix-ui"],
"description": "Displays a badge or a component that looks like a badge.",
"docs": "Use it for: Status indicators (active, pending, archived), Category labels on content, Count indicators (unread, new), Priority indicators (high, low, urgent), Tag display on posts and articles.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/badge",
"files": [
{
"path": "components/registry/n2-primitives/badge.tsx",
"target": "components/ui/badge.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Status indicators (active, pending, archived)",
"Category labels on content",
"Count indicators (unread, new)",
"Priority indicators (high, low, urgent)",
"Tag display on posts and articles"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "badge",
"registryDependencies": [],
"title": "Badge",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Multi-select action toolbar that appears when items are selected in a table or list. Shows selected count with approve-all, reject-all, export, and custom action buttons. Used across all Nyuchi Console moderation and management views.",
"docs": "Use it for: console.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/batch-action-bar",
"files": [
{
"path": "components/registry/n2-primitives/batch-action-bar.tsx",
"target": "components/ui/batch-action-bar.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["console"],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "batch-action-bar",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/button-group",
"https://api.mzizi.dev/v1/ui/badge"
],
"title": "Batch Action Bar",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["class-variance-authority"],
"description": "Asymmetric grid layout with varying tile sizes. Japanese-inspired content layout pattern for dashboards, feature showcases, and landing pages. Supports responsive breakpoint-aware tile resizing. Audit flagged as missing UX pattern. ALPHA — awaiting frontend implementation.",
"docs": "Use it for: Dashboard with mixed-size widgets, Landing page feature showcase, Product portfolio displays, Marketing surfaces with varied tile sizes, Collection galleries with hero tiles.\nVariants: default, dense, hero-lead, with-nav.\nIncludes: Tile size presets (1x1, 1x2, 2x1, 2x2), Responsive breakpoint-aware layout, Optional drag-to-resize, Auto-flow packing algorithm, Harness integration for tile-level observability.\nAccessibility: role=list for container, Each tile role=listitem, Tile focus order follows visual flow, Tiles independently accessible, Keyboard-navigable grid.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/bento-grid",
"files": [
{
"path": "components/registry/n2-primitives/bento-grid.tsx",
"target": "components/ui/bento-grid.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=list for container",
"Each tile role=listitem",
"Tile focus order follows visual flow",
"Tiles independently accessible",
"Keyboard-navigable grid"
],
"collection": "primitives",
"features": [
"Tile size presets (1x1, 1x2, 2x1, 2x2)",
"Responsive breakpoint-aware layout",
"Optional drag-to-resize",
"Auto-flow packing algorithm",
"Harness integration for tile-level observability"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Dashboard with mixed-size widgets",
"Landing page feature showcase",
"Product portfolio displays",
"Marketing surfaces with varied tile sizes",
"Collection galleries with hero tiles"
],
"variants": ["default", "dense", "hero-lead", "with-nav"]
},
"name": "bento-grid",
"registryDependencies": [],
"title": "Bento Grid",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Billing & subscription management page. Current plan, usage meters, invoices, payment methods, upgrade CTA. Used by Nyuchi Web Services, B2B partners, and Mukoko premium subscribers.",
"docs": "Use it for: nhimbe, console, wallet, bushtrade.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/billing-page",
"files": [
{
"path": "components/registry/n6-pages/billing-page.tsx",
"target": "components/ui/billing-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["nhimbe", "console", "wallet", "bushtrade"],
"variants": ["default", "loading"]
},
"name": "billing-page",
"registryDependencies": [],
"title": "Billing Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Date/time availability grid for bookings. Shows available, partially available, and unavailable slots with mineral color coding. Used for vehicle booking (Transport), venue booking (Nhimbe), and appointment scheduling (Health).",
"docs": "Use it for: nhimbe, transport, health.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/booking-calendar",
"files": [
{
"path": "components/registry/n2-primitives/booking-calendar.tsx",
"target": "components/ui/booking-calendar.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["nhimbe", "transport", "health"],
"variants": ["default", "sm", "lg"]
},
"name": "booking-calendar",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/calendar",
"https://api.mzizi.dev/v1/ui/time-slot-picker"
],
"title": "Booking Calendar",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Booking success card with full details, QR code, calendar-add button, and share action. The standard post-booking confirmation pattern across Nhimbe events, Transport bookings, and Health appointments. Maps to planner.reservation table.",
"docs": "Use it for: nhimbe, planner, transport.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/booking-confirmation",
"files": [
{
"path": "components/registry/n2-primitives/booking-confirmation.tsx",
"target": "components/ui/booking-confirmation.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["nhimbe", "planner", "transport"],
"variants": ["default", "sm", "lg"]
},
"name": "booking-confirmation",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/separator",
"https://api.mzizi.dev/v1/ui/badge"
],
"title": "Booking Confirmation",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Booking/reservation page. Service/ride selection, date/time picker, provider selection, confirmation. Used by transport, health, events.",
"docs": "Use it for: events, places, transport, health.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/booking-page",
"files": [
{
"path": "components/registry/n6-pages/booking-page.tsx",
"target": "components/ui/booking-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["events", "places", "transport", "health"],
"variants": ["default", "loading"]
},
"name": "booking-page",
"registryDependencies": [],
"title": "Booking Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Mobile slide-up panel with drag handle, backdrop, and slide-up animation.",
"docs": "Use it for: Mobile action sheets and option pickers, Mobile forms in sheet format, Detail expansions on mobile, Sharing menus in mobile context, Quick filters in mobile search.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/bottom-sheet",
"files": [
{
"path": "components/registry/n2-primitives/bottom-sheet.tsx",
"target": "components/ui/bottom-sheet.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Mobile action sheets and option pickers",
"Mobile forms in sheet format",
"Detail expansions on mobile",
"Sharing menus in mobile context",
"Quick filters in mobile search"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "bottom-sheet",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/button"],
"title": "Bottom Sheet",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui"],
"description": "Displays the path to the current resource using a hierarchy of links.",
"docs": "Use it for: Deep-linked page navigation (folders/subfolders/files), E-commerce category hierarchy, Admin console location indicators, Documentation nested page navigation, Multi-step form progress breadcrumbs.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/breadcrumb",
"files": [
{
"path": "components/registry/n2-primitives/breadcrumb.tsx",
"target": "components/ui/breadcrumb.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Deep-linked page navigation (folders/subfolders/files)",
"E-commerce category hierarchy",
"Admin console location indicators",
"Documentation nested page navigation",
"Multi-step form progress breadcrumbs"
],
"variants": ["default", "sm", "lg"]
},
"name": "breadcrumb",
"registryDependencies": [],
"title": "Breadcrumb",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Concurrency isolation pattern inspired by Resilience4j Bulkhead. Limits how many concurrent calls can hit a single dependency so one slow service cannot consume all available connections and starve other operations. Named after ship bulkheads that prevent a single hull breach from sinking the whole vessel. Supports both semaphore-style (max concurrent) and queue-style (max waiting) isolation. Integrates with observability for tracking concurrent call counts and rejection rates.",
"docs": "Use it for: Isolating slow external API calls (Tomorrow.io, Anthropic), Preventing connection exhaustion to payment providers, Limiting concurrent database queries per service, Protecting AI service calls during traffic spikes, Third-party registry lookups with concurrency caps.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/bulkhead",
"files": [
{
"path": "components/registry/n2-primitives/bulkhead.ts",
"target": "lib/bulkhead.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Isolating slow external API calls (Tomorrow.io, Anthropic)",
"Preventing connection exhaustion to payment providers",
"Limiting concurrent database queries per service",
"Protecting AI service calls during traffic spikes",
"Third-party registry lookups with concurrency caps"
],
"variants": ["default"]
},
"name": "bulkhead",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/observability"],
"title": "Bulkhead",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui", "class-variance-authority"],
"description": "Displays a button or a component that looks like a button.",
"docs": "Use it for: Primary CTA (mineral accent), Secondary action (outline/ghost), Destructive action (delete, remove), Icon-only action, Link-style navigation.\nVariants: default, outline, secondary, ghost, destructive, link.\nSizes: default (56px), sm (48px), lg (56px wide), icon (56px square), icon-sm (48px square).\nIncludes: Pill-shaped (rounded-full) per brand standard, data-slot attribute for CSS targeting, asChild support via Radix Slot, Disabled state with pointer-events-none.\nAccessibility: Focus-visible ring with --ring token, aria-invalid styling, Minimum 48px touch target, Keyboard accessible (Enter/Space).\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/button",
"files": [
{
"path": "components/registry/n2-primitives/button.tsx",
"target": "components/ui/button.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Focus-visible ring with --ring token",
"aria-invalid styling",
"Minimum 48px touch target",
"Keyboard accessible (Enter/Space)"
],
"collection": "components",
"features": [
"Pill-shaped (rounded-full) per brand standard",
"data-slot attribute for CSS targeting",
"asChild support via Radix Slot",
"Disabled state with pointer-events-none"
],
"hasDemo": true,
"owner": "framework",
"sizes": [
"default (56px)",
"sm (48px)",
"lg (56px wide)",
"icon (56px square)",
"icon-sm (48px square)"
],
"useCases": [
"Primary CTA (mineral accent)",
"Secondary action (outline/ghost)",
"Destructive action (delete, remove)",
"Icon-only action",
"Link-style navigation"
],
"variants": [
"default",
"outline",
"secondary",
"ghost",
"destructive",
"link"
]
},
"name": "button",
"registryDependencies": [],
"title": "Button",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["class-variance-authority", "radix-ui"],
"description": "Groups related buttons together.",
"docs": "Use it for: Grouping related primary/secondary actions (save and cancel), Segmented toolbar controls with connected visual boundary, Filter toolbar with multi-state selection, View switcher (grid/list/calendar) in dashboards, Inline form action pairs (apply/reset, yes/no).\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/button-group",
"files": [
{
"path": "components/registry/n2-primitives/button-group.tsx",
"target": "components/ui/button-group.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Grouping related primary/secondary actions (save and cancel)",
"Segmented toolbar controls with connected visual boundary",
"Filter toolbar with multi-state selection",
"View switcher (grid/list/calendar) in dashboards",
"Inline form action pairs (apply/reset, yes/no)"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "button-group",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/separator"],
"title": "Button Group",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["react-day-picker"],
"description": "A date field component that allows users to enter and edit dates.",
"docs": "Use it for: Full calendar with day, week, and month views, Booking and scheduling interfaces, Event calendar displays, Availability viewers, Personal and team calendar apps.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/calendar",
"files": [
{
"path": "components/registry/n2-primitives/calendar.tsx",
"target": "components/ui/calendar.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Full calendar with day, week, and month views",
"Booking and scheduling interfaces",
"Event calendar displays",
"Availability viewers",
"Personal and team calendar apps"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "calendar",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/button"],
"title": "Calendar",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Single-day time grid with hourly slots and event blocks.",
"docs": "Use it for: Single-day detail view in booking apps, Hour-by-hour agenda displays, Daily task timeline, Appointment day view, Daily schedule in productivity apps.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/calendar-day-view",
"files": [
{
"path": "components/registry/n2-primitives/calendar-day-view.tsx",
"target": "components/ui/calendar-day-view.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Single-day detail view in booking apps",
"Hour-by-hour agenda displays",
"Daily task timeline",
"Appointment day view",
"Daily schedule in productivity apps"
],
"variants": ["default"]
},
"name": "calendar-day-view",
"registryDependencies": [],
"title": "Calendar Day View",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Full month calendar grid with event dots, today indicator, and day cell click handler. Complements calendar-day-view and calendar-week-view to complete the three standard calendar views. The month grid is the most common calendar entry point across all apps.",
"docs": "Use it for: planner, nhimbe, health.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/calendar-month-view",
"files": [
{
"path": "components/registry/n2-primitives/calendar-month-view.tsx",
"target": "components/ui/calendar-month-view.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["planner", "nhimbe", "health"],
"variants": ["default", "sm", "lg"]
},
"name": "calendar-month-view",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/calendar"],
"title": "Calendar Month View",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "7-column weekly calendar view with hourly time slots.",
"docs": "Use it for: Weekly schedule overview, Team calendar with week view, Work week planning interfaces, Recurring meeting visualisation, Weekly appointment browsing.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/calendar-week-view",
"files": [
{
"path": "components/registry/n2-primitives/calendar-week-view.tsx",
"target": "components/ui/calendar-week-view.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Weekly schedule overview",
"Team calendar with week view",
"Work week planning interfaces",
"Recurring meeting visualisation",
"Weekly appointment browsing"
],
"variants": ["default"]
},
"name": "calendar-week-view",
"registryDependencies": [],
"title": "Calendar Week View",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Camera preview overlay with branded recording indicator, timer display, and effects panel trigger. The creation entry point for Bytes short-form video and Campfire media messages. Pill-shaped record button with malachite accent.",
"docs": "Use it for: campfire, bytes.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/camera-viewfinder",
"files": [
{
"path": "components/registry/n2-primitives/camera-viewfinder.tsx",
"target": "components/ui/camera-viewfinder.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["campfire", "bytes"],
"variants": ["default", "sm", "lg"]
},
"name": "camera-viewfinder",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/button"],
"title": "Camera Viewfinder",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["chart.js", "react-chartjs-2"],
"description": "Chart.js Canvas-based chart renderer for data-heavy dashboards. Use INSTEAD of the Recharts chart when you have 100+ data points per chart or multiple charts per page. Canvas renders everything to a single DOM element regardless of data volume, while SVG (Recharts) creates a DOM node per data point. Includes CSS variable resolution for Canvas 2D context (which cannot read var() natively), theme-aware color fallbacks, mobile performance optimisation (reduced DPR, disabled animations), and automatic Chart.js instance cleanup on unmount to prevent canvas memory leaks. Production-proven in mukoko-weather with 7 charts × 365 data points.",
"docs": "Use it for: nhimbe, planner, news.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/canvas-chart",
"files": [
{
"path": "components/registry/n2-primitives/canvas-chart.tsx",
"target": "components/ui/canvas-chart.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["nhimbe", "planner", "news"],
"variants": ["default"]
},
"name": "canvas-chart",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/nyuchi-tokens",
"https://api.mzizi.dev/v1/ui/nyuchi-tokens-typescript"
],
"title": "Canvas Chart",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Overlay text editor for video captions and story text. Supports font selection (Noto Sans/Serif), text color from mineral palette, position dragging, and size adjustment. Used in Bytes and story creation.",
"docs": "Use it for: bytes.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/caption-editor",
"files": [
{
"path": "components/registry/n2-primitives/caption-editor.tsx",
"target": "components/ui/caption-editor.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["bytes"],
"variants": ["default", "sm", "lg"]
},
"name": "caption-editor",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/input",
"https://api.mzizi.dev/v1/ui/color-picker"
],
"title": "Caption Editor",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": [],
"description": "Displays a card with header, content, and footer.",
"docs": "Use it for: Content container for listings, profiles, data display, Dashboard widget container, Form section grouping, Notification/alert container.\nVariants: default, with header, with footer, with header and footer.\nIncludes: Semantic surface (bg-card), Border with --border token, Radius from --radius-xl token, data-slot on all sub-components.\nAccessibility: Landmark-compatible, Focus management for interactive cards.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/card",
"files": [
{
"path": "components/registry/n2-primitives/card.tsx",
"target": "components/ui/card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Landmark-compatible",
"Focus management for interactive cards"
],
"collection": "components",
"features": [
"Semantic surface (bg-card)",
"Border with --border token",
"Radius from --radius-xl token",
"data-slot on all sub-components"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Content container for listings, profiles, data display",
"Dashboard widget container",
"Form section grouping",
"Notification/alert container"
],
"variants": [
"default",
"with header",
"with footer",
"with header and footer"
]
},
"name": "card",
"registryDependencies": [],
"title": "Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["embla-carousel-react"],
"description": "A carousel with motion and swipe built using Embla.",
"docs": "Use it for: Image galleries with swipe on mobile, Featured product rotation on homepages, Onboarding step sequence with swipe, Testimonial and review rotation, Multi-image product showcases.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/carousel",
"files": [
{
"path": "components/registry/n2-primitives/carousel.tsx",
"target": "components/ui/carousel.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Image galleries with swipe on mobile",
"Featured product rotation on homepages",
"Onboarding step sequence with swipe",
"Testimonial and review rotation",
"Multi-image product showcases"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "carousel",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/button"],
"title": "Carousel",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Shopping cart line item with quantity controls and remove action.",
"docs": "Use it for: Shopping cart display in BushTrade checkout, Order review before payment, Saved items in wishlist management, Cart preview in header dropdown, Quantity-editable cart line items.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/cart-item",
"files": [
{
"path": "components/registry/n2-primitives/cart-item.tsx",
"target": "components/ui/cart-item.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Shopping cart display in BushTrade checkout",
"Order review before payment",
"Saved items in wishlist management",
"Cart preview in header dropdown",
"Quantity-editable cart line items"
],
"variants": ["default", "sm", "lg"]
},
"name": "cart-item",
"registryDependencies": [],
"title": "Cart Item",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Grid of browsable categories with icons, counts, and mineral-colored accents.",
"docs": "Use it for: Top-level category navigation in marketplaces, Topic browsing on content sites, Course catalog browsing in learning apps, Module selection in admin consoles, Service category entry points on homepages.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/category-browser",
"files": [
{
"path": "components/registry/n2-primitives/category-browser.tsx",
"target": "components/ui/category-browser.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Top-level category navigation in marketplaces",
"Topic browsing on content sites",
"Course catalog browsing in learning apps",
"Module selection in admin consoles",
"Service category entry points on homepages"
],
"variants": ["default"]
},
"name": "category-browser",
"registryDependencies": [],
"title": "Category Browser",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Version update card with categorized changes.",
"docs": "Use it for: Release notes display on mzizi.dev, Product update cards in changelog feeds, Version history in admin dashboards, API changelog entries for developer docs, Feature announcement timeline.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/changelog-entry",
"files": [
{
"path": "components/registry/n2-primitives/changelog-entry.tsx",
"target": "components/ui/changelog-entry.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Release notes display on mzizi.dev",
"Product update cards in changelog feeds",
"Version history in admin dashboards",
"API changelog entries for developer docs",
"Feature announcement timeline"
],
"variants": ["default"]
},
"name": "changelog-entry",
"registryDependencies": [],
"title": "Changelog Entry",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Chaos testing utilities for injecting random errors and latency to test resilience.",
"docs": "Use it for: Injecting chaos in test environments to verify resilience, Validating error handling during Layer 8 assurance runs, Failure-mode testing in dev before production, Conformity check stress testing, Synthetic probe fault injection.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chaos",
"files": [
{
"path": "components/registry/n2-primitives/chaos.ts",
"target": "lib/chaos.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Injecting chaos in test environments to verify resilience",
"Validating error handling during Layer 8 assurance runs",
"Failure-mode testing in dev before production",
"Conformity check stress testing",
"Synthetic probe fault injection"
],
"variants": ["default"]
},
"name": "chaos",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/observability"],
"title": "Chaos",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Table of contents / chapter navigation for serialized works. Shows chapter titles, word counts, publish dates, and locked/unlocked status for subscription-gated content. Maps to novels.chapter table.",
"docs": "Use it for: novels.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chapter-list",
"files": [
{
"path": "components/registry/n2-primitives/chapter-list.tsx",
"target": "components/ui/chapter-list.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["novels"],
"variants": ["default"]
},
"name": "chapter-list",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/accordion"],
"title": "Chapter List",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["dompurify"],
"description": "Optimized long-form reading view with page/scroll modes, bookmark, highlight, and note-in-margin functionality. Adjustable Noto Serif typography. The core reading experience for Novels, competing with Wattpad and Tapas reader quality.",
"docs": "Use it for: novels.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chapter-reader",
"files": [
{
"path": "components/registry/n2-primitives/chapter-reader.tsx",
"target": "components/ui/chapter-reader.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["novels"],
"variants": ["default"]
},
"name": "chapter-reader",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/scroll-area"],
"title": "Chapter Reader",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Beautiful charts built using Recharts. Copy and paste into your apps.",
"docs": "Use it for: Foundation chart primitive for all dashboard charts, Base chart container with theming, Shared chart config and legend infrastructure, Root chart wrapper for Recharts composition, Theme-aware chart shell.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart",
"files": [
{
"path": "components/registry/n2-primitives/chart.tsx",
"target": "components/ui/chart.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Foundation chart primitive for all dashboard charts",
"Base chart container with theming",
"Shared chart config and legend infrastructure",
"Root chart wrapper for Recharts composition",
"Theme-aware chart shell"
],
"variants": ["default"]
},
"name": "chart",
"registryDependencies": [],
"title": "Chart",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Area chart — axes variant.",
"docs": "Use it for: Data-rich dashboards with labelled axes, Scientific and technical visualizations, Dashboards needing explicit scale, Engineering and monitoring displays, Analytical views where values need reading.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-area-axes",
"files": [
{
"path": "components/registry/n2-primitives/chart-area-axes.tsx",
"target": "components/blocks/charts/chart-area-axes.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Data-rich dashboards with labelled axes",
"Scientific and technical visualizations",
"Dashboards needing explicit scale",
"Engineering and monitoring displays",
"Analytical views where values need reading"
],
"variants": ["default"]
},
"name": "chart-area-axes",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Area Axes",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Area chart — default variant.",
"docs": "Use it for: Daily active users trending over time, Revenue trajectory visualisation, Resource utilization over the last 30 days, Traffic volume dashboards, Basic trend exploration.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-area-default",
"files": [
{
"path": "components/registry/n2-primitives/chart-area-default.tsx",
"target": "components/blocks/charts/chart-area-default.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Daily active users trending over time",
"Revenue trajectory visualisation",
"Resource utilization over the last 30 days",
"Traffic volume dashboards",
"Basic trend exploration"
],
"variants": ["default"]
},
"name": "chart-area-default",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Area Default",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Area chart — gradient variant.",
"docs": "Use it for: Heat-tinted volume displays (warmth indicates high values), Design-forward dashboards with gradient accents, Aesthetic analytics with mineral-colored areas, Feature showcase charts, Polished presentation dashboards.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-area-gradient",
"files": [
{
"path": "components/registry/n2-primitives/chart-area-gradient.tsx",
"target": "components/blocks/charts/chart-area-gradient.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Heat-tinted volume displays (warmth indicates high values)",
"Design-forward dashboards with gradient accents",
"Aesthetic analytics with mineral-colored areas",
"Feature showcase charts",
"Polished presentation dashboards"
],
"variants": ["default"]
},
"name": "chart-area-gradient",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Area Gradient",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Area chart — icons variant.",
"docs": "Use it for: Category-labelled trend displays with icons, Marketing dashboards (channels with icons), Product metric trends with category identifiers, Human-readable analytics with visual cues, Executive dashboards with brand identity.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-area-icons",
"files": [
{
"path": "components/registry/n2-primitives/chart-area-icons.tsx",
"target": "components/blocks/charts/chart-area-icons.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Category-labelled trend displays with icons",
"Marketing dashboards (channels with icons)",
"Product metric trends with category identifiers",
"Human-readable analytics with visual cues",
"Executive dashboards with brand identity"
],
"variants": ["default"]
},
"name": "chart-area-icons",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Area Icons",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Area chart — interactive variant.",
"docs": "Use it for: Interactive trend exploration with hover, Drill-down analytics dashboards, Comparison mode with click-to-highlight series, Date-range exploration in analytics, Executive dashboards with hover detail.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-area-interactive",
"files": [
{
"path": "components/registry/n2-primitives/chart-area-interactive.tsx",
"target": "components/blocks/charts/chart-area-interactive.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Interactive trend exploration with hover",
"Drill-down analytics dashboards",
"Comparison mode with click-to-highlight series",
"Date-range exploration in analytics",
"Executive dashboards with hover detail"
],
"variants": ["default"]
},
"name": "chart-area-interactive",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Area Interactive",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Area chart — legend variant.",
"docs": "Use it for: Multi-series trend with color-coded legend, Comparison dashboards (this year vs last year), Segment performance over time, A/B test result visualization, Campaign comparison analytics.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-area-legend",
"files": [
{
"path": "components/registry/n2-primitives/chart-area-legend.tsx",
"target": "components/blocks/charts/chart-area-legend.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Multi-series trend with color-coded legend",
"Comparison dashboards (this year vs last year)",
"Segment performance over time",
"A/B test result visualization",
"Campaign comparison analytics"
],
"variants": ["default"]
},
"name": "chart-area-legend",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Area Legend",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Area chart — linear variant.",
"docs": "Use it for: Linear trend over time (straight-line projections), Simple clean trajectory visualizations, Performance tracking without interpolation, Linear growth displays, Data-confidence visualisation without smoothing.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-area-linear",
"files": [
{
"path": "components/registry/n2-primitives/chart-area-linear.tsx",
"target": "components/blocks/charts/chart-area-linear.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Linear trend over time (straight-line projections)",
"Simple clean trajectory visualizations",
"Performance tracking without interpolation",
"Linear growth displays",
"Data-confidence visualisation without smoothing"
],
"variants": ["default"]
},
"name": "chart-area-linear",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Area Linear",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Area chart — stacked variant.",
"docs": "Use it for: Multi-metric trend comparison (signups vs churn), Stacked revenue by product line, Cohort comparison over time, Segment breakdown with totals, Visual volume comparisons.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-area-stacked",
"files": [
{
"path": "components/registry/n2-primitives/chart-area-stacked.tsx",
"target": "components/blocks/charts/chart-area-stacked.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Multi-metric trend comparison (signups vs churn)",
"Stacked revenue by product line",
"Cohort comparison over time",
"Segment breakdown with totals",
"Visual volume comparisons"
],
"variants": ["default"]
},
"name": "chart-area-stacked",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Area Stacked",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Area chart — stacked expand variant.",
"docs": "Use it for: Stacked percentage share over time (market share), Cohort retention percentages, Channel contribution to total visitors, Resource allocation percentage trends, Normalised multi-series visualisation.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-area-stacked-expand",
"files": [
{
"path": "components/registry/n2-primitives/chart-area-stacked-expand.tsx",
"target": "components/blocks/charts/chart-area-stacked-expand.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Stacked percentage share over time (market share)",
"Cohort retention percentages",
"Channel contribution to total visitors",
"Resource allocation percentage trends",
"Normalised multi-series visualisation"
],
"variants": ["default"]
},
"name": "chart-area-stacked-expand",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Area Stacked Expand",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Area chart — step variant.",
"docs": "Use it for: Threshold-based performance tracking (sprint velocity), Discrete state changes over time, Inventory level changes between events, Price steps in pricing plans over time, Stepwise data where values hold between points.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-area-step",
"files": [
{
"path": "components/registry/n2-primitives/chart-area-step.tsx",
"target": "components/blocks/charts/chart-area-step.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Threshold-based performance tracking (sprint velocity)",
"Discrete state changes over time",
"Inventory level changes between events",
"Price steps in pricing plans over time",
"Stepwise data where values hold between points"
],
"variants": ["default"]
},
"name": "chart-area-step",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Area Step",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Bar chart — active variant.",
"docs": "Use it for: Hover-state-aware ranking displays, Executive dashboards with hover emphasis, Category ranking with visual feedback, Top-N displays with highlight, Active category indication.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-bar-active",
"files": [
{
"path": "components/registry/n2-primitives/chart-bar-active.tsx",
"target": "components/blocks/charts/chart-bar-active.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Hover-state-aware ranking displays",
"Executive dashboards with hover emphasis",
"Category ranking with visual feedback",
"Top-N displays with highlight",
"Active category indication"
],
"variants": ["default"]
},
"name": "chart-bar-active",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Bar Active",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Bar chart — default variant.",
"docs": "Use it for: Category comparison (sales by region), Ranking visualizations (top 10 products), Vote and survey results, Revenue by department, Basic categorical comparisons.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-bar-default",
"files": [
{
"path": "components/registry/n2-primitives/chart-bar-default.tsx",
"target": "components/blocks/charts/chart-bar-default.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Category comparison (sales by region)",
"Ranking visualizations (top 10 products)",
"Vote and survey results",
"Revenue by department",
"Basic categorical comparisons"
],
"variants": ["default"]
},
"name": "chart-bar-default",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Bar Default",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Bar chart — horizontal variant.",
"docs": "Use it for: Horizontal category ranking (long category names), Mobile-friendly bar charts, Dense listings where vertical space is limited, Percentile and rating displays, Label-heavy category comparisons.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-bar-horizontal",
"files": [
{
"path": "components/registry/n2-primitives/chart-bar-horizontal.tsx",
"target": "components/blocks/charts/chart-bar-horizontal.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Horizontal category ranking (long category names)",
"Mobile-friendly bar charts",
"Dense listings where vertical space is limited",
"Percentile and rating displays",
"Label-heavy category comparisons"
],
"variants": ["default"]
},
"name": "chart-bar-horizontal",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Bar Horizontal",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Bar chart — interactive variant.",
"docs": "Use it for: Interactive ranking with drill-down, Click-to-filter category bar charts, Analytics dashboards with bar click, Explorable category breakdowns, Segment drill-down from bar visualizations.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-bar-interactive",
"files": [
{
"path": "components/registry/n2-primitives/chart-bar-interactive.tsx",
"target": "components/blocks/charts/chart-bar-interactive.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Interactive ranking with drill-down",
"Click-to-filter category bar charts",
"Analytics dashboards with bar click",
"Explorable category breakdowns",
"Segment drill-down from bar visualizations"
],
"variants": ["default"]
},
"name": "chart-bar-interactive",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Bar Interactive",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Bar chart — label variant.",
"docs": "Use it for: Bar charts with inline value labels, Presentation dashboards (no hover needed), Static reports with visible values, Executive summaries with explicit numbers, Print-ready dashboards.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-bar-label",
"files": [
{
"path": "components/registry/n2-primitives/chart-bar-label.tsx",
"target": "components/blocks/charts/chart-bar-label.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Bar charts with inline value labels",
"Presentation dashboards (no hover needed)",
"Static reports with visible values",
"Executive summaries with explicit numbers",
"Print-ready dashboards"
],
"variants": ["default"]
},
"name": "chart-bar-label",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Bar Label",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Bar chart — label custom variant.",
"docs": "Use it for: Bar charts with custom-styled value labels, Brand-consistent inline labels with mineral colors, Design-polished dashboards, Marketing report charts, Custom label positioning for readability.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-bar-label-custom",
"files": [
{
"path": "components/registry/n2-primitives/chart-bar-label-custom.tsx",
"target": "components/blocks/charts/chart-bar-label-custom.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Bar charts with custom-styled value labels",
"Brand-consistent inline labels with mineral colors",
"Design-polished dashboards",
"Marketing report charts",
"Custom label positioning for readability"
],
"variants": ["default"]
},
"name": "chart-bar-label-custom",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Bar Label Custom",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Bar chart — mixed variant.",
"docs": "Use it for: Mixed-unit comparisons (bars + values labelled), Dashboards showing both bar and numeric context, Data tables augmented with bar visualisation, Hybrid chart + label presentations, Metric cards with inline bars.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-bar-mixed",
"files": [
{
"path": "components/registry/n2-primitives/chart-bar-mixed.tsx",
"target": "components/blocks/charts/chart-bar-mixed.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Mixed-unit comparisons (bars + values labelled)",
"Dashboards showing both bar and numeric context",
"Data tables augmented with bar visualisation",
"Hybrid chart + label presentations",
"Metric cards with inline bars"
],
"variants": ["default"]
},
"name": "chart-bar-mixed",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Bar Mixed",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Bar chart — multiple variant.",
"docs": "Use it for: Multi-series category comparison (current vs previous), Grouped bar displays with multiple measures, Before/after comparisons by category, Survey results across multiple questions, Department performance comparison.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-bar-multiple",
"files": [
{
"path": "components/registry/n2-primitives/chart-bar-multiple.tsx",
"target": "components/blocks/charts/chart-bar-multiple.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Multi-series category comparison (current vs previous)",
"Grouped bar displays with multiple measures",
"Before/after comparisons by category",
"Survey results across multiple questions",
"Department performance comparison"
],
"variants": ["default"]
},
"name": "chart-bar-multiple",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Bar Multiple",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Bar chart — negative variant.",
"docs": "Use it for: Profit/loss visualization with negative values, Net change displays (gains vs losses), Sentiment analysis (positive vs negative), Account balance changes, Comparison against baseline.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-bar-negative",
"files": [
{
"path": "components/registry/n2-primitives/chart-bar-negative.tsx",
"target": "components/blocks/charts/chart-bar-negative.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Profit/loss visualization with negative values",
"Net change displays (gains vs losses)",
"Sentiment analysis (positive vs negative)",
"Account balance changes",
"Comparison against baseline"
],
"variants": ["default"]
},
"name": "chart-bar-negative",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Bar Negative",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Bar chart — stacked variant.",
"docs": "Use it for: Stacked category comparison (revenue by product and region), Budget allocation breakdowns, Traffic source stacks, Cohort segmentation visualization, Multi-dimension categorical analysis.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-bar-stacked",
"files": [
{
"path": "components/registry/n2-primitives/chart-bar-stacked.tsx",
"target": "components/blocks/charts/chart-bar-stacked.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Stacked category comparison (revenue by product and region)",
"Budget allocation breakdowns",
"Traffic source stacks",
"Cohort segmentation visualization",
"Multi-dimension categorical analysis"
],
"variants": ["default"]
},
"name": "chart-bar-stacked",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Bar Stacked",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Line chart — default variant.",
"docs": "Use it for: Time-series trend visualization, Performance metric tracking over time, Stock and price tracking, User growth dashboards, Basic trend analysis.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-line-default",
"files": [
{
"path": "components/registry/n2-primitives/chart-line-default.tsx",
"target": "components/blocks/charts/chart-line-default.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Time-series trend visualization",
"Performance metric tracking over time",
"Stock and price tracking",
"User growth dashboards",
"Basic trend analysis"
],
"variants": ["default"]
},
"name": "chart-line-default",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Line Default",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Line chart — dots variant.",
"docs": "Use it for: Line charts with data point markers, Sparse time-series with discrete points, Quarterly and monthly trending with emphasis, Event-based trending (each point significant), Presentation-quality trend charts.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-line-dots",
"files": [
{
"path": "components/registry/n2-primitives/chart-line-dots.tsx",
"target": "components/blocks/charts/chart-line-dots.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Line charts with data point markers",
"Sparse time-series with discrete points",
"Quarterly and monthly trending with emphasis",
"Event-based trending (each point significant)",
"Presentation-quality trend charts"
],
"variants": ["default"]
},
"name": "chart-line-dots",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Line Dots",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Line chart — dots colors variant.",
"docs": "Use it for: Trend charts with mineral-colored dots, Category-aware line charts with styled points, Brand-consistent visualization, Metric dashboards with colored highlights, Color-coded data point trending.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-line-dots-colors",
"files": [
{
"path": "components/registry/n2-primitives/chart-line-dots-colors.tsx",
"target": "components/blocks/charts/chart-line-dots-colors.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Trend charts with mineral-colored dots",
"Category-aware line charts with styled points",
"Brand-consistent visualization",
"Metric dashboards with colored highlights",
"Color-coded data point trending"
],
"variants": ["default"]
},
"name": "chart-line-dots-colors",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Line Dots Colors",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Line chart — dots custom variant.",
"docs": "Use it for: Custom-styled dot trend charts, Polished presentation dashboards, Brand-consistent trend visualization, Marketing report charts, Styled analytics for external reports.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-line-dots-custom",
"files": [
{
"path": "components/registry/n2-primitives/chart-line-dots-custom.tsx",
"target": "components/blocks/charts/chart-line-dots-custom.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Custom-styled dot trend charts",
"Polished presentation dashboards",
"Brand-consistent trend visualization",
"Marketing report charts",
"Styled analytics for external reports"
],
"variants": ["default"]
},
"name": "chart-line-dots-custom",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Line Dots Custom",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Line chart — interactive variant.",
"docs": "Use it for: Interactive trend exploration, Hover-driven date detail, Drill-down line charts, Analytics with click-to-zoom, Executive dashboards with hover interactivity.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-line-interactive",
"files": [
{
"path": "components/registry/n2-primitives/chart-line-interactive.tsx",
"target": "components/blocks/charts/chart-line-interactive.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Interactive trend exploration",
"Hover-driven date detail",
"Drill-down line charts",
"Analytics with click-to-zoom",
"Executive dashboards with hover interactivity"
],
"variants": ["default"]
},
"name": "chart-line-interactive",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Line Interactive",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Line chart — label variant.",
"docs": "Use it for: Labelled trend points in line charts, Static reports with visible values, Executive dashboards with explicit numbers, Report-ready trend visualisations, Print-ready line charts.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-line-label",
"files": [
{
"path": "components/registry/n2-primitives/chart-line-label.tsx",
"target": "components/blocks/charts/chart-line-label.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Labelled trend points in line charts",
"Static reports with visible values",
"Executive dashboards with explicit numbers",
"Report-ready trend visualisations",
"Print-ready line charts"
],
"variants": ["default"]
},
"name": "chart-line-label",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Line Label",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Line chart — label custom variant.",
"docs": "Use it for: Custom-labelled trend visualizations, Brand-polished dashboards, Marketing analytics with custom labels, Design-forward trend presentations, Executive summary charts.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-line-label-custom",
"files": [
{
"path": "components/registry/n2-primitives/chart-line-label-custom.tsx",
"target": "components/blocks/charts/chart-line-label-custom.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Custom-labelled trend visualizations",
"Brand-polished dashboards",
"Marketing analytics with custom labels",
"Design-forward trend presentations",
"Executive summary charts"
],
"variants": ["default"]
},
"name": "chart-line-label-custom",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Line Label Custom",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Line chart — linear variant.",
"docs": "Use it for: Linear interpolation trends (no smoothing), Point-by-point trajectory visualization, Scientific data with confidence in each point, Engineering metric displays, Data without implied continuity between points.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-line-linear",
"files": [
{
"path": "components/registry/n2-primitives/chart-line-linear.tsx",
"target": "components/blocks/charts/chart-line-linear.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Linear interpolation trends (no smoothing)",
"Point-by-point trajectory visualization",
"Scientific data with confidence in each point",
"Engineering metric displays",
"Data without implied continuity between points"
],
"variants": ["default"]
},
"name": "chart-line-linear",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Line Linear",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Line chart — multiple variant.",
"docs": "Use it for: Multi-series line comparison, Cohort comparison charts (last month vs this month), Regional performance overlay, A/B test result visualization, Segment comparison in analytics.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-line-multiple",
"files": [
{
"path": "components/registry/n2-primitives/chart-line-multiple.tsx",
"target": "components/blocks/charts/chart-line-multiple.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Multi-series line comparison",
"Cohort comparison charts (last month vs this month)",
"Regional performance overlay",
"A/B test result visualization",
"Segment comparison in analytics"
],
"variants": ["default"]
},
"name": "chart-line-multiple",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Line Multiple",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Line chart — step variant.",
"docs": "Use it for: Stepwise change visualisation (inventory changes), Binary state over time (on/off, active/inactive), Discrete value transitions, Pricing history step changes, Configuration change timelines.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-line-step",
"files": [
{
"path": "components/registry/n2-primitives/chart-line-step.tsx",
"target": "components/blocks/charts/chart-line-step.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Stepwise change visualisation (inventory changes)",
"Binary state over time (on/off, active/inactive)",
"Discrete value transitions",
"Pricing history step changes",
"Configuration change timelines"
],
"variants": ["default"]
},
"name": "chart-line-step",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Line Step",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Pie chart — donut variant.",
"docs": "Use it for: Modern donut chart (pie with center hole), Category proportion with central label space, Progress-style proportion displays, Aesthetic distribution charts, Dashboard distribution with center metric.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-pie-donut",
"files": [
{
"path": "components/registry/n2-primitives/chart-pie-donut.tsx",
"target": "components/blocks/charts/chart-pie-donut.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Modern donut chart (pie with center hole)",
"Category proportion with central label space",
"Progress-style proportion displays",
"Aesthetic distribution charts",
"Dashboard distribution with center metric"
],
"variants": ["default"]
},
"name": "chart-pie-donut",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Pie Donut",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Pie chart — donut active variant.",
"docs": "Use it for: Interactive donut with hover-highlighted segment, Dashboard with click-to-filter segments, Explorable proportion charts, Drill-down distribution visualisations, Active-segment emphasized displays.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-pie-donut-active",
"files": [
{
"path": "components/registry/n2-primitives/chart-pie-donut-active.tsx",
"target": "components/blocks/charts/chart-pie-donut-active.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Interactive donut with hover-highlighted segment",
"Dashboard with click-to-filter segments",
"Explorable proportion charts",
"Drill-down distribution visualisations",
"Active-segment emphasized displays"
],
"variants": ["default"]
},
"name": "chart-pie-donut-active",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Pie Donut Active",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Pie chart — donut text variant.",
"docs": "Use it for: Donut with center metric (total), KPI card with supporting distribution, Progress summary with breakdown, Executive dashboards with central number, Metric + context combined visualisation.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-pie-donut-text",
"files": [
{
"path": "components/registry/n2-primitives/chart-pie-donut-text.tsx",
"target": "components/blocks/charts/chart-pie-donut-text.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Donut with center metric (total)",
"KPI card with supporting distribution",
"Progress summary with breakdown",
"Executive dashboards with central number",
"Metric + context combined visualisation"
],
"variants": ["default"]
},
"name": "chart-pie-donut-text",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Pie Donut Text",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Pie chart — interactive variant.",
"docs": "Use it for: Interactive pie with drill-down, Click-to-filter proportion charts, Explorable category breakdowns, Analytics with segment click-through, Filterable distribution visualisations.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-pie-interactive",
"files": [
{
"path": "components/registry/n2-primitives/chart-pie-interactive.tsx",
"target": "components/blocks/charts/chart-pie-interactive.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Interactive pie with drill-down",
"Click-to-filter proportion charts",
"Explorable category breakdowns",
"Analytics with segment click-through",
"Filterable distribution visualisations"
],
"variants": ["default"]
},
"name": "chart-pie-interactive",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Pie Interactive",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Pie chart — label variant.",
"docs": "Use it for: Pie chart with category labels, Standalone category breakdown, Executive summary proportions, Report-ready pie charts, Print-friendly distribution visualisation.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-pie-label",
"files": [
{
"path": "components/registry/n2-primitives/chart-pie-label.tsx",
"target": "components/blocks/charts/chart-pie-label.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Pie chart with category labels",
"Standalone category breakdown",
"Executive summary proportions",
"Report-ready pie charts",
"Print-friendly distribution visualisation"
],
"variants": ["default"]
},
"name": "chart-pie-label",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Pie Label",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Pie chart — label custom variant.",
"docs": "Use it for: Custom-styled category-labelled pie, Brand-polished proportion charts, Marketing report pies, Design-forward distribution visualisation, Professional presentation charts.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-pie-label-custom",
"files": [
{
"path": "components/registry/n2-primitives/chart-pie-label-custom.tsx",
"target": "components/blocks/charts/chart-pie-label-custom.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Custom-styled category-labelled pie",
"Brand-polished proportion charts",
"Marketing report pies",
"Design-forward distribution visualisation",
"Professional presentation charts"
],
"variants": ["default"]
},
"name": "chart-pie-label-custom",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Pie Label Custom",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Pie chart — label list variant.",
"docs": "Use it for: Labelled pie with full label list, Complex category breakdown with full text, Detailed proportion charts, Multi-category budget displays, Executive report distribution charts.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-pie-label-list",
"files": [
{
"path": "components/registry/n2-primitives/chart-pie-label-list.tsx",
"target": "components/blocks/charts/chart-pie-label-list.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Labelled pie with full label list",
"Complex category breakdown with full text",
"Detailed proportion charts",
"Multi-category budget displays",
"Executive report distribution charts"
],
"variants": ["default"]
},
"name": "chart-pie-label-list",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Pie Label List",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Pie chart — legend variant.",
"docs": "Use it for: Pie with legend on the side, Multi-category breakdown with legend lookup, Executive summaries with legend, Detailed category displays, Complex distributions with legend.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-pie-legend",
"files": [
{
"path": "components/registry/n2-primitives/chart-pie-legend.tsx",
"target": "components/blocks/charts/chart-pie-legend.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Pie with legend on the side",
"Multi-category breakdown with legend lookup",
"Executive summaries with legend",
"Detailed category displays",
"Complex distributions with legend"
],
"variants": ["default"]
},
"name": "chart-pie-legend",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Pie Legend",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Pie chart — separator none variant.",
"docs": "Use it for: Pie chart without separators between slices, Seamless distribution visualisation, Aesthetic-forward dashboards, Design-focused proportion charts, Polished presentation pies.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-pie-separator-none",
"files": [
{
"path": "components/registry/n2-primitives/chart-pie-separator-none.tsx",
"target": "components/blocks/charts/chart-pie-separator-none.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Pie chart without separators between slices",
"Seamless distribution visualisation",
"Aesthetic-forward dashboards",
"Design-focused proportion charts",
"Polished presentation pies"
],
"variants": ["default"]
},
"name": "chart-pie-separator-none",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Pie Separator None",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Pie chart — simple variant.",
"docs": "Use it for: Simple proportion breakdown (market share), Category distribution visualisation, Budget allocation displays, Survey result breakdowns, Basic share-of-whole dashboards.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-pie-simple",
"files": [
{
"path": "components/registry/n2-primitives/chart-pie-simple.tsx",
"target": "components/blocks/charts/chart-pie-simple.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Simple proportion breakdown (market share)",
"Category distribution visualisation",
"Budget allocation displays",
"Survey result breakdowns",
"Basic share-of-whole dashboards"
],
"variants": ["default"]
},
"name": "chart-pie-simple",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Pie Simple",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Pie chart — stacked variant.",
"docs": "Use it for: Stacked pie showing nested proportions, Hierarchy-aware distribution (sub-categories), Multi-level breakdown visualisation, Nested proportion charts, Budget displays with sub-allocation.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-pie-stacked",
"files": [
{
"path": "components/registry/n2-primitives/chart-pie-stacked.tsx",
"target": "components/blocks/charts/chart-pie-stacked.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Stacked pie showing nested proportions",
"Hierarchy-aware distribution (sub-categories)",
"Multi-level breakdown visualisation",
"Nested proportion charts",
"Budget displays with sub-allocation"
],
"variants": ["default"]
},
"name": "chart-pie-stacked",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Pie Stacked",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — default variant.",
"docs": "Use it for: Skill assessment visualization (multi-dimension profile), Product feature comparison, Performance review visualisations, Character and attribute displays, Multi-axis competitive comparisons.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-default",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-default.tsx",
"target": "components/blocks/charts/chart-radar-default.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Skill assessment visualization (multi-dimension profile)",
"Product feature comparison",
"Performance review visualisations",
"Character and attribute displays",
"Multi-axis competitive comparisons"
],
"variants": ["default"]
},
"name": "chart-radar-default",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Default",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — dots variant.",
"docs": "Use it for: Interactive multi-dimension comparison, Radar with hover-emphasis, Skill comparison dashboards, Team performance radar with highlight, Active-axis visualizations.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-dots",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-dots.tsx",
"target": "components/blocks/charts/chart-radar-dots.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Interactive multi-dimension comparison",
"Radar with hover-emphasis",
"Skill comparison dashboards",
"Team performance radar with highlight",
"Active-axis visualizations"
],
"variants": ["default"]
},
"name": "chart-radar-dots",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Dots",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — grid circle variant.",
"docs": "Use it for: Circular-grid radar displays, Clean radar with circular axes, Presentation-quality multi-dimensional charts, Executive skill profile radars, Aesthetic multi-axis visualizations.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-grid-circle",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-grid-circle.tsx",
"target": "components/blocks/charts/chart-radar-grid-circle.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Circular-grid radar displays",
"Clean radar with circular axes",
"Presentation-quality multi-dimensional charts",
"Executive skill profile radars",
"Aesthetic multi-axis visualizations"
],
"variants": ["default"]
},
"name": "chart-radar-grid-circle",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Grid Circle",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — grid circle fill variant.",
"docs": "Use it for: Filled-circle grid radar, Aesthetic multi-dimensional charts, Design-polished radar visualisations, Professional skill assessment charts, Brand-polished radar displays.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-grid-circle-fill",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-grid-circle-fill.tsx",
"target": "components/blocks/charts/chart-radar-grid-circle-fill.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Filled-circle grid radar",
"Aesthetic multi-dimensional charts",
"Design-polished radar visualisations",
"Professional skill assessment charts",
"Brand-polished radar displays"
],
"variants": ["default"]
},
"name": "chart-radar-grid-circle-fill",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Grid Circle Fill",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — grid circle no lines variant.",
"docs": "Use it for: Minimal-grid radar (no background lines), Clean radar without grid noise, Aesthetic-forward multi-dimension charts, Design-focused skill visualisations, Minimalist radar displays.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-grid-circle-no-lines",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-grid-circle-no-lines.tsx",
"target": "components/blocks/charts/chart-radar-grid-circle-no-lines.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Minimal-grid radar (no background lines)",
"Clean radar without grid noise",
"Aesthetic-forward multi-dimension charts",
"Design-focused skill visualisations",
"Minimalist radar displays"
],
"variants": ["default"]
},
"name": "chart-radar-grid-circle-no-lines",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Grid Circle No Lines",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — grid custom variant.",
"docs": "Use it for: Custom-styled radar grid, Brand-consistent multi-dimensional charts, Design-polished radar visualisations, Bespoke radar displays, Marketing-grade multi-axis charts.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-grid-custom",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-grid-custom.tsx",
"target": "components/blocks/charts/chart-radar-grid-custom.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Custom-styled radar grid",
"Brand-consistent multi-dimensional charts",
"Design-polished radar visualisations",
"Bespoke radar displays",
"Marketing-grade multi-axis charts"
],
"variants": ["default"]
},
"name": "chart-radar-grid-custom",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Grid Custom",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — grid fill variant.",
"docs": "Use it for: Filled-grid radar displays, Background-highlighted multi-dimensional charts, Presentation-quality radar with grid fill, Design-polished skill visualisations, Aesthetic multi-axis charts with background.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-grid-fill",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-grid-fill.tsx",
"target": "components/blocks/charts/chart-radar-grid-fill.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Filled-grid radar displays",
"Background-highlighted multi-dimensional charts",
"Presentation-quality radar with grid fill",
"Design-polished skill visualisations",
"Aesthetic multi-axis charts with background"
],
"variants": ["default"]
},
"name": "chart-radar-grid-fill",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Grid Fill",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — grid none variant.",
"docs": "Use it for: Radar without grid display, Minimalist multi-dimensional charts, Clean radar visualisations, Design-forward skill displays, Aesthetic multi-axis comparisons.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-grid-none",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-grid-none.tsx",
"target": "components/blocks/charts/chart-radar-grid-none.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Radar without grid display",
"Minimalist multi-dimensional charts",
"Clean radar visualisations",
"Design-forward skill displays",
"Aesthetic multi-axis comparisons"
],
"variants": ["default"]
},
"name": "chart-radar-grid-none",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Grid None",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — icons variant.",
"docs": "Use it for: Radar with icon-labelled axes, Category-aware skill assessments with icons, Visual multi-dimensional comparisons, Brand-polished radar with icons, Icon-enhanced skill profiles.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-icons",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-icons.tsx",
"target": "components/blocks/charts/chart-radar-icons.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Radar with icon-labelled axes",
"Category-aware skill assessments with icons",
"Visual multi-dimensional comparisons",
"Brand-polished radar with icons",
"Icon-enhanced skill profiles"
],
"variants": ["default"]
},
"name": "chart-radar-icons",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Icons",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — label custom variant.",
"docs": "Use it for: Radar with custom axis labels, Domain-specific multi-dimensional charts, Specialised skill assessments, Custom terminology radars, Brand-consistent labelled radars.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-label-custom",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-label-custom.tsx",
"target": "components/blocks/charts/chart-radar-label-custom.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Radar with custom axis labels",
"Domain-specific multi-dimensional charts",
"Specialised skill assessments",
"Custom terminology radars",
"Brand-consistent labelled radars"
],
"variants": ["default"]
},
"name": "chart-radar-label-custom",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Label Custom",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — legend variant.",
"docs": "Use it for: Radar with comprehensive legend, Multi-entity comparison with legend lookup, Executive summaries with legend, Complex multi-dimensional comparisons, Dashboard radar with legend explanation.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-legend",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-legend.tsx",
"target": "components/blocks/charts/chart-radar-legend.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Radar with comprehensive legend",
"Multi-entity comparison with legend lookup",
"Executive summaries with legend",
"Complex multi-dimensional comparisons",
"Dashboard radar with legend explanation"
],
"variants": ["default"]
},
"name": "chart-radar-legend",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Legend",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — lines only variant.",
"docs": "Use it for: Lines-only radar (no polygon fill), Transparent multi-axis comparison, Overlay-friendly radar charts, Category axis comparison without fill, Clean multi-dimensional displays.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-lines-only",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-lines-only.tsx",
"target": "components/blocks/charts/chart-radar-lines-only.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Lines-only radar (no polygon fill)",
"Transparent multi-axis comparison",
"Overlay-friendly radar charts",
"Category axis comparison without fill",
"Clean multi-dimensional displays"
],
"variants": ["default"]
},
"name": "chart-radar-lines-only",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Lines Only",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — multiple variant.",
"docs": "Use it for: Multi-series radar (multiple entities compared), Competitive analysis radars, Before/after multi-dimensional comparison, Team vs team performance radars, Product comparison charts.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-multiple",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-multiple.tsx",
"target": "components/blocks/charts/chart-radar-multiple.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Multi-series radar (multiple entities compared)",
"Competitive analysis radars",
"Before/after multi-dimensional comparison",
"Team vs team performance radars",
"Product comparison charts"
],
"variants": ["default"]
},
"name": "chart-radar-multiple",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Multiple",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radar chart — radius variant.",
"docs": "Use it for: Radius-focused radar variant, Distance-from-center visualisation, Gap-analysis radar charts, Proficiency visualisations, Target vs current state radars.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radar-radius",
"files": [
{
"path": "components/registry/n2-primitives/chart-radar-radius.tsx",
"target": "components/blocks/charts/chart-radar-radius.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Radius-focused radar variant",
"Distance-from-center visualisation",
"Gap-analysis radar charts",
"Proficiency visualisations",
"Target vs current state radars"
],
"variants": ["default"]
},
"name": "chart-radar-radius",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radar Radius",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radial chart — grid variant.",
"docs": "Use it for: Grid-backed radial charts, Radial with explicit scale indicators, Engineering and measurement radials, Monitoring dashboard gauges, Scale-aware progress visualisations.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radial-grid",
"files": [
{
"path": "components/registry/n2-primitives/chart-radial-grid.tsx",
"target": "components/blocks/charts/chart-radial-grid.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Grid-backed radial charts",
"Radial with explicit scale indicators",
"Engineering and measurement radials",
"Monitoring dashboard gauges",
"Scale-aware progress visualisations"
],
"variants": ["default"]
},
"name": "chart-radial-grid",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radial Grid",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radial chart — label variant.",
"docs": "Use it for: Labelled radial progress charts, Multi-category radial breakdowns, Goal tracking radials with labels, Stacked performance radials, Executive KPI rings with labels.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radial-label",
"files": [
{
"path": "components/registry/n2-primitives/chart-radial-label.tsx",
"target": "components/blocks/charts/chart-radial-label.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Labelled radial progress charts",
"Multi-category radial breakdowns",
"Goal tracking radials with labels",
"Stacked performance radials",
"Executive KPI rings with labels"
],
"variants": ["default"]
},
"name": "chart-radial-label",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radial Label",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radial chart — shape variant.",
"docs": "Use it for: Custom-shaped radial charts, Brand-polished gauge visualisations, Design-forward progress displays, Bespoke KPI rings, Aesthetic-first radial charts.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radial-shape",
"files": [
{
"path": "components/registry/n2-primitives/chart-radial-shape.tsx",
"target": "components/blocks/charts/chart-radial-shape.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Custom-shaped radial charts",
"Brand-polished gauge visualisations",
"Design-forward progress displays",
"Bespoke KPI rings",
"Aesthetic-first radial charts"
],
"variants": ["default"]
},
"name": "chart-radial-shape",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radial Shape",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radial chart — simple variant.",
"docs": "Use it for: Simple gauge displays, Percentage completion dashboards, KPI rings, Progress toward goal visualisation, Single-metric radial displays.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radial-simple",
"files": [
{
"path": "components/registry/n2-primitives/chart-radial-simple.tsx",
"target": "components/blocks/charts/chart-radial-simple.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Simple gauge displays",
"Percentage completion dashboards",
"KPI rings",
"Progress toward goal visualisation",
"Single-metric radial displays"
],
"variants": ["default"]
},
"name": "chart-radial-simple",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radial Simple",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radial chart — stacked variant.",
"docs": "Use it for: Stacked radial charts (multi-metric ring), Multi-goal tracking with stacked progress, Cohort comparison radials, Sub-category breakdowns in rings, Nested KPI visualisations.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radial-stacked",
"files": [
{
"path": "components/registry/n2-primitives/chart-radial-stacked.tsx",
"target": "components/blocks/charts/chart-radial-stacked.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Stacked radial charts (multi-metric ring)",
"Multi-goal tracking with stacked progress",
"Cohort comparison radials",
"Sub-category breakdowns in rings",
"Nested KPI visualisations"
],
"variants": ["default"]
},
"name": "chart-radial-stacked",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radial Stacked",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Radial chart — text variant.",
"docs": "Use it for: Radial chart with text in center, KPI rings with central value, Progress charts with metric label, Dashboard gauges with numeric display, Donut-style KPI cards.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-radial-text",
"files": [
{
"path": "components/registry/n2-primitives/chart-radial-text.tsx",
"target": "components/blocks/charts/chart-radial-text.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Radial chart with text in center",
"KPI rings with central value",
"Progress charts with metric label",
"Dashboard gauges with numeric display",
"Donut-style KPI cards"
],
"variants": ["default"]
},
"name": "chart-radial-text",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Radial Text",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Tooltip chart — advanced variant.",
"docs": "Use it for: Rich tooltip with multiple data points, Cross-series tooltip displays, Detailed hover analytics, Executive dashboards with rich hover, Complex multi-metric tooltips.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-tooltip-advanced",
"files": [
{
"path": "components/registry/n2-primitives/chart-tooltip-advanced.tsx",
"target": "components/blocks/charts/chart-tooltip-advanced.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Rich tooltip with multiple data points",
"Cross-series tooltip displays",
"Detailed hover analytics",
"Executive dashboards with rich hover",
"Complex multi-metric tooltips"
],
"variants": ["default"]
},
"name": "chart-tooltip-advanced",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Tooltip Advanced",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Tooltip chart — default variant.",
"docs": "Use it for: Default chart tooltip behaviour, Hover detail for any chart, Baseline tooltip for dashboards, Simple value-on-hover displays, Universal chart hover primitive.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-tooltip-default",
"files": [
{
"path": "components/registry/n2-primitives/chart-tooltip-default.tsx",
"target": "components/blocks/charts/chart-tooltip-default.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Default chart tooltip behaviour",
"Hover detail for any chart",
"Baseline tooltip for dashboards",
"Simple value-on-hover displays",
"Universal chart hover primitive"
],
"variants": ["default"]
},
"name": "chart-tooltip-default",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Tooltip Default",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Tooltip chart — formatter variant.",
"docs": "Use it for: Formatted-value tooltip (abbreviated, rounded, unit-appended), Locale-aware number formatting in tooltips, Business-formatted metric displays, Engineering tooltip with unit conversion, Analytics with formatted hover values.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-tooltip-formatter",
"files": [
{
"path": "components/registry/n2-primitives/chart-tooltip-formatter.tsx",
"target": "components/blocks/charts/chart-tooltip-formatter.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Formatted-value tooltip (abbreviated, rounded, unit-appended)",
"Locale-aware number formatting in tooltips",
"Business-formatted metric displays",
"Engineering tooltip with unit conversion",
"Analytics with formatted hover values"
],
"variants": ["default"]
},
"name": "chart-tooltip-formatter",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Tooltip Formatter",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Tooltip chart — icons variant.",
"docs": "Use it for: Chart tooltips with category icons, Visual-rich hover detail, Brand-consistent tooltip displays, Icon-enhanced chart hover, Design-polished tooltip variants.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-tooltip-icons",
"files": [
{
"path": "components/registry/n2-primitives/chart-tooltip-icons.tsx",
"target": "components/blocks/charts/chart-tooltip-icons.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Chart tooltips with category icons",
"Visual-rich hover detail",
"Brand-consistent tooltip displays",
"Icon-enhanced chart hover",
"Design-polished tooltip variants"
],
"variants": ["default"]
},
"name": "chart-tooltip-icons",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Tooltip Icons",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Tooltip chart — indicator line variant.",
"docs": "Use it for: Chart tooltip with line indicator, Precise-reading tooltip displays, Engineering dashboards with line-pointing, Dense chart hover with alignment guides, Measurement-focused tooltips.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-tooltip-indicator-line",
"files": [
{
"path": "components/registry/n2-primitives/chart-tooltip-indicator-line.tsx",
"target": "components/blocks/charts/chart-tooltip-indicator-line.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Chart tooltip with line indicator",
"Precise-reading tooltip displays",
"Engineering dashboards with line-pointing",
"Dense chart hover with alignment guides",
"Measurement-focused tooltips"
],
"variants": ["default"]
},
"name": "chart-tooltip-indicator-line",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Tooltip Indicator Line",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Tooltip chart — indicator none variant.",
"docs": "Use it for: Minimal tooltip without indicator, Clean hover displays, Aesthetic-forward tooltips, Design-focused chart displays, Uncluttered hover experiences.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-tooltip-indicator-none",
"files": [
{
"path": "components/registry/n2-primitives/chart-tooltip-indicator-none.tsx",
"target": "components/blocks/charts/chart-tooltip-indicator-none.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Minimal tooltip without indicator",
"Clean hover displays",
"Aesthetic-forward tooltips",
"Design-focused chart displays",
"Uncluttered hover experiences"
],
"variants": ["default"]
},
"name": "chart-tooltip-indicator-none",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Tooltip Indicator None",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Tooltip chart — label custom variant.",
"docs": "Use it for: Custom-label tooltip formatting, Domain-specific tooltip text, Brand-consistent hover labels, Specialised metric tooltips, Localised chart hover displays.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-tooltip-label-custom",
"files": [
{
"path": "components/registry/n2-primitives/chart-tooltip-label-custom.tsx",
"target": "components/blocks/charts/chart-tooltip-label-custom.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Custom-label tooltip formatting",
"Domain-specific tooltip text",
"Brand-consistent hover labels",
"Specialised metric tooltips",
"Localised chart hover displays"
],
"variants": ["default"]
},
"name": "chart-tooltip-label-custom",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Tooltip Label Custom",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Tooltip chart — label formatter variant.",
"docs": "Use it for: Formatted-label tooltip (dates, currencies, percentages), Locale-aware chart tooltips, Domain-formatted tooltip labels, Currency-formatted value displays, Date-formatted time-series tooltips.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-tooltip-label-formatter",
"files": [
{
"path": "components/registry/n2-primitives/chart-tooltip-label-formatter.tsx",
"target": "components/blocks/charts/chart-tooltip-label-formatter.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Formatted-label tooltip (dates, currencies, percentages)",
"Locale-aware chart tooltips",
"Domain-formatted tooltip labels",
"Currency-formatted value displays",
"Date-formatted time-series tooltips"
],
"variants": ["default"]
},
"name": "chart-tooltip-label-formatter",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Tooltip Label Formatter",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["recharts"],
"description": "Tooltip chart — label none variant.",
"docs": "Use it for: Tooltip without label (values only), Minimalist hover detail, Data-focused tooltips, Value-first chart displays, Clean numerical hover.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chart-tooltip-label-none",
"files": [
{
"path": "components/registry/n2-primitives/chart-tooltip-label-none.tsx",
"target": "components/blocks/charts/chart-tooltip-label-none.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Tooltip without label (values only)",
"Minimalist hover detail",
"Data-focused tooltips",
"Value-first chart displays",
"Clean numerical hover"
],
"variants": ["default"]
},
"name": "chart-tooltip-label-none",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/chart"],
"title": "Chart Tooltip Label None",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["class-variance-authority"],
"description": "Single message display with sent/received variants, avatar, timestamp, and status.",
"docs": "Use it for: Mukoko chat message display with sent/received distinction, Comment replies in social feed threads, Customer support conversation history, AI assistant response display, Group chat messages with sender avatar and status.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chat-bubble",
"files": [
{
"path": "components/registry/n2-primitives/chat-bubble.tsx",
"target": "components/ui/chat-bubble.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Mukoko chat message display with sent/received distinction",
"Comment replies in social feed threads",
"Customer support conversation history",
"AI assistant response display",
"Group chat messages with sender avatar and status"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "chat-bubble",
"registryDependencies": [],
"title": "Chat Bubble",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Message composer with auto-growing textarea, send button, and keyboard shortcuts.",
"docs": "Use it for: Chat message composition in Mukoko messaging, Comment composer below posts and articles, Support ticket reply composer, AI prompt entry with attachment support, Reply composer in threaded discussions.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chat-input",
"files": [
{
"path": "components/registry/n2-primitives/chat-input.tsx",
"target": "components/ui/chat-input.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Chat message composition in Mukoko messaging",
"Comment composer below posts and articles",
"Support ticket reply composer",
"AI prompt entry with attachment support",
"Reply composer in threaded discussions"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "chat-input",
"registryDependencies": [],
"title": "Chat Input",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Full chat page layout with sidebar conversations and main chat area.",
"docs": "Use it for: Full-screen chat pages in Mukoko, Customer support chat interfaces, Team messaging application layouts, AI assistant chat pages with conversation history, Group chat with channels and direct messages.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chat-layout",
"files": [
{
"path": "components/registry/n2-primitives/chat-layout.tsx",
"target": "components/ui/chat-layout.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Full-screen chat pages in Mukoko",
"Customer support chat interfaces",
"Team messaging application layouts",
"AI assistant chat pages with conversation history",
"Group chat with channels and direct messages"
],
"variants": ["default"]
},
"name": "chat-layout",
"registryDependencies": [],
"title": "Chat Layout",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Scrollable conversation list with unread counts and active highlight.",
"docs": "Use it for: Conversations sidebar in chat layouts, Recent chats list with unread indicators, Customer support inbox display, Message thread navigation with active highlight, AI conversation history browser.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chat-list",
"files": [
{
"path": "components/registry/n2-primitives/chat-list.tsx",
"target": "components/ui/chat-list.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Conversations sidebar in chat layouts",
"Recent chats list with unread indicators",
"Customer support inbox display",
"Message thread navigation with active highlight",
"AI conversation history browser"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "chat-list",
"registryDependencies": [],
"title": "Chat List",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Chat/messaging page composition. Conversation list or active chat with message input, media attachments, read receipts. Competitors: WhatsApp, Telegram, WeChat.",
"docs": "Use it for: campfire, circles.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/chat-page",
"files": [
{
"path": "components/registry/n6-pages/chat-page.tsx",
"target": "components/ui/chat-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["campfire", "circles"],
"variants": ["default", "loading"]
},
"name": "chat-page",
"registryDependencies": [],
"title": "Chat Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui"],
"description": "A control that allows the user to toggle between checked and not checked.",
"docs": "Use it for: Form consent checkboxes (terms, privacy), Multi-select filter groups, Task completion tracking, Feature flag opt-ins, Batch-select tables with bulk actions.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/checkbox",
"files": [
{
"path": "components/registry/n2-primitives/checkbox.tsx",
"target": "components/ui/checkbox.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Form consent checkboxes (terms, privacy)",
"Multi-select filter groups",
"Task completion tracking",
"Feature flag opt-ins",
"Batch-select tables with bulk actions"
],
"variants": ["default", "sm", "lg"]
},
"name": "checkbox",
"registryDependencies": [],
"title": "Checkbox",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Interactive checklist with add, reorder, and completion tracking.",
"docs": "Use it for: Onboarding setup checklists, Task lists for project management, Shopping lists in grocery and retail apps, Pre-flight checklists in compliance workflows, Personal to-do lists with reorder support.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/checklist",
"files": [
{
"path": "components/registry/n2-primitives/checklist.tsx",
"target": "components/ui/checklist.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Onboarding setup checklists",
"Task lists for project management",
"Shopping lists in grocery and retail apps",
"Pre-flight checklists in compliance workflows",
"Personal to-do lists with reorder support"
],
"variants": ["default", "sm", "lg"]
},
"name": "checklist",
"registryDependencies": [],
"title": "Checklist",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Checkout/order page. Cart summary, shipping, payment method selection, order confirmation. Multi-step with progress indicator.",
"docs": "Use it for: nhimbe, bushtrade.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/checkout-page",
"files": [
{
"path": "components/registry/n6-pages/checkout-page.tsx",
"target": "components/ui/checkout-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["nhimbe", "bushtrade"],
"variants": ["default", "loading"]
},
"name": "checkout-page",
"registryDependencies": [],
"title": "Checkout Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Netflix Hystrix-inspired circuit breaker with CLOSED/OPEN/HALF_OPEN state machine.",
"docs": "Use it for: Protecting calls to third-party APIs that may fail, Guarding payment gateway calls during outages, Preventing cascade failures when a service is degraded, AI service call protection during model outages, Fallback coordination during dependency failures.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/circuit-breaker",
"files": [
{
"path": "components/registry/n2-primitives/circuit-breaker.ts",
"target": "lib/circuit-breaker.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Protecting calls to third-party APIs that may fail",
"Guarding payment gateway calls during outages",
"Preventing cascade failures when a service is degraded",
"AI service call protection during model outages",
"Fallback coordination during dependency failures"
],
"variants": ["default"]
},
"name": "circuit-breaker",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/timeout",
"https://api.mzizi.dev/v1/ui/observability"
],
"title": "Circuit Breaker",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Multi-author display showing all co-authors with their revenue split percentages. Compact inline strip for novel headers and detail pages. Maps to novels.work_contributor with revenue_share_pct.",
"docs": "Use it for: novels.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/co-author-strip",
"files": [
{
"path": "components/registry/n2-primitives/co-author-strip.tsx",
"target": "components/ui/co-author-strip.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["novels"],
"variants": ["default", "sm", "lg"]
},
"name": "co-author-strip",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/avatar-group",
"https://api.mzizi.dev/v1/ui/tooltip"
],
"title": "Co Author Strip",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Enhanced code display with language badge, line numbers, copy button, and filename.",
"docs": "Use it for: Code samples in documentation pages, API response examples in developer docs, Tutorial code snippets with syntax highlighting, Error log display with line numbers, Configuration examples in setup guides.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/code-block",
"files": [
{
"path": "components/registry/n2-primitives/code-block.tsx",
"target": "components/ui/code-block.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Code samples in documentation pages",
"API response examples in developer docs",
"Tutorial code snippets with syntax highlighting",
"Error log display with line numbers",
"Configuration examples in setup guides"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "code-block",
"registryDependencies": [],
"title": "Code Block",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Code input with line numbers, monospace font, and tab key support.",
"docs": "Use it for: Code input fields in developer tools, Configuration editor for YAML/JSON/env files, Script input in automation interfaces, Query editor for analytics and SQL, Template editor with syntax awareness.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/code-editor",
"files": [
{
"path": "components/registry/n2-primitives/code-editor.tsx",
"target": "components/ui/code-editor.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Code input fields in developer tools",
"Configuration editor for YAML/JSON/env files",
"Script input in automation interfaces",
"Query editor for analytics and SQL",
"Template editor with syntax awareness"
],
"variants": ["default", "sm", "lg"]
},
"name": "code-editor",
"registryDependencies": [],
"title": "Code Editor",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Tabbed code display for multiple languages/frameworks.",
"docs": "Use it for: Multi-language code examples in docs (JS/Python/Go), Framework-specific component usage examples, Before/after code comparison in migration guides, Client SDK examples across platforms, Request/response pair examples.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/code-tabs",
"files": [
{
"path": "components/registry/n2-primitives/code-tabs.tsx",
"target": "components/ui/code-tabs.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Multi-language code examples in docs (JS/Python/Go)",
"Framework-specific component usage examples",
"Before/after code comparison in migration guides",
"Client SDK examples across platforms",
"Request/response pair examples"
],
"variants": ["default"]
},
"name": "code-tabs",
"registryDependencies": [],
"title": "Code Tabs",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui"],
"description": "An interactive component which expands and collapses a panel.",
"docs": "Use it for: Expandable filter sections, Show-more/show-less text blocks, Collapsible sidebar groups, Expandable content cards, Progressive disclosure in long forms.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/collapsible",
"files": [
{
"path": "components/registry/n2-primitives/collapsible.tsx",
"target": "components/ui/collapsible.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Expandable filter sections",
"Show-more/show-less text blocks",
"Collapsible sidebar groups",
"Expandable content cards",
"Progressive disclosure in long forms"
],
"variants": ["default"]
},
"name": "collapsible",
"registryDependencies": [],
"title": "Collapsible",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Color selector with hex input and preset swatches including the Seven African Minerals.",
"docs": "Use it for: Theme customization in settings, Design tool color pickers, Brand color selection in admin interfaces, Calendar event color assignment, Tag color selection.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/color-picker",
"files": [
{
"path": "components/registry/n2-primitives/color-picker.tsx",
"target": "components/ui/color-picker.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Theme customization in settings",
"Design tool color pickers",
"Brand color selection in admin interfaces",
"Calendar event color assignment",
"Tag color selection"
],
"variants": ["default", "sm", "lg"]
},
"name": "color-picker",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/input"],
"title": "Color Picker",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["@base-ui/react"],
"description": "Autocomplete input and command palette with a list of suggestions.",
"docs": "Use it for: Searchable dropdowns with typeahead, Command palette-style navigation, Tag and label selection with autocomplete, Location picker with search, Country and region selection.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/combobox",
"files": [
{
"path": "components/registry/n2-primitives/combobox.tsx",
"target": "components/ui/combobox.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Searchable dropdowns with typeahead",
"Command palette-style navigation",
"Tag and label selection with autocomplete",
"Location picker with search",
"Country and region selection"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "combobox",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/input-group"
],
"title": "Combobox",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["cmdk"],
"description": "Fast, composable, unstyled command menu for React.",
"docs": "Use it for: Command palette for power-user navigation, Global search in enterprise tools, Quick action launcher (Cmd+K), Keyboard-first navigation interface, Search-as-you-type across data types.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/command",
"files": [
{
"path": "components/registry/n2-primitives/command.tsx",
"target": "components/ui/command.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Command palette for power-user navigation",
"Global search in enterprise tools",
"Quick action launcher (Cmd+K)",
"Keyboard-first navigation interface",
"Search-as-you-type across data types"
],
"variants": ["default", "sm", "lg"]
},
"name": "command",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/dialog",
"https://api.mzizi.dev/v1/ui/input-group"
],
"title": "Command",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Spotlight-style command palette with search, grouped results, and keyboard hints.",
"docs": "Use it for: Global command palette (Cmd+K / Ctrl+K), Power-user quick-action launcher, Cross-app search and navigation, Keyboard-first productivity surface, Unified search across data types.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/command-center",
"files": [
{
"path": "components/registry/n2-primitives/command-center.tsx",
"target": "components/blocks/command-center.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Global command palette (Cmd+K / Ctrl+K)",
"Power-user quick-action launcher",
"Cross-app search and navigation",
"Keyboard-first productivity surface",
"Unified search across data types"
],
"variants": ["default", "sm", "lg"]
},
"name": "command-center",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/command"],
"title": "Command Center",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Inline paragraph-level commenting — the Medium-style annotation pattern. Users highlight text in a chapter and leave comments anchored to that specific passage. Maps to a future comments schema on novels.chapter.",
"docs": "Use it for: news, novels.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/comment-on-paragraph",
"files": [
{
"path": "components/registry/n2-primitives/comment-on-paragraph.tsx",
"target": "components/ui/comment-on-paragraph.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["news", "novels"],
"variants": ["default", "sm", "lg"]
},
"name": "comment-on-paragraph",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/popover",
"https://api.mzizi.dev/v1/ui/textarea",
"https://api.mzizi.dev/v1/ui/avatar"
],
"title": "Comment On Paragraph",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Threaded comments with nested replies and actions.",
"docs": "Use it for: Comments section below articles and posts, Code review threaded discussions, Product review conversations, Community Q&A with nested responses, Moderated discussion threads.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/comment-thread",
"files": [
{
"path": "components/registry/n2-primitives/comment-thread.tsx",
"target": "components/ui/comment-thread.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Comments section below articles and posts",
"Code review threaded discussions",
"Product review conversations",
"Community Q&A with nested responses",
"Moderated discussion threads"
],
"variants": ["default", "sm", "lg"]
},
"name": "comment-thread",
"registryDependencies": [],
"title": "Comment Thread",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Nyuchi Console main dashboard. Project overview, resource usage, API traffic, deploy status, quick actions. The control center for Nyuchi Web Services. Competitors: Vercel Dashboard, AWS Console, Cloudflare Dashboard.",
"docs": "Use it for: console.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/console-dashboard-page",
"files": [
{
"path": "components/registry/n6-pages/console-dashboard-page.tsx",
"target": "components/ui/console-dashboard-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["console"],
"variants": ["default", "loading"]
},
"name": "console-dashboard-page",
"registryDependencies": [],
"title": "Console Dashboard Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Contact information card with avatar, details, and action links for call and email.",
"docs": "Use it for: Directory entries in contact management, Event attendee info cards, Sales CRM contact display, Business card sharing in networking apps, Emergency contact quick-access cards.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/contact-card",
"files": [
{
"path": "components/registry/n2-primitives/contact-card.tsx",
"target": "components/ui/contact-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Directory entries in contact management",
"Event attendee info cards",
"Sales CRM contact display",
"Business card sharing in networking apps",
"Emergency contact quick-access cards"
],
"variants": ["default", "sm", "lg"]
},
"name": "contact-card",
"registryDependencies": [],
"title": "Contact Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Editorial calendar showing scheduled content across a week or month view. Drag-and-drop scheduling, content type color coding, and publish status indicators. Used in Mukoko News editorial management and Bytes creator scheduling.",
"docs": "Use it for: news, console.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/content-calendar",
"files": [
{
"path": "components/registry/n2-primitives/content-calendar.tsx",
"target": "components/ui/content-calendar.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["news", "console"],
"variants": ["default"]
},
"name": "content-calendar",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/calendar-week-view",
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/badge"
],
"title": "Content Calendar",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui"],
"description": "Displays a menu to the user triggered by a right click.",
"docs": "Use it for: Right-click contextual actions in admin interfaces, File system operations (rename/delete), Board and kanban card actions, List row contextual actions, Rich-text editor cut/copy/paste menus.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/context-menu",
"files": [
{
"path": "components/registry/n2-primitives/context-menu.tsx",
"target": "components/ui/context-menu.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Right-click contextual actions in admin interfaces",
"File system operations (rename/delete)",
"Board and kanban card actions",
"List row contextual actions",
"Rich-text editor cut/copy/paste menus"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "context-menu",
"registryDependencies": [],
"title": "Context Menu",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Accessibility mode switcher supporting light, dark, high-contrast, and system-preference modes. Goes beyond simple dark mode to include APCA 3.0 AAA high-contrast for users with visual impairments.",
"docs": "Use it for: all.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/contrast-mode-toggle",
"files": [
{
"path": "components/registry/n2-primitives/contrast-mode-toggle.tsx",
"target": "components/ui/contrast-mode-toggle.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["all"],
"variants": ["default", "sm", "lg"]
},
"name": "contrast-mode-toggle",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/toggle-group",
"https://api.mzizi.dev/v1/ui/button"
],
"title": "Contrast Mode Toggle",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "GDPR/POPIA-compliant consent banner with accept, decline, and manage options.",
"docs": "Use it for: GDPR and POPIA compliance for EU and SADC markets, Initial visit cookie preference collection, Re-prompting for consent after policy changes, Analytics opt-in for privacy-conscious users, Cross-border data transfer consent.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/cookie-consent",
"files": [
{
"path": "components/registry/n2-primitives/cookie-consent.tsx",
"target": "components/ui/cookie-consent.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"GDPR and POPIA compliance for EU and SADC markets",
"Initial visit cookie preference collection",
"Re-prompting for consent after policy changes",
"Analytics opt-in for privacy-conscious users",
"Cross-border data transfer consent"
],
"variants": ["default"]
},
"name": "cookie-consent",
"registryDependencies": [],
"title": "Cookie Consent",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "A button that copies text to the clipboard with visual feedback on success.",
"docs": "Use it for: Copying API keys and tokens from developer dashboards, Copying share links from social and content pages, Copying code snippets from documentation, Copying wallet addresses in crypto contexts, Copying invite codes and referral links.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/copy-button",
"files": [
{
"path": "components/registry/n2-primitives/copy-button.tsx",
"target": "components/ui/copy-button.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Copying API keys and tokens from developer dashboards",
"Copying share links from social and content pages",
"Copying code snippets from documentation",
"Copying wallet addresses in crypto contexts",
"Copying invite codes and referral links"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "copy-button",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/button"],
"title": "Copy Button",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Multi-currency numeric input with currency switcher supporting MXT, ZWL, USD, ZAR, KES, and mobile money codes. Formats values per locale with proper decimal handling. The standard financial input for all payment flows across the ecosystem.",
"docs": "Use it for: wallet, bushtrade.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/currency-input",
"files": [
{
"path": "components/registry/n2-primitives/currency-input.tsx",
"target": "components/ui/currency-input.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["wallet", "bushtrade"],
"variants": ["default"]
},
"name": "currency-input",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/input",
"https://api.mzizi.dev/v1/ui/select"
],
"title": "Currency Input",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": [],
"description": "Governance proposal card with title, description, proposer, voting progress bar (for/against/abstain), deadline countdown, quorum status, and vote action. Maps to ubuntu.dao_proposals table. Used in the governance section of the Mukoko Foundation interface.",
"docs": "Use it for: circles.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/dao-proposal-card",
"files": [
{
"path": "components/registry/n2-primitives/dao-proposal-card.tsx",
"target": "components/ui/dao-proposal-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": ["circles"],
"variants": ["default", "sm", "lg"]
},
"name": "dao-proposal-card",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/progress",
"https://api.mzizi.dev/v1/ui/badge",
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/avatar"
],
"title": "Dao Proposal Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": [],
"description": "Full dashboard layout with stats, chart section, and activity feed.",
"docs": "Use it for: Admin dashboard home pages, Analytics overview pages, Project status dashboards, KPI monitoring surfaces, Executive summary views.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/dashboard-01",
"files": [
{
"path": "components/registry/n2-primitives/dashboard-01.tsx",
"target": "components/blocks/dashboard-01.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Admin dashboard home pages",
"Analytics overview pages",
"Project status dashboards",
"KPI monitoring surfaces",
"Executive summary views"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "dashboard-01",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/input",
"https://api.mzizi.dev/v1/ui/label"
],
"title": "Dashboard 01",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Data explorer page for open data. Table browser, SQL/filter builder, column selection, pagination, CSV/JSON export. Used by Nyuchi Open Data platform and B2B partners. Competitors: Metabase, data.gov, Socrata.",
"docs": "Use it for: shamwari, console.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/data-explorer-page",
"files": [
{
"path": "components/registry/n6-pages/data-explorer-page.tsx",
"target": "components/ui/data-explorer-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["shamwari", "console"],
"variants": ["default", "loading"]
},
"name": "data-explorer-page",
"registryDependencies": [],
"title": "Data Explorer Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["@tanstack/react-table"],
"description": "A powerful table with sorting, filtering, pagination, and column visibility powered by TanStack Table.",
"docs": "Use it for: Admin user management tables, Content management with sorting and filtering, Analytics data exploration, Order and transaction management, Large dataset browsing with pagination.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/data-table",
"files": [
{
"path": "components/registry/n2-primitives/data-table.tsx",
"target": "components/ui/data-table.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Admin user management tables",
"Content management with sorting and filtering",
"Analytics data exploration",
"Order and transaction management",
"Large dataset browsing with pagination"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "data-table",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/dropdown-menu",
"https://api.mzizi.dev/v1/ui/input",
"https://api.mzizi.dev/v1/ui/table"
],
"title": "Data Table",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Smart date display that shows relative time for recent dates (\"2 hours ago\", \"yesterday\") and absolute dates for older ones (\"15 May 2026\"). Respects locale from nyuchi-locale. A micro-primitive used everywhere — message timestamps, card metadata, activity feeds, task due dates.",
"docs": "Use it for: all.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/date-label",
"files": [
{
"path": "components/registry/n2-primitives/date-label.tsx",
"target": "components/ui/date-label.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["all"],
"variants": ["default"]
},
"name": "date-label",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/tooltip"],
"title": "Date Label",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["date-fns"],
"description": "A date picker component with calendar popover, supporting single date and date range selection.",
"docs": "Use it for: Date of birth input, Appointment booking date selection, Deadline setting in task management, Event date selection, Report filtering by date.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/date-picker",
"files": [
{
"path": "components/registry/n2-primitives/date-picker.tsx",
"target": "components/ui/date-picker.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Date of birth input",
"Appointment booking date selection",
"Deadline setting in task management",
"Event date selection",
"Report filtering by date"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "date-picker",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/calendar",
"https://api.mzizi.dev/v1/ui/popover"
],
"title": "Date Picker",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["react-day-picker"],
"description": "Dual-calendar popover for selecting date ranges with preset quick-selects.",
"docs": "Use it for: Analytics time range selection (last 7 days), Booking date range for travel and accommodation, Report period selection (month/quarter), Leave request start and end date, Campaign active period configuration.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/date-range-picker",
"files": [
{
"path": "components/registry/n2-primitives/date-range-picker.tsx",
"target": "components/ui/date-range-picker.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Analytics time range selection (last 7 days)",
"Booking date range for travel and accommodation",
"Report period selection (month/quarter)",
"Leave request start and end date",
"Campaign active period configuration"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "date-range-picker",
"registryDependencies": [],
"title": "Date Range Picker",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Visual dependency/relationship display between items — task depends on task, event requires event, etc. Shows directed edges between nodes. Used in project planning (Planner), workflow visualization (Console), and content relationship mapping.",
"docs": "Use it for: planner, console.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/dependency-graph",
"files": [
{
"path": "components/registry/n2-primitives/dependency-graph.tsx",
"target": "components/ui/dependency-graph.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["planner", "console"],
"variants": ["default"]
},
"name": "dependency-graph",
"registryDependencies": [],
"title": "Dependency Graph",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Service health card showing uptime percentage, error rate, response time (p50/p95/p99), and last deploy timestamp. Mineral color coding: malachite=healthy, gold=degraded, terracotta=down. Used in the Nyuchi Console infrastructure dashboard.",
"docs": "Use it for: console.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/deployment-status-card",
"files": [
{
"path": "components/registry/n2-primitives/deployment-status-card.tsx",
"target": "components/ui/deployment-status-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["console"],
"variants": ["default", "sm", "lg"]
},
"name": "deployment-status-card",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/badge",
"https://api.mzizi.dev/v1/ui/status-indicator"
],
"title": "Deployment Status Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Semantic key-value display using dl/dt/dd elements.",
"docs": "Use it for: Product specification displays, Settings summary views, Profile detail displays, Order detail metadata, Key-value data presentation with semantic markup.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/description-list",
"files": [
{
"path": "components/registry/n2-primitives/description-list.tsx",
"target": "components/ui/description-list.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Product specification displays",
"Settings summary views",
"Profile detail displays",
"Order detail metadata",
"Key-value data presentation with semantic markup"
],
"variants": ["default", "sm", "lg"]
},
"name": "description-list",
"registryDependencies": [],
"title": "Description List",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui"],
"description": "A window overlaid on the primary window, rendering content underneath inert.",
"docs": "Use it for: Forms that block the underlying page, Confirmation and detail modals, Media viewer overlays, Login and signup modal flows, Settings and preferences modal editors.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/dialog",
"files": [
{
"path": "components/registry/n2-primitives/dialog.tsx",
"target": "components/ui/dialog.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Forms that block the underlying page",
"Confirmation and detail modals",
"Media viewer overlays",
"Login and signup modal flows",
"Settings and preferences modal editors"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "dialog",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/button"],
"title": "Dialog",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["radix-ui"],
"description": "A provider to set the text direction for the application.",
"docs": "Use it for: Setting RTL text direction for Arabic, Hebrew, Persian, Urdu users, Wrapping locale-specific page sections, Application-level direction provider, Enabling bidi-aware text flow in long-form content, Direction switching in locale settings.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/direction",
"files": [
{
"path": "components/registry/n2-primitives/direction.tsx",
"target": "components/ui/direction.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Setting RTL text direction for Arabic, Hebrew, Persian, Urdu users",
"Wrapping locale-specific page sections",
"Application-level direction provider",
"Enabling bidi-aware text flow in long-form content",
"Direction switching in locale settings"
],
"variants": ["default"]
},
"name": "direction",
"registryDependencies": [],
"title": "Direction",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Grip indicator for drag-and-drop reordering.",
"docs": "Use it for: Drag-to-reorder list items (tasks, playlists, kanban cards), Reordering table rows in admin interfaces, Moving panels in customizable dashboards, Reordering form fields in form builders, Tab reordering in multi-tab editors.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/drag-handle",
"files": [
{
"path": "components/registry/n2-primitives/drag-handle.tsx",
"target": "components/ui/drag-handle.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Drag-to-reorder list items (tasks, playlists, kanban cards)",
"Reordering table rows in admin interfaces",
"Moving panels in customizable dashboards",
"Reordering form fields in form builders",
"Tab reordering in multi-tab editors"
],
"variants": ["default", "sm", "lg"]
},
"name": "drag-handle",
"registryDependencies": [],
"title": "Drag Handle",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["vaul"],
"description": "A drawer component for React built on top of Vaul.",
"docs": "Use it for: Mobile navigation drawer, Details panel sliding from edges, Cart drawer in e-commerce, Notification panel, Filter panel in mobile search.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/drawer",
"files": [
{
"path": "components/registry/n2-primitives/drawer.tsx",
"target": "components/ui/drawer.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Mobile navigation drawer",
"Details panel sliding from edges",
"Cart drawer in e-commerce",
"Notification panel",
"Filter panel in mobile search"
],
"variants": ["default"]
},
"name": "drawer",
"registryDependencies": [],
"title": "Drawer",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Driver/operator card with photo, rating, vehicle info, verification badge, and trip count. Maps to identity.person + transport tables via Nyuchi Logistics. Used in Transport booking confirmation and ride-matching.",
"docs": "Use it for: transport.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/driver-profile-card",
"files": [
{
"path": "components/registry/n2-primitives/driver-profile-card.tsx",
"target": "components/ui/driver-profile-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["transport"],
"variants": ["default", "sm", "lg"]
},
"name": "driver-profile-card",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/avatar",
"https://api.mzizi.dev/v1/ui/rating",
"https://api.mzizi.dev/v1/ui/nyuchi-verified-badge"
],
"title": "Driver Profile Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui"],
"description": "Displays a menu to the user triggered by a button.",
"docs": "Use it for: Contextual action menus triggered by button, User profile menu in headers, Actions menu on list items, Sort and filter menus, Settings quick menus.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/dropdown-menu",
"files": [
{
"path": "components/registry/n2-primitives/dropdown-menu.tsx",
"target": "components/ui/dropdown-menu.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Contextual action menus triggered by button",
"User profile menu in headers",
"Actions menu on list items",
"Sort and filter menus",
"Settings quick menus"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "dropdown-menu",
"registryDependencies": [],
"title": "Dropdown Menu",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["class-variance-authority"],
"description": "Displays an empty state with an icon, title, and description.",
"docs": "Use it for: Empty inbox and notification states, No search results found displays, Empty list and table states, Getting-started prompts on fresh accounts, Error fallback states with recovery actions.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/empty",
"files": [
{
"path": "components/registry/n2-primitives/empty.tsx",
"target": "components/ui/empty.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Empty inbox and notification states",
"No search results found displays",
"Empty list and table states",
"Getting-started prompts on fresh accounts",
"Error fallback states with recovery actions"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "empty",
"registryDependencies": [],
"title": "Empty",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Raw empty state primitive with icon, title, description, and call-to-action slots. No brand opinion. Use nyuchi-empty-state (Layer 3) for the branded ecosystem version with mineral accents.",
"docs": "Use it for: Generic empty-state primitive for layer-3 composition, Low-level empty state for unbranded contexts, Placeholder for data-loading states before first result, Foundation for branded empty state variants, Admin panel empty list displays.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/empty-state",
"files": [
{
"path": "components/registry/n2-primitives/empty-state.tsx",
"target": "components/blocks/empty-state.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Generic empty-state primitive for layer-3 composition",
"Low-level empty state for unbranded contexts",
"Placeholder for data-loading states before first result",
"Foundation for branded empty state variants",
"Admin panel empty list displays"
],
"variants": ["default", "sm", "lg"]
},
"name": "empty-state",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/button"],
"title": "Empty State",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["class-variance-authority"],
"description": "API endpoint display with method badge, path, and description.",
"docs": "Use it for: REST API endpoint listing in API reference, Webhook endpoint configuration display, GraphQL query explorer endpoint display, Integration API documentation, Server endpoint admin dashboard.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/endpoint-card",
"files": [
{
"path": "components/registry/n2-primitives/endpoint-card.tsx",
"target": "components/ui/endpoint-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"REST API endpoint listing in API reference",
"Webhook endpoint configuration display",
"GraphQL query explorer endpoint display",
"Integration API documentation",
"Server endpoint admin dashboard"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "endpoint-card",
"registryDependencies": [],
"title": "Endpoint Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Key-value environment variable editor with secret masking.",
"docs": "Use it for: Environment variable editor in admin panels, Secret configuration with masked values, Feature flag overrides in development environments, API key management interface, Deployment configuration editor.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/env-editor",
"files": [
{
"path": "components/registry/n2-primitives/env-editor.tsx",
"target": "components/ui/env-editor.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Environment variable editor in admin panels",
"Secret configuration with masked values",
"Feature flag overrides in development environments",
"API key management interface",
"Deployment configuration editor"
],
"variants": ["default", "sm", "lg"]
},
"name": "env-editor",
"registryDependencies": [],
"title": "Env Editor",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["resilience"],
"dependencies": [],
"description": "A React error boundary component that catches render errors and displays a fallback.",
"docs": "Use it for: Error handling, Graceful degradation, Offline support.\nVariants: default, degraded, error.\nIncludes: Y-axis resilience spine, Netflix resilience patterns.\nAccessibility: Error states announced to screen readers, Retry actions keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/error-boundary",
"files": [
{
"path": "components/registry/n5-resilience/error-boundary.tsx",
"target": "components/error-boundary.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Error states announced to screen readers",
"Retry actions keyboard accessible"
],
"collection": "resilience",
"features": ["Y-axis resilience spine", "Netflix resilience patterns"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Error handling",
"Graceful degradation",
"Offline support"
],
"variants": ["default", "degraded", "error"]
},
"name": "error-boundary",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/observability"],
"title": "Error Boundary",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["resilience"],
"dependencies": [],
"description": "Standard error page for 404, 500, and 503 states with mineral accent.",
"docs": "Use it for: Error handling, Graceful degradation, Offline support.\nVariants: default, degraded, error.\nIncludes: Y-axis resilience spine, Netflix resilience patterns.\nAccessibility: Error states announced to screen readers, Retry actions keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/error-page",
"files": [
{
"path": "components/registry/n5-resilience/error-page.tsx",
"target": "components/blocks/error-page.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": [
"Error states announced to screen readers",
"Retry actions keyboard accessible"
],
"collection": "resilience",
"features": ["Y-axis resilience spine", "Netflix resilience patterns"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Error handling",
"Graceful degradation",
"Offline support"
],
"variants": ["default", "degraded", "error"]
},
"name": "error-page",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/button"],
"title": "Error Page",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "BushTrade escrow payment status tracker. Shows payment lifecycle stages: initiated → held → released/disputed. Maps to wallet.payment_intents with escrow state. Used in BushTrade transaction views and seller dashboards.",
"docs": "Use it for: bushtrade.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/escrow-status",
"files": [
{
"path": "components/registry/n2-primitives/escrow-status.tsx",
"target": "components/ui/escrow-status.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["bushtrade"],
"variants": ["default", "sm", "lg"]
},
"name": "escrow-status",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/stepper",
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/badge"
],
"title": "Escrow Status",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Time-ranged event block for rendering inside calendar day/week grids. Shows title, time span, and color category. Supports overlapping events with column stacking. The visual unit that populates calendar-day-view and calendar-week-view slots.",
"docs": "Use it for: nhimbe, planner.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/event-block",
"files": [
{
"path": "components/registry/n2-primitives/event-block.tsx",
"target": "components/ui/event-block.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["nhimbe", "planner"],
"variants": ["default"]
},
"name": "event-block",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/badge"],
"title": "Event Block",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "In-chat event RSVP card shared in Campfire conversations. Compact event preview with date, venue, and quick RSVP buttons (Going/Maybe/Decline). Maps to events.rsvp_action. Bridges Nhimbe events into the Campfire messaging flow.",
"docs": "Use it for: campfire, nhimbe.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/event-rsvp-inline",
"files": [
{
"path": "components/registry/n2-primitives/event-rsvp-inline.tsx",
"target": "components/ui/event-rsvp-inline.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["campfire", "nhimbe"],
"variants": ["default", "sm", "lg"]
},
"name": "event-rsvp-inline",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/button-group",
"https://api.mzizi.dev/v1/ui/badge"
],
"title": "Event Rsvp Inline",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Currency pair display with live rate, conversion calculator, and trend indicator. Supports MXT ↔ fiat pairs across 42 African currencies. Used in Wallet swap interface and BushTrade cross-border commerce.",
"docs": "Use it for: wallet, bushtrade.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/exchange-rate",
"files": [
{
"path": "components/registry/n2-primitives/exchange-rate.tsx",
"target": "components/ui/exchange-rate.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["wallet", "bushtrade"],
"variants": ["default"]
},
"name": "exchange-rate",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/currency-input"
],
"title": "Exchange Rate",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Sequential fallback strategy — try stages in order, return first success.",
"docs": "Use it for: Degraded-mode content delivery (full → cache → placeholder), Multi-source data retrieval with fallbacks, Weather data with primary and backup providers, Payment processing with backup gateway, Translation with fallback language models.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/fallback-chain",
"files": [
{
"path": "components/registry/n2-primitives/fallback-chain.ts",
"target": "lib/fallback-chain.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Degraded-mode content delivery (full → cache → placeholder)",
"Multi-source data retrieval with fallbacks",
"Weather data with primary and backup providers",
"Payment processing with backup gateway",
"Translation with fallback language models"
],
"variants": ["default"]
},
"name": "fallback-chain",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/timeout",
"https://api.mzizi.dev/v1/ui/observability"
],
"title": "Fallback Chain",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Route fare display with breakdown by segment, applicable discounts, and total. Supports multi-currency display. Used in Transport for route cost estimation before booking.",
"docs": "Use it for: transport.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/fare-calculator",
"files": [
{
"path": "components/registry/n2-primitives/fare-calculator.tsx",
"target": "components/ui/fare-calculator.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["transport"],
"variants": ["default"]
},
"name": "fare-calculator",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/separator",
"https://api.mzizi.dev/v1/ui/currency-input"
],
"title": "Fare Calculator",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Feature flag row with name, description, environment toggles (dev/staging/production), and rollout percentage slider. Used in the Nyuchi Console feature management dashboard.",
"docs": "Use it for: console.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/feature-flag-toggle",
"files": [
{
"path": "components/registry/n2-primitives/feature-flag-toggle.tsx",
"target": "components/ui/feature-flag-toggle.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["console"],
"variants": ["default", "sm", "lg"]
},
"name": "feature-flag-toggle",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/switch",
"https://api.mzizi.dev/v1/ui/slider",
"https://api.mzizi.dev/v1/ui/badge"
],
"title": "Feature Flag Toggle",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["class-variance-authority"],
"description": "A form field component with label, description, and message.",
"docs": "Use it for: Form field wrapper with label and error, Consistent form layout across registration flows, Settings form fields with descriptions, Profile editing form fields, Admin configuration form fields.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/field",
"files": [
{
"path": "components/registry/n2-primitives/field.tsx",
"target": "components/ui/field.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Form field wrapper with label and error",
"Consistent form layout across registration flows",
"Settings form fields with descriptions",
"Profile editing form fields",
"Admin configuration form fields"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "field",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/label",
"https://api.mzizi.dev/v1/ui/separator"
],
"title": "Field",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "File preview card with icon, name, and size display.",
"docs": "Use it for: Uploaded document preview in forms, Email attachment display, Media library file browser entries, Cloud storage file preview cards, Code review file change indicators.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/file-preview",
"files": [
{
"path": "components/registry/n2-primitives/file-preview.tsx",
"target": "components/ui/file-preview.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Uploaded document preview in forms",
"Email attachment display",
"Media library file browser entries",
"Cloud storage file preview cards",
"Code review file change indicators"
],
"variants": ["default", "sm", "lg"]
},
"name": "file-preview",
"registryDependencies": [],
"title": "File Preview",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "A drag-and-drop file upload zone with file list, size validation, and remove actions.",
"docs": "Use it for: Profile picture upload, Document submission forms (KYC, verification), Media uploads in content creation flows, Bulk import for admin interfaces, Attachment upload in messaging and email.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/file-upload",
"files": [
{
"path": "components/registry/n2-primitives/file-upload.tsx",
"target": "components/ui/file-upload.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Profile picture upload",
"Document submission forms (KYC, verification)",
"Media uploads in content creation flows",
"Bulk import for admin interfaces",
"Attachment upload in messaging and email"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "file-upload",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/button"],
"title": "File Upload",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "A horizontal bar of toggleable filter chips with optional counts and a clear button.",
"docs": "Use it for: Search result filtering with active indicators, Marketplace listing filters, Inbox and feed filtering, Analytics dashboard filter bar, Content library category filters.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/filter-bar",
"files": [
{
"path": "components/registry/n2-primitives/filter-bar.tsx",
"target": "components/ui/filter-bar.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Search result filtering with active indicators",
"Marketplace listing filters",
"Inbox and feed filtering",
"Analytics dashboard filter bar",
"Content library category filters"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "filter-bar",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/badge",
"https://api.mzizi.dev/v1/ui/button"
],
"title": "Filter Bar",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Reader customization panel for font size, line height, theme (light/dark/sepia), font family (Noto Sans/Serif/system), and text alignment. Persisted per-user in the Digital Twin preferences. Used in Novels reader and News article reader mode.",
"docs": "Use it for: novels, news.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/font-settings-panel",
"files": [
{
"path": "components/registry/n2-primitives/font-settings-panel.tsx",
"target": "components/ui/font-settings-panel.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["novels", "news"],
"variants": ["default", "sm", "lg"]
},
"name": "font-settings-panel",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/slider",
"https://api.mzizi.dev/v1/ui/radio-group",
"https://api.mzizi.dev/v1/ui/card"
],
"title": "Font Settings Panel",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": [
"@radix-ui/react-label",
"@radix-ui/react-slot",
"react-hook-form"
],
"description": "Building forms with React Hook Form and Zod.",
"docs": "Use it for: Multi-field registration forms, Settings pages with validation, Checkout forms with structured fields, KYC and identity verification forms, Complex business data entry forms.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/form",
"files": [
{
"path": "components/registry/n2-primitives/form.tsx",
"target": "components/ui/form.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Multi-field registration forms",
"Settings pages with validation",
"Checkout forms with structured fields",
"KYC and identity verification forms",
"Complex business data entry forms"
],
"variants": ["default"]
},
"name": "form",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/label"],
"title": "Form",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Transaction cost preview showing estimated gas fee in NHC with fiat equivalent. Highlights that MIT holders have static gas prices per Honeycomb protocol. Used before any on-chain transaction in Wallet.",
"docs": "Use it for: wallet.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/gas-estimator",
"files": [
{
"path": "components/registry/n2-primitives/gas-estimator.tsx",
"target": "components/ui/gas-estimator.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["wallet"],
"variants": ["default"]
},
"name": "gas-estimator",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/card"],
"title": "Gas Estimator",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Circle/group info header with cover image, name, description, member count, privacy status, rules summary, and admin list. Used at the top of Circle detail pages and group settings. Maps to circles.circle table.",
"docs": "Use it for: circles.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/group-info-card",
"files": [
{
"path": "components/registry/n2-primitives/group-info-card.tsx",
"target": "components/ui/group-info-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["circles"],
"variants": ["default", "sm", "lg"]
},
"name": "group-info-card",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/avatar-group",
"https://api.mzizi.dev/v1/ui/badge"
],
"title": "Group Info Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Health dashboard page. Vitals overview, activity rings, medication reminders, upcoming appointments, health score. Competitors: Apple Health, MyFitnessPal, Babylon.",
"docs": "Use it for: health.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/health-dashboard-page",
"files": [
{
"path": "components/registry/n6-pages/health-dashboard-page.tsx",
"target": "components/ui/health-dashboard-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["health"],
"variants": ["default", "loading"]
},
"name": "health-dashboard-page",
"registryDependencies": [],
"title": "Health Dashboard Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Encrypted health record summary card showing recent visits, active prescriptions, allergies, and conditions. Data sourced from the sovereign Digital Twin pod — NEVER from Supabase. Respects Covenant One.",
"docs": "Use it for: health.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/health-record-summary",
"files": [
{
"path": "components/registry/n2-primitives/health-record-summary.tsx",
"target": "components/ui/health-record-summary.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["health"],
"variants": ["default"]
},
"name": "health-record-summary",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/accordion",
"https://api.mzizi.dev/v1/ui/badge"
],
"title": "Health Record Summary",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Horizontal scroll container with CSS scroll-snap for mobile-friendly card browsing. Hides scrollbar, supports snap-to-item alignment. Used for hourly forecast cards, category browsers, story rings, product carousels, and any horizontal list that should swipe naturally on mobile. Proper role=\"list\" with keyboard navigation.",
"docs": "Use it for: pulse, circles, bytes.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/horizontal-scroll",
"files": [
{
"path": "components/registry/n2-primitives/horizontal-scroll.tsx",
"target": "components/ui/horizontal-scroll.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["pulse", "circles", "bytes"],
"variants": ["default"]
},
"name": "horizontal-scroll",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/utils"],
"title": "Horizontal Scroll",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui"],
"description": "For sighted users to preview content available behind a link.",
"docs": "Use it for: User profile previews on hover, Link destination previews, Product quick-view cards, Tag and category info previews, Rich-media preview on hover.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/hover-card",
"files": [
{
"path": "components/registry/n2-primitives/hover-card.tsx",
"target": "components/ui/hover-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"User profile previews on hover",
"Link destination previews",
"Product quick-view cards",
"Tag and category info previews",
"Rich-media preview on hover"
],
"variants": ["default"]
},
"name": "hover-card",
"registryDependencies": [],
"title": "Hover Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Individual user profile page. Avatar, bio, verification tier, trust score, activity stats, content tabs (posts, media, listings, reviews). Competitors: LinkedIn, Instagram, WeChat.",
"docs": "Use it for: pulse, shamwari, campfire, circles, bytes.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/individual-profile-page",
"files": [
{
"path": "components/registry/n6-pages/individual-profile-page.tsx",
"target": "components/ui/individual-profile-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["pulse", "shamwari", "campfire", "circles", "bytes"],
"variants": ["default", "loading"]
},
"name": "individual-profile-page",
"registryDependencies": [],
"title": "Individual Profile Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "IntersectionObserver-based scroll sentinel for loading more content.",
"docs": "Use it for: Social feed endless scrolling, Search results lazy-load, Comments and thread lazy-load, Image gallery progressive loading, Product catalog infinite scroll.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/infinite-scroll",
"files": [
{
"path": "components/registry/n2-primitives/infinite-scroll.tsx",
"target": "components/ui/infinite-scroll.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Social feed endless scrolling",
"Search results lazy-load",
"Comments and thread lazy-load",
"Image gallery progressive loading",
"Product catalog infinite scroll"
],
"variants": ["default", "sm", "lg"]
},
"name": "infinite-scroll",
"registryDependencies": [],
"title": "Infinite Scroll",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Simple label + value display row with optional icon. Used on detail pages for key-value information: \"Temperature: 28°C\", \"Location: Harare\", \"Status: Active\". Compact single-line layout with icon left, label middle, value right-aligned. Production-proven in mukoko-weather for atmospheric details.",
"docs": "Use it for: nhimbe, wallet, places.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/info-row",
"files": [
{
"path": "components/registry/n2-primitives/info-row.tsx",
"target": "components/ui/info-row.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["nhimbe", "wallet", "places"],
"variants": ["default", "sm", "lg"]
},
"name": "info-row",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/utils"],
"title": "Info Row",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Infrastructure monitoring page. Service health grid, deployment history, resource utilization gauges, incident timeline. For Nyuchi Web Services ops. Competitors: Datadog, New Relic.",
"docs": "Use it for: console.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/infrastructure-page",
"files": [
{
"path": "components/registry/n6-pages/infrastructure-page.tsx",
"target": "components/ui/infrastructure-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["console"],
"variants": ["default", "loading"]
},
"name": "infrastructure-page",
"registryDependencies": [],
"title": "Infrastructure Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Click-to-edit text field that transforms from display mode to input mode on interaction. Pattern for low-friction editing in admin tables, settings pages, and profile fields. Supports validation, optimistic save, and revert on escape. Audit flagged as missing UX pattern. ALPHA — awaiting frontend implementation.",
"docs": "Use it for: Editable table cells (admin tables), Profile field editing, Task title editing in kanban cards, Settings value editing, Inline note and comment editing.\nVariants: text, textarea, select, number.\nIncludes: Click to activate editing, Escape to revert, Enter to save, Blur to save (configurable), Optimistic save with rollback, Validation per field type.\nAccessibility: Initial display role=button with edit hint, Edit mode exposes role=textbox, Save/cancel announced to screen reader, Keyboard shortcuts labelled, Focus returned to display after save/cancel.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/inline-edit",
"files": [
{
"path": "components/registry/n2-primitives/inline-edit.tsx",
"target": "components/ui/inline-edit.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Initial display role=button with edit hint",
"Edit mode exposes role=textbox",
"Save/cancel announced to screen reader",
"Keyboard shortcuts labelled",
"Focus returned to display after save/cancel"
],
"collection": "primitives",
"features": [
"Click to activate editing",
"Escape to revert",
"Enter to save",
"Blur to save (configurable)",
"Optimistic save with rollback",
"Validation per field type"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Editable table cells (admin tables)",
"Profile field editing",
"Task title editing in kanban cards",
"Settings value editing",
"Inline note and comment editing"
],
"variants": ["text", "textarea", "select", "number"]
},
"name": "inline-edit",
"registryDependencies": [],
"title": "Inline Edit",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": [],
"description": "Displays a form input field.",
"docs": "Use it for: Text input for usernames, emails, and short text, Search bar base input, Profile field editing, Form field for any short text data, Inline editable field foundation.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/input",
"files": [
{
"path": "components/registry/n2-primitives/input.tsx",
"target": "components/ui/input.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Text input for usernames, emails, and short text",
"Search bar base input",
"Profile field editing",
"Form field for any short text data",
"Inline editable field foundation"
],
"variants": ["default"]
},
"name": "input",
"registryDependencies": [],
"title": "Input",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["class-variance-authority"],
"description": "Groups input, button, and addon elements together.",
"docs": "Use it for: Search input with button suffix, Currency input with unit prefix, Input with inline copy button, URL input with protocol prefix, Input with icon decorations.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/input-group",
"files": [
{
"path": "components/registry/n2-primitives/input-group.tsx",
"target": "components/ui/input-group.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Search input with button suffix",
"Currency input with unit prefix",
"Input with inline copy button",
"URL input with protocol prefix",
"Input with icon decorations"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "input-group",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/input",
"https://api.mzizi.dev/v1/ui/textarea"
],
"title": "Input Group",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["input-otp"],
"description": "Accessible one-time password component with copy paste functionality.",
"docs": "Use it for: Two-factor authentication code entry, Phone number verification codes, Email verification codes, PIN entry for secure actions, Magic link verification codes.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/input-otp",
"files": [
{
"path": "components/registry/n2-primitives/input-otp.tsx",
"target": "components/ui/input-otp.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Two-factor authentication code entry",
"Phone number verification codes",
"Email verification codes",
"PIN entry for secure actions",
"Magic link verification codes"
],
"variants": ["default", "sm", "lg"]
},
"name": "input-otp",
"registryDependencies": [],
"title": "Input OTP",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Shareable invite card with QR code, copyable link, expiry countdown, and usage count. Used for Circle invitations, event invites (Nhimbe), and referral links. Mineral-colored QR code.",
"docs": "Use it for: circles, nhimbe.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/invite-link",
"files": [
{
"path": "components/registry/n2-primitives/invite-link.tsx",
"target": "components/ui/invite-link.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["circles", "nhimbe"],
"variants": ["default"]
},
"name": "invite-link",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/copy-button"
],
"title": "Invite Link",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Invoice line item with date, amount, status badge, and download.",
"docs": "Use it for: Billing history in account settings, Invoice line display in admin panel, Payment record with downloadable PDF, Subscription billing cycle history, Refund and credit note display.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/invoice-row",
"files": [
{
"path": "components/registry/n2-primitives/invoice-row.tsx",
"target": "components/ui/invoice-row.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Billing history in account settings",
"Invoice line display in admin panel",
"Payment record with downloadable PDF",
"Subscription billing cycle history",
"Refund and credit note display"
],
"variants": ["default", "sm", "lg"]
},
"name": "invoice-row",
"registryDependencies": [],
"title": "Invoice Row",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["class-variance-authority", "radix-ui"],
"description": "A flexible item component for lists, menus, and settings.",
"docs": "Use it for: Settings list items with label and control, Menu list items in dropdowns, Row items in data lists, Flexible list building block, Selection list entries.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/item",
"files": [
{
"path": "components/registry/n2-primitives/item.tsx",
"target": "components/ui/item.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Settings list items with label and control",
"Menu list items in dropdowns",
"Row items in data lists",
"Flexible list building block",
"Selection list entries"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "item",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/separator"],
"title": "Item",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Multi-leg journey planner view showing sequential stops with transport modes, transfer points, and timing. Used in Transport for commute planning and in Planner for multi-event day views.",
"docs": "Use it for: planner, transport.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/itinerary-timeline",
"files": [
{
"path": "components/registry/n2-primitives/itinerary-timeline.tsx",
"target": "components/ui/itinerary-timeline.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["planner", "transport"],
"variants": ["default", "sm", "lg"]
},
"name": "itinerary-timeline",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/timeline",
"https://api.mzizi.dev/v1/ui/badge",
"https://api.mzizi.dev/v1/ui/separator"
],
"title": "Itinerary Timeline",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Job board/listings page. Search, filters (location, type, salary, industry), list of job cards. Competitors: LinkedIn, Indeed, Glassdoor.",
"docs": "Use it for: jobs.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/job-board-page",
"files": [
{
"path": "components/registry/n6-pages/job-board-page.tsx",
"target": "components/ui/job-board-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["jobs"],
"variants": ["default", "loading"]
},
"name": "job-board-page",
"registryDependencies": [],
"title": "Job Board Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Collapsible JSON tree view with syntax coloring and type indicators.",
"docs": "Use it for: API response inspection in developer tools, Configuration file previews, Debug data visualization, Schema exploration in admin interfaces, Webhook payload inspection.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/json-viewer",
"files": [
{
"path": "components/registry/n2-primitives/json-viewer.tsx",
"target": "components/ui/json-viewer.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"API response inspection in developer tools",
"Configuration file previews",
"Debug data visualization",
"Schema exploration in admin interfaces",
"Webhook payload inspection"
],
"variants": ["default", "sm", "lg"]
},
"name": "json-viewer",
"registryDependencies": [],
"title": "Json Viewer",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Column-based board for organizing items by status with drag indicators.",
"docs": "Use it for: Task management boards (Trello-style), Content pipeline visualization, Sales opportunity tracking, Applicant tracking boards, Project status swim lanes.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/kanban-board",
"files": [
{
"path": "components/registry/n2-primitives/kanban-board.tsx",
"target": "components/ui/kanban-board.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Task management boards (Trello-style)",
"Content pipeline visualization",
"Sales opportunity tracking",
"Applicant tracking boards",
"Project status swim lanes"
],
"variants": ["default", "sm", "lg"]
},
"name": "kanban-board",
"registryDependencies": [],
"title": "Kanban Board",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Displays a keyboard shortcut or key combination.",
"docs": "Use it for: Showing keyboard shortcuts in command palettes, Help documentation with keystroke references, Tutorial overlays teaching keyboard navigation, Tooltip hints for power-user shortcuts, Accessibility-focused keyboard reference panels.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/kbd",
"files": [
{
"path": "components/registry/n2-primitives/kbd.tsx",
"target": "components/ui/kbd.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Showing keyboard shortcuts in command palettes",
"Help documentation with keystroke references",
"Tutorial overlays teaching keyboard navigation",
"Tooltip hints for power-user shortcuts",
"Accessibility-focused keyboard reference panels"
],
"variants": ["default", "sm", "lg"]
},
"name": "kbd",
"registryDependencies": [],
"title": "Kbd",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Key Performance Indicator card. Displays a metric label, large value, optional change percentage with trend direction. Extracted from analytics-dashboard-page, console-dashboard-page, and wallet-page where the same pattern was repeated inline. Brand-agnostic — uses semantic CSS vars only.",
"docs": "Use it for: nhimbe, news, console.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/kpi-card",
"files": [
{
"path": "components/registry/n2-primitives/kpi-card.tsx",
"target": "components/ui/kpi-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["nhimbe", "news", "console"],
"variants": ["default"]
},
"name": "kpi-card",
"registryDependencies": [],
"title": "Kpi Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui"],
"description": "Renders an accessible label associated with controls.",
"docs": "Use it for: Form field labels, Accessible association between label and control, Required-field indicators, Floating and static label patterns, Visually hidden labels for screen-reader-only contexts.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/label",
"files": [
{
"path": "components/registry/n2-primitives/label.tsx",
"target": "components/ui/label.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Form field labels",
"Accessible association between label and control",
"Required-field indicators",
"Floating and static label patterns",
"Visually hidden labels for screen-reader-only contexts"
],
"variants": ["default"]
},
"name": "label",
"registryDependencies": [],
"title": "Label",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "In-app language selector with locale display. Prioritizes the 16 Zimbabwean official languages (Shona, Ndebele first), then African languages, then global. Shows current language with flag/code indicator. Critical for a platform serving 54 countries and 2000+ languages.",
"docs": "Use it for: all.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/language-switcher",
"files": [
{
"path": "components/registry/n2-primitives/language-switcher.tsx",
"target": "components/ui/language-switcher.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["all"],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "language-switcher",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/select",
"https://api.mzizi.dev/v1/ui/button"
],
"title": "Language Switcher",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "TikTok-style progressive lazy section with sequential mount queue and bidirectional visibility. Only ONE section mounts at a time via a global FIFO queue, preventing DOM/Canvas surges that OOM mobile browsers. Sections unmount when scrolled far off-screen (1500px margin) to cap peak memory. Adaptive timing: 150ms settle on mobile, 50ms on desktop. Production-proven in mukoko-weather with 7 Chart.js sections. The registry's most critical performance primitive.",
"docs": "Use it for: Chart-heavy dashboards on mobile (mukoko-weather pattern), Feed pages with multiple heavy sections, Long-form content with embedded media, Image-heavy galleries with staggered loading, Any mobile surface with multiple Canvas/WebGL contexts.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/lazy-section",
"files": [
{
"path": "components/registry/n2-primitives/lazy-section.tsx",
"target": "components/lazy-section.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Chart-heavy dashboards on mobile (mukoko-weather pattern)",
"Feed pages with multiple heavy sections",
"Long-form content with embedded media",
"Image-heavy galleries with staggered loading",
"Any mobile surface with multiple Canvas/WebGL contexts"
],
"variants": ["default"]
},
"name": "lazy-section",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/use-mobile",
"https://api.mzizi.dev/v1/ui/observability"
],
"title": "Lazy Section",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Learning/education page. Course content, lesson progress, quiz area, notes. Competitors: Duolingo, Coursera, Khan Academy.",
"docs": "Use it for: shamwari, lingo.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/learning-page",
"files": [
{
"path": "components/registry/n6-pages/learning-page.tsx",
"target": "components/ui/learning-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["shamwari", "lingo"],
"variants": ["default", "loading"]
},
"name": "learning-page",
"registryDependencies": [],
"title": "Learning Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Full-screen image viewer with gallery navigation.",
"docs": "Use it for: Gallery and photo viewer in media apps, Product image viewer with zoom, Document page-by-page viewer, Full-screen image detail in marketplace listings, Screenshot walkthroughs in onboarding.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/lightbox",
"files": [
{
"path": "components/registry/n2-primitives/lightbox.tsx",
"target": "components/ui/lightbox.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Gallery and photo viewer in media apps",
"Product image viewer with zoom",
"Document page-by-page viewer",
"Full-screen image detail in marketplace listings",
"Screenshot walkthroughs in onboarding"
],
"variants": ["default", "sm", "lg"]
},
"name": "lightbox",
"registryDependencies": [],
"title": "Lightbox",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Interactive map-based location selection form control. User taps/clicks map to set coordinates, with search input for address lookup. Returns lat/lng and formatted address. Used in event creation (Nhimbe), business listing (BushTrade/Places), and any form that needs a geographic input.",
"docs": "Use it for: nhimbe, places, bushtrade.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/location-picker",
"files": [
{
"path": "components/registry/n2-primitives/location-picker.tsx",
"target": "components/ui/location-picker.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["nhimbe", "places", "bushtrade"],
"variants": ["default", "sm", "lg"]
},
"name": "location-picker",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/map-view",
"https://api.mzizi.dev/v1/ui/input"
],
"title": "Location Picker",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Live/static location sharing card in chat. Shows a mini map preview with pin, address, and share duration (for live). Used in Campfire for meeting coordination, Transport for pickup points, and Places for recommendations.",
"docs": "Use it for: campfire, places, transport.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/location-share",
"files": [
{
"path": "components/registry/n2-primitives/location-share.tsx",
"target": "components/ui/location-share.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["campfire", "places", "transport"],
"variants": ["default", "sm", "lg"]
},
"name": "location-share",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/map-view",
"https://api.mzizi.dev/v1/ui/card"
],
"title": "Location Share",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Scrollable filterable log output with severity coloring and auto-scroll.",
"docs": "Use it for: Application log streaming in developer console, Error log investigation with filtering, Audit trail display with severity indicators, Deployment log viewer with auto-scroll, Real-time server log monitoring.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/log-viewer",
"files": [
{
"path": "components/registry/n2-primitives/log-viewer.tsx",
"target": "components/ui/log-viewer.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Application log streaming in developer console",
"Error log investigation with filtering",
"Audit trail display with severity indicators",
"Deployment log viewer with auto-scroll",
"Real-time server log monitoring"
],
"variants": ["default"]
},
"name": "log-viewer",
"registryDependencies": [],
"title": "Log Viewer",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Centered card login with email/password and mineral accent stripe.",
"docs": "Use it for: Authentication flow, Login/signup entry point.\nVariants: default, loading.\nAccessibility: Form labels, Keyboard navigation, Error announcements, Focus-visible via L1 global CSS.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/login-01",
"files": [
{
"path": "components/registry/n6-pages/login-01.tsx",
"target": "components/blocks/login-01.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": [
"Form labels",
"Keyboard navigation",
"Error announcements",
"Focus-visible via L1 global CSS"
],
"collection": "pages",
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["Authentication flow", "Login/signup entry point"],
"variants": ["default", "loading"]
},
"name": "login-01",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/input",
"https://api.mzizi.dev/v1/ui/label",
"https://api.mzizi.dev/v1/ui/nyuchi-harness"
],
"title": "Login 01",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Split layout login with brand image left, form right.",
"docs": "Use it for: Authentication flow, Login/signup entry point.\nVariants: default, loading.\nAccessibility: Form labels, Keyboard navigation, Error announcements, Focus-visible via L1 global CSS.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/login-02",
"files": [
{
"path": "components/registry/n6-pages/login-02.tsx",
"target": "components/blocks/login-02.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": [
"Form labels",
"Keyboard navigation",
"Error announcements",
"Focus-visible via L1 global CSS"
],
"collection": "pages",
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["Authentication flow", "Login/signup entry point"],
"variants": ["default", "loading"]
},
"name": "login-02",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/input",
"https://api.mzizi.dev/v1/ui/label",
"https://api.mzizi.dev/v1/ui/nyuchi-harness"
],
"title": "Login 02",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Social login buttons (Google, GitHub) plus email/password form.",
"docs": "Use it for: Authentication flow, Login/signup entry point.\nVariants: default, loading.\nAccessibility: Form labels, Keyboard navigation, Error announcements, Focus-visible via L1 global CSS.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/login-03",
"files": [
{
"path": "components/registry/n6-pages/login-03.tsx",
"target": "components/blocks/login-03.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": [
"Form labels",
"Keyboard navigation",
"Error announcements",
"Focus-visible via L1 global CSS"
],
"collection": "pages",
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["Authentication flow", "Login/signup entry point"],
"variants": ["default", "loading"]
},
"name": "login-03",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/input",
"https://api.mzizi.dev/v1/ui/label",
"https://api.mzizi.dev/v1/ui/nyuchi-harness"
],
"title": "Login 03",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "OTP/magic link style login with code input.",
"docs": "Use it for: Authentication flow, Login/signup entry point.\nVariants: default, loading.\nAccessibility: Form labels, Keyboard navigation, Error announcements, Focus-visible via L1 global CSS.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/login-04",
"files": [
{
"path": "components/registry/n6-pages/login-04.tsx",
"target": "components/blocks/login-04.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": [
"Form labels",
"Keyboard navigation",
"Error announcements",
"Focus-visible via L1 global CSS"
],
"collection": "pages",
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["Authentication flow", "Login/signup entry point"],
"variants": ["default", "loading"]
},
"name": "login-04",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/input",
"https://api.mzizi.dev/v1/ui/label",
"https://api.mzizi.dev/v1/ui/nyuchi-harness"
],
"title": "Login 04",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Two-column login with brand showcase and mineral colors.",
"docs": "Use it for: Authentication flow, Login/signup entry point.\nVariants: default, loading.\nAccessibility: Form labels, Keyboard navigation, Error announcements, Focus-visible via L1 global CSS.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/login-05",
"files": [
{
"path": "components/registry/n6-pages/login-05.tsx",
"target": "components/blocks/login-05.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": [
"Form labels",
"Keyboard navigation",
"Error announcements",
"Focus-visible via L1 global CSS"
],
"collection": "pages",
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["Authentication flow", "Login/signup entry point"],
"variants": ["default", "loading"]
},
"name": "login-05",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/input",
"https://api.mzizi.dev/v1/ui/label",
"https://api.mzizi.dev/v1/ui/nyuchi-harness"
],
"title": "Login 05",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Logs viewer page. Real-time log stream, severity filters, search, time range, structured log expansion. For Nyuchi Web Services debugging and compliance audit trails.",
"docs": "Use it for: console.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/logs-page",
"files": [
{
"path": "components/registry/n6-pages/logs-page.tsx",
"target": "components/ui/logs-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["console"],
"variants": ["default", "loading"]
},
"name": "logs-page",
"registryDependencies": [],
"title": "Logs Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Full-page maintenance mode display with estimated return time.",
"docs": "Use it for: Scheduled maintenance windows, Emergency downtime notifications, Migration and upgrade pages, Temporary service unavailability displays, Whitelisted-only access modes during deployment.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/maintenance-page",
"files": [
{
"path": "components/registry/n2-primitives/maintenance-page.tsx",
"target": "components/ui/maintenance-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Scheduled maintenance windows",
"Emergency downtime notifications",
"Migration and upgrade pages",
"Temporary service unavailability displays",
"Whitelisted-only access modes during deployment"
],
"variants": ["default"]
},
"name": "maintenance-page",
"registryDependencies": [],
"title": "Maintenance Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Floating preview card that appears on map marker interaction. Shows a compact listing-card inside the map context with image, title, category, and action. Bridges the map view to the listing detail flow.",
"docs": "Use it for: nhimbe, places, bushtrade.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/map-card",
"files": [
{
"path": "components/registry/n2-primitives/map-card.tsx",
"target": "components/ui/map-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["nhimbe", "places", "bushtrade"],
"variants": ["default", "sm", "lg"]
},
"name": "map-card",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/map-view",
"https://api.mzizi.dev/v1/ui/card"
],
"title": "Map Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Grouped marker display for high-density map areas. Shows count badge with mineral accent and expands on interaction. Used when multiple listings/places overlap at the current zoom level.",
"docs": "Use it for: nhimbe, places, bushtrade.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/map-cluster",
"files": [
{
"path": "components/registry/n2-primitives/map-cluster.tsx",
"target": "components/ui/map-cluster.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["nhimbe", "places", "bushtrade"],
"variants": ["default", "sm", "lg"]
},
"name": "map-cluster",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/map-view",
"https://api.mzizi.dev/v1/ui/map-marker"
],
"title": "Map Cluster",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Custom branded map pin with mineral-colored variants and verification tier indicators. Supports default, verified, featured, and cluster states. The pin shape uses the Nyuchi pill radius for consistency. Maps to places.places and events.event tables.",
"docs": "Use it for: places, transport, bushtrade.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/map-marker",
"files": [
{
"path": "components/registry/n2-primitives/map-marker.tsx",
"target": "components/ui/map-marker.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["places", "transport", "bushtrade"],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "map-marker",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/map-view"],
"title": "Map Marker",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Map/navigation page. Full-screen map with search, pin details, route overlay, bottom sheet for location info. Competitors: Google Maps, Uber, Bolt.",
"docs": "Use it for: planner, places, transport.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/map-page",
"files": [
{
"path": "components/registry/n6-pages/map-page.tsx",
"target": "components/ui/map-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["planner", "places", "transport"],
"variants": ["default", "loading"]
},
"name": "map-page",
"registryDependencies": [],
"title": "Map Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Route visualization overlay for map with waypoints, distance, and estimated time. Supports driving, walking, transit, and cycling modes. Used by Transport mini-app for commute planning and route display.",
"docs": "Use it for: places, transport.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/map-route",
"files": [
{
"path": "components/registry/n2-primitives/map-route.tsx",
"target": "components/ui/map-route.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["places", "transport"],
"variants": ["default"]
},
"name": "map-route",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/map-view"],
"title": "Map Route",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["mapbox-gl"],
"description": "Embeddable map container with design system tokens, mineral-colored controls, and branded attribution. Wraps Mapbox GL JS with Nyuchi theme integration. Supports tile layers, zoom controls, geolocation, and fullscreen toggle. The foundational map primitive for Places, Transport, BushTrade, Nhimbe, and any app that shows a geographic context.",
"docs": "Use it for: nhimbe, places, transport.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/map-view",
"files": [
{
"path": "components/registry/n2-primitives/map-view.tsx",
"target": "components/ui/map-view.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["nhimbe", "places", "transport"],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "map-view",
"registryDependencies": [],
"title": "Map View",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Themed markdown-to-HTML renderer with design system typography and colors.",
"docs": "Use it for: Rendering LLM markdown output with Nyuchi typography, Documentation pages rendered from markdown source, AI-generated articles with themed code blocks, User-composed rich text in chat and comments, Knowledge base articles with consistent styling.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/markdown-renderer",
"files": [
{
"path": "components/registry/n2-primitives/markdown-renderer.tsx",
"target": "components/ui/markdown-renderer.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Rendering LLM markdown output with Nyuchi typography",
"Documentation pages rendered from markdown source",
"AI-generated articles with themed code blocks",
"User-composed rich text in chat and comments",
"Knowledge base articles with consistent styling"
],
"variants": ["default"]
},
"name": "markdown-renderer",
"registryDependencies": [],
"title": "Markdown Renderer",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Marketplace/storefront browsing page. Search, category filters, grid/list toggle, product cards. Competitors: Jumia, Amazon, Alibaba, Facebook Marketplace.",
"docs": "Use it for: nhimbe, places, bushtrade.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/marketplace-page",
"files": [
{
"path": "components/registry/n6-pages/marketplace-page.tsx",
"target": "components/ui/marketplace-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["nhimbe", "places", "bushtrade"],
"variants": ["default", "loading"]
},
"name": "marketplace-page",
"registryDependencies": [],
"title": "Marketplace Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "CSS columns-based variable-height grid layout.",
"docs": "Use it for: Pinterest-style content boards, Variable-height photo galleries, Card grids with mixed content sizes, Blog post masonry layouts, User-generated content displays.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/masonry-grid",
"files": [
{
"path": "components/registry/n2-primitives/masonry-grid.tsx",
"target": "components/ui/masonry-grid.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Pinterest-style content boards",
"Variable-height photo galleries",
"Card grids with mixed content sizes",
"Blog post masonry layouts",
"User-generated content displays"
],
"variants": ["default"]
},
"name": "masonry-grid",
"registryDependencies": [],
"title": "Masonry Grid",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Horizontal scrollable filter/effect picker — the TikTok/Instagram paradigm. Shows filter previews as circular thumbnails with names. Applies visual effects to camera preview or captured media. Used in Bytes creation flow.",
"docs": "Use it for: bytes.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/media-filter-strip",
"files": [
{
"path": "components/registry/n2-primitives/media-filter-strip.tsx",
"target": "components/ui/media-filter-strip.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["bytes"],
"variants": ["default", "sm", "lg"]
},
"name": "media-filter-strip",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/scroll-area"],
"title": "Media Filter Strip",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Full-screen media player page. Video/audio player with controls, comments, related content. Competitors: YouTube, TikTok, Netflix, Spotify.",
"docs": "Use it for: pulse, bytes, news.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/media-player-page",
"files": [
{
"path": "components/registry/n6-pages/media-player-page.tsx",
"target": "components/ui/media-player-page.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["pulse", "bytes", "news"],
"variants": ["default", "loading"]
},
"name": "media-player-page",
"registryDependencies": [],
"title": "Media Player Page",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Medication schedule card with drug name, dosage, timing intervals, adherence tracking, and snooze/take actions. Maps to health.medication_reminder table. Stores reminders in the sovereign Digital Twin pod.",
"docs": "Use it for: health.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/medication-reminder",
"files": [
{
"path": "components/registry/n2-primitives/medication-reminder.tsx",
"target": "components/ui/medication-reminder.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["health"],
"variants": ["default"]
},
"name": "medication-reminder",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/badge",
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/progress"
],
"title": "Medication Reminder",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": ["radix-ui"],
"description": "Full-width flyout navigation with columns of links grouped by section.",
"docs": "Use it for: Complex site navigation with multiple product areas, E-commerce category exploration menus, Enterprise application section navigation, Content-heavy website navigation, Desktop-class app feature discovery.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mega-menu",
"files": [
{
"path": "components/registry/n2-primitives/mega-menu.tsx",
"target": "components/ui/mega-menu.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Complex site navigation with multiple product areas",
"E-commerce category exploration menus",
"Enterprise application section navigation",
"Content-heavy website navigation",
"Desktop-class app feature discovery"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "mega-menu",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/popover",
"https://api.mzizi.dev/v1/ui/button"
],
"title": "Mega Menu",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Scrollable member directory with role badges (admin/moderator/member), online status dots, join date, and search filtering. Used in Circle member management and event attendee lists. Maps to circles.circle_membership table.",
"docs": "Use it for: circles, nhimbe.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/member-list",
"files": [
{
"path": "components/registry/n2-primitives/member-list.tsx",
"target": "components/ui/member-list.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["circles", "nhimbe"],
"variants": ["default", "sm", "lg"]
},
"name": "member-list",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/avatar",
"https://api.mzizi.dev/v1/ui/badge",
"https://api.mzizi.dev/v1/ui/search-bar",
"https://api.mzizi.dev/v1/ui/virtual-list"
],
"title": "Member List",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "User/member display row with avatar, name, email/subtitle, role badge, and status indicator. Extracted from team-management-page and chat-page. Brand-agnostic primitive.",
"docs": "Use it for: campfire, circles, nhimbe.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/member-row",
"files": [
{
"path": "components/registry/n2-primitives/member-row.tsx",
"target": "components/ui/member-row.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["campfire", "circles", "nhimbe"],
"variants": ["default", "sm", "lg"]
},
"name": "member-row",
"registryDependencies": [],
"title": "Member Row",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Text input with @mention autocomplete for users.",
"docs": "Use it for: Comment composition with @user mentions, Message input with team member mentions, Task assignment input with user picker, Collaborative document editing mentions, Review and approval request mentions.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mention-input",
"files": [
{
"path": "components/registry/n2-primitives/mention-input.tsx",
"target": "components/ui/mention-input.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Comment composition with @user mentions",
"Message input with team member mentions",
"Task assignment input with user picker",
"Collaborative document editing mentions",
"Review and approval request mentions"
],
"variants": ["default", "sm", "lg"]
},
"name": "mention-input",
"registryDependencies": [],
"title": "Mention Input",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["radix-ui"],
"description": "A visually persistent menu common in desktop applications.",
"docs": "Use it for: Desktop application menu bar (File/Edit/View/Help), Admin console top menu navigation, Content editor top-level actions, Professional app keyboard-first navigation, Power-user productivity tool navigation.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/menubar",
"files": [
{
"path": "components/registry/n2-primitives/menubar.tsx",
"target": "components/ui/menubar.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Desktop application menu bar (File/Edit/View/Help)",
"Admin console top menu navigation",
"Content editor top-level actions",
"Professional app keyboard-first navigation",
"Power-user productivity tool navigation"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "menubar",
"registryDependencies": [],
"title": "Menubar",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Nested reply thread with indentation and collapse/expand.",
"docs": "Use it for: Reply threads within chat conversations, Nested replies in forum-style discussions, Email-style threaded message display, Issue comment threads with replies, Collaborative document comment chains.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/message-thread",
"files": [
{
"path": "components/registry/n2-primitives/message-thread.tsx",
"target": "components/ui/message-thread.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Reply threads within chat conversations",
"Nested replies in forum-style discussions",
"Email-style threaded message display",
"Issue comment threads with replies",
"Collaborative document comment chains"
],
"variants": ["default"]
},
"name": "message-thread",
"registryDependencies": [],
"title": "Message Thread",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "MFA enrollment card with QR code and verification step.",
"docs": "Use it for: Multi-factor authentication enrollment, Account security setup during onboarding, Re-enrollment after device change, Admin-enforced MFA setup flow, Hardware key registration.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mfa-setup",
"files": [
{
"path": "components/registry/n2-primitives/mfa-setup.tsx",
"target": "components/ui/mfa-setup.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Multi-factor authentication enrollment",
"Account security setup during onboarding",
"Re-enrollment after device change",
"Admin-enforced MFA setup flow",
"Hardware key registration"
],
"variants": ["default", "sm", "lg"]
},
"name": "mfa-setup",
"registryDependencies": [],
"title": "Mfa Setup",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Payment method picker for African mobile money services — EcoCash, MTN MoMo, Airtel Money, M-Pesa, and Innbucks. Shows provider logo, phone number input, and USSD code reference. This is HOW Africa pays — the primary payment primitive for the continent.",
"docs": "Use it for: nhimbe, wallet, bushtrade.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mobile-money-selector",
"files": [
{
"path": "components/registry/n2-primitives/mobile-money-selector.tsx",
"target": "components/ui/mobile-money-selector.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["nhimbe", "wallet", "bushtrade"],
"variants": ["default", "sm", "lg"]
},
"name": "mobile-money-selector",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/radio-group"
],
"title": "Mobile Money Selector",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Content review item showing flagged content preview, report reason, reporter info, and approve/reject/escalate action buttons. Maps to system.content_moderation. Used in the Nyuchi Console moderation dashboard.",
"docs": "Use it for: console.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/moderation-queue-item",
"files": [
{
"path": "components/registry/n2-primitives/moderation-queue-item.tsx",
"target": "components/ui/moderation-queue-item.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["console"],
"variants": ["default"]
},
"name": "moderation-queue-item",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/button-group",
"https://api.mzizi.dev/v1/ui/badge",
"https://api.mzizi.dev/v1/ui/avatar"
],
"title": "Moderation Queue Item",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Audio track browser and selector for video creation. Search, preview, and attach music tracks to Bytes content. Shows track name, artist, duration, and waveform preview. Used in Bytes post-capture editing.",
"docs": "Use it for: bytes.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/music-selector",
"files": [
{
"path": "components/registry/n2-primitives/music-selector.tsx",
"target": "components/ui/music-selector.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["bytes"],
"variants": ["default", "sm", "lg"]
},
"name": "music-selector",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/search-bar",
"https://api.mzizi.dev/v1/ui/audio-waveform"
],
"title": "Music Selector",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["observability", "assurance"],
"dependencies": [],
"description": "Runtime accessibility compliance checker. Scans rendered DOM for WCAG violations: missing ARIA labels, insufficient contrast, missing alt text, broken focus order, touch target sizes. Can run on-demand or continuously in development. Competitors: Lighthouse, axe-core.",
"docs": "Use it for: Platform monitoring, L8 assurance observability.\nVariants: default.\nIncludes: Z-axis depth observability, Cross-layer blast radius analysis via data-portal backlinks, L9 Fundi integration for auto-healing.\nAccessibility: Non-visual infrastructure — no direct a11y requirements.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-a11y-audit",
"files": [
{
"path": "components/registry/n8-assurance/mzizi-a11y-audit.ts",
"target": "lib/mzizi-a11y-audit.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Non-visual infrastructure — no direct a11y requirements"],
"collection": "observability",
"features": [
"Z-axis depth observability",
"Cross-layer blast radius analysis via data-portal backlinks",
"L9 Fundi integration for auto-healing"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Platform monitoring", "L8 assurance observability"],
"variants": ["default"]
},
"name": "mzizi-a11y-audit",
"registryDependencies": [],
"title": "mzizi a11y Audit",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["resilience"],
"dependencies": [],
"description": "Adaptive Bitrate Content — adjusts content quality based on network conditions. Serves lower-resolution images, compressed text, and deferred media on slow connections. Based on TikTok ABR streaming but applied to all content types, not just video. Critical for Africa where 2G/3G is common.",
"docs": "Use it for: Error handling, Graceful degradation, Offline support.\nVariants: default, degraded, error.\nIncludes: Y-axis resilience spine, Netflix resilience patterns.\nAccessibility: Error states announced to screen readers, Retry actions keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-abr-content",
"files": [
{
"path": "components/registry/n5-resilience/mzizi-abr-content.tsx",
"target": "components/ui/mzizi-abr-content.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Error states announced to screen readers",
"Retry actions keyboard accessible"
],
"collection": "resilience",
"features": ["Y-axis resilience spine", "Netflix resilience patterns"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Error handling",
"Graceful degradation",
"Offline support"
],
"variants": ["default", "degraded", "error"]
},
"name": "mzizi-abr-content",
"registryDependencies": [],
"title": "mzizi Abr Content",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["observability", "assurance"],
"dependencies": [],
"description": "SLO/SLA tracking and threshold-based alerting with escalation. Defines budgets (error budget, latency budget), monitors them, and fires alerts when thresholds are breached. Supports severity escalation: warn → page → incident. Competitors: PagerDuty, Grafana Alerting.",
"docs": "Use it for: Platform monitoring, L8 assurance observability.\nVariants: default.\nIncludes: Z-axis depth observability, Cross-layer blast radius analysis via data-portal backlinks, L9 Fundi integration for auto-healing.\nAccessibility: Non-visual infrastructure — no direct a11y requirements.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-alert-engine",
"files": [
{
"path": "components/registry/n8-assurance/mzizi-alert-engine.ts",
"target": "lib/mzizi-alert-engine.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Non-visual infrastructure — no direct a11y requirements"],
"collection": "observability",
"features": [
"Z-axis depth observability",
"Cross-layer blast radius analysis via data-portal backlinks",
"L9 Fundi integration for auto-healing"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Platform monitoring", "L8 assurance observability"],
"variants": ["default"]
},
"name": "mzizi-alert-engine",
"registryDependencies": [],
"title": "mzizi Alert Engine",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["observability", "assurance"],
"dependencies": [],
"description": "API endpoint health checker. Pings all Mzizi registry API endpoints (from component_backlinks) and reports status codes, latency, and error rates. Feeds into nyuchi-platform-health. Uses the backlinks system built in v4.8.0.",
"docs": "Use it for: Platform monitoring, L8 assurance observability.\nVariants: default.\nIncludes: Z-axis depth observability, Cross-layer blast radius analysis via data-portal backlinks, L9 Fundi integration for auto-healing.\nAccessibility: Non-visual infrastructure — no direct a11y requirements.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-api-probe",
"files": [
{
"path": "components/registry/n8-assurance/mzizi-api-probe.ts",
"target": "lib/mzizi-api-probe.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Non-visual infrastructure — no direct a11y requirements"],
"collection": "observability",
"features": [
"Z-axis depth observability",
"Cross-layer blast radius analysis via data-portal backlinks",
"L9 Fundi integration for auto-healing"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Platform monitoring", "L8 assurance observability"],
"variants": ["default"]
},
"name": "mzizi-api-probe",
"registryDependencies": [],
"title": "mzizi API Probe",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"baseColor": "neutral",
"categories": ["styling-libs"],
"dependencies": [
"class-variance-authority",
"clsx",
"tailwind-merge",
"lucide-react",
"tw-animate-css",
"radix-ui"
],
"description": "The whole Mzizi design system as one installable foundation. `shadcn init` writes the project configuration — new-york style, lucide icons, neutral base, the @/ aliases every component imports through — installs the runtime packages the registry depends on, and pulls N1's 324 design tokens via nyuchi-tokens. Start a project with this and every one of the other 573 components installs into a project already shaped to receive it.",
"docs": "Use it for: Starting a new Nyuchi or Bundu app from zero, Scaffolding by the mzizi CLI (fundi), Giving an agent one command that shapes a project for the registry.\nIncludes: Writes components.json — style, aliases, icon library, base colour, Installs the runtime packages every registry component needs, Pulls all 324 N1 design tokens through nyuchi-tokens, One `shadcn init` instead of manual setup plus N adds.\nAccessibility: Inherits N1's AAA contrast pairings and touch-target tokens.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-base",
"iconLibrary": "lucide",
"meta": {
"a11y": ["Inherits N1's AAA contrast pairings and touch-target tokens"],
"collection": "styling-libs",
"features": [
"Writes components.json — style, aliases, icon library, base colour",
"Installs the runtime packages every registry component needs",
"Pulls all 324 N1 design tokens through nyuchi-tokens",
"One `shadcn init` instead of manual setup plus N adds"
],
"node": 1,
"nodeLabel": "tokens",
"owner": "bundu",
"useCases": [
"Starting a new Nyuchi or Bundu app from zero",
"Scaffolding by the mzizi CLI (fundi)",
"Giving an agent one command that shapes a project for the registry"
]
},
"name": "mzizi-base",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/nyuchi-tokens",
"https://api.mzizi.dev/v1/ui/utils"
],
"style": "new-york",
"tailwind": {
"baseColor": "neutral"
},
"title": "mzizi Base",
"type": "registry:base"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["safety"],
"dependencies": [],
"description": "Blockchain network verification gate. Checks which chain the user is connected to before rendering chain-dependent features. Supports Nyuchi Network (Cosmos SDK), Polygon, and Ethereum. Shows branded switch-network CTA with chain logos.",
"docs": "Use it for: Access control, Security gate, Verification check.\nVariants: allowed, blocked, loading.\nIncludes: Y-axis safety spine, Renders children when check passes, Branded explanation when blocked, Web3 integration.\nAccessibility: Screen reader announces gate state, Focus management on state change.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-chain-gate",
"files": [
{
"path": "components/registry/n4-safety/mzizi-chain-gate.tsx",
"target": "components/ui/mzizi-chain-gate.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Screen reader announces gate state",
"Focus management on state change"
],
"collection": "safety",
"features": [
"Y-axis safety spine",
"Renders children when check passes",
"Branded explanation when blocked",
"Web3 integration"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Access control", "Security gate", "Verification check"],
"variants": ["allowed", "blocked", "loading"]
},
"name": "mzizi-chain-gate",
"registryDependencies": [],
"title": "mzizi Chain Gate",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["resilience"],
"dependencies": [],
"description": "Blockchain RPC failure handler. Handles chain disconnections, RPC timeouts, reorganizations, and wallet disconnections without crashing the UI. Auto-retries with exponential backoff. Shows branded chain status with recovery actions.",
"docs": "Use it for: Error handling, Graceful degradation, Offline support.\nVariants: default, degraded, error.\nIncludes: Y-axis resilience spine, Netflix resilience patterns.\nAccessibility: Error states announced to screen readers, Retry actions keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-chain-resilience",
"files": [
{
"path": "components/registry/n5-resilience/mzizi-chain-resilience.tsx",
"target": "components/ui/mzizi-chain-resilience.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Error states announced to screen readers",
"Retry actions keyboard accessible"
],
"collection": "resilience",
"features": ["Y-axis resilience spine", "Netflix resilience patterns"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Error handling",
"Graceful degradation",
"Offline support"
],
"variants": ["default", "degraded", "error"]
},
"name": "mzizi-chain-resilience",
"registryDependencies": [],
"title": "mzizi Chain Resilience",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["observability", "assurance"],
"dependencies": [],
"description": "Reactive chaos diagnostics — N8 Assurance (Z-axis/depth). Runs through the entire 3D architecture, able to inject failures at any component on any horizontal layer, through any vertical spine. Two modes: (1) Injection — random error/latency at configurable probability per layer intersection. (2) Reactive — when a real error is caught anywhere in the 3D space, probe adjacent systems for blast radius. The depth dimension that proves X and Y axes work.",
"docs": "Use it for: Test resilience of any component, Inject random errors at configurable rate, Probe blast radius of failures, Verify error boundaries work.\nVariants: injection, reactive.\nIncludes: Two modes: injection and reactive, Configurable error probability per layer, Blast radius analysis via data-portal, L9 Fundi integration comments.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-chaos",
"files": [
{
"path": "components/registry/n8-assurance/mzizi-chaos.tsx",
"target": "lib/mzizi-chaos.tsx",
"type": "registry:lib"
}
],
"meta": {
"collection": "observability",
"features": [
"Two modes: injection and reactive",
"Configurable error probability per layer",
"Blast radius analysis via data-portal",
"L9 Fundi integration comments"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Test resilience of any component",
"Inject random errors at configurable rate",
"Probe blast radius of failures",
"Verify error boundaries work"
],
"variants": ["injection", "reactive"]
},
"name": "mzizi-chaos",
"registryDependencies": [],
"title": "mzizi Chaos",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["observability", "assurance"],
"dependencies": [],
"description": "Conformity monkey — verifies deployed components match the design registry. Scans the DOM for data-slot/data-portal attributes and cross-references with the component database. Flags: unregistered components, outdated versions, missing backlinks, components using deprecated patterns. Inspired by Netflix Conformity Monkey.",
"docs": "Use it for: Platform monitoring, L8 assurance observability.\nVariants: default.\nIncludes: Z-axis depth observability, Cross-layer blast radius analysis via data-portal backlinks, L9 Fundi integration for auto-healing.\nAccessibility: Non-visual infrastructure — no direct a11y requirements.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-conformity-check",
"files": [
{
"path": "components/registry/n8-assurance/mzizi-conformity-check.ts",
"target": "lib/mzizi-conformity-check.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Non-visual infrastructure — no direct a11y requirements"],
"collection": "observability",
"features": [
"Z-axis depth observability",
"Cross-layer blast radius analysis via data-portal backlinks",
"L9 Fundi integration for auto-healing"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Platform monitoring", "L8 assurance observability"],
"variants": ["default"]
},
"name": "mzizi-conformity-check",
"registryDependencies": [],
"title": "mzizi Conformity Check",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["safety"],
"dependencies": [],
"description": "Content access gate with age verification, location restrictions, and content sensitivity filters. Renders children when all checks pass. Shows a branded explanation with the specific restriction reason when blocked. Supports multiple gate types that can be composed.",
"docs": "Use it for: Access control, Security gate, Verification check.\nVariants: allowed, blocked, loading.\nIncludes: Y-axis safety spine, Renders children when check passes, Branded explanation when blocked, Web2 safety gate.\nAccessibility: Screen reader announces gate state, Focus management on state change.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-content-gate",
"files": [
{
"path": "components/registry/n4-safety/mzizi-content-gate.tsx",
"target": "components/ui/mzizi-content-gate.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Screen reader announces gate state",
"Focus management on state change"
],
"collection": "safety",
"features": [
"Y-axis safety spine",
"Renders children when check passes",
"Branded explanation when blocked",
"Web2 safety gate"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Access control", "Security gate", "Verification check"],
"variants": ["allowed", "blocked", "loading"]
},
"name": "mzizi-content-gate",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/nyuchi-harness",
"https://api.mzizi.dev/v1/ui/utils"
],
"title": "mzizi Content Gate",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["resilience"],
"dependencies": [],
"description": "Post-quantum cryptography fallback handler. When PQC verification fails (library not loaded, algorithm not supported on device), falls back to classical verification with a \"reduced security\" visual indicator. Based on the QuantZen overlay pattern — adds quantum-safe layer without breaking existing UX.",
"docs": "Use it for: Error handling, Graceful degradation, Offline support.\nVariants: default, degraded, error.\nIncludes: Y-axis resilience spine, Netflix resilience patterns.\nAccessibility: Error states announced to screen readers, Retry actions keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-crypto-fallback",
"files": [
{
"path": "components/registry/n5-resilience/mzizi-crypto-fallback.tsx",
"target": "components/ui/mzizi-crypto-fallback.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Error states announced to screen readers",
"Retry actions keyboard accessible"
],
"collection": "resilience",
"features": ["Y-axis resilience spine", "Netflix resilience patterns"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Error handling",
"Graceful degradation",
"Offline support"
],
"variants": ["default", "degraded", "error"]
},
"name": "mzizi-crypto-fallback",
"registryDependencies": [],
"title": "mzizi Crypto Fallback",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["safety"],
"dependencies": [],
"description": "Quantum-safe cryptographic verification gate. Validates signature strength — in quantum-ready mode requires PQC dual-signature (CRYSTALS-Dilithium + classical ECDSA). Degrades gracefully showing \"reduced security\" indicator when only classical signatures are available. Based on the QuantZen dual-signature pattern.",
"docs": "Use it for: Access control, Security gate, Verification check.\nVariants: allowed, blocked, loading.\nIncludes: Y-axis safety spine, Renders children when check passes, Branded explanation when blocked, Post-quantum cryptography.\nAccessibility: Screen reader announces gate state, Focus management on state change.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-crypto-gate",
"files": [
{
"path": "components/registry/n4-safety/mzizi-crypto-gate.tsx",
"target": "components/ui/mzizi-crypto-gate.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Screen reader announces gate state",
"Focus management on state change"
],
"collection": "safety",
"features": [
"Y-axis safety spine",
"Renders children when check passes",
"Branded explanation when blocked",
"Post-quantum cryptography"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Access control", "Security gate", "Verification check"],
"variants": ["allowed", "blocked", "loading"]
},
"name": "mzizi-crypto-gate",
"registryDependencies": [],
"title": "mzizi Crypto Gate",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["resilience"],
"dependencies": [],
"description": "Configurable degradation fallback chain: personalized → cached → trending → default → static. Each level renders when the previous fails. Based on Netflix graceful degradation — the \"bookmark service\" pattern applied across all mini-apps.",
"docs": "Use it for: Error handling, Graceful degradation, Offline support.\nVariants: default, degraded, error.\nIncludes: Y-axis resilience spine, Netflix resilience patterns.\nAccessibility: Error states announced to screen readers, Retry actions keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-degradation-chain",
"files": [
{
"path": "components/registry/n5-resilience/mzizi-degradation-chain.tsx",
"target": "components/ui/mzizi-degradation-chain.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Error states announced to screen readers",
"Retry actions keyboard accessible"
],
"collection": "resilience",
"features": ["Y-axis resilience spine", "Netflix resilience patterns"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Error handling",
"Graceful degradation",
"Offline support"
],
"variants": ["default", "degraded", "error"]
},
"name": "mzizi-degradation-chain",
"registryDependencies": [],
"title": "mzizi Degradation Chain",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["safety"],
"dependencies": [],
"description": "Decentralized Identifier (DID) credential gate. Verifies W3C Verifiable Credentials from the Nyuchi Honeycomb pod. Works offline by checking the local credential store first, then validates against the server when connectivity returns. Shows \"locally verified\" vs \"server confirmed\" status.",
"docs": "Use it for: Access control, Security gate, Verification check.\nVariants: allowed, blocked, loading.\nIncludes: Y-axis safety spine, Renders children when check passes, Branded explanation when blocked, Web2 safety gate.\nAccessibility: Screen reader announces gate state, Focus management on state change.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-did-gate",
"files": [
{
"path": "components/registry/n4-safety/mzizi-did-gate.tsx",
"target": "components/ui/mzizi-did-gate.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Screen reader announces gate state",
"Focus management on state change"
],
"collection": "safety",
"features": [
"Y-axis safety spine",
"Renders children when check passes",
"Branded explanation when blocked",
"Web2 safety gate"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Access control", "Security gate", "Verification check"],
"variants": ["allowed", "blocked", "loading"]
},
"name": "mzizi-did-gate",
"registryDependencies": [],
"title": "mzizi Did Gate",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["resilience"],
"dependencies": [],
"description": "Brand error and resilience states for the Nyuchi ecosystem. Exports ErrorCard (inline error within feeds), NotFound (brand 404 page), OfflineBanner (local-first connection status indicator), SectionFallback (section-level error with retry). NOTE: PermissionGate is also currently exported here but architecturally belongs at Layer 4 (Safety & Trust) and should be extracted into a separate component in a future refactor. Each state uses mineral accents, brand typography, and matches the Nyuchi identity system.",
"docs": "Use it for: Error handling, Graceful degradation, Offline support.\nVariants: default, degraded, error.\nIncludes: Y-axis resilience spine, Netflix resilience patterns.\nAccessibility: Error states announced to screen readers, Retry actions keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-error-set",
"files": [
{
"path": "components/registry/n5-resilience/mzizi-error-set.tsx",
"target": "components/ui/mzizi-error-set.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Error states announced to screen readers",
"Retry actions keyboard accessible"
],
"collection": "resilience",
"features": ["Y-axis resilience spine", "Netflix resilience patterns"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Error handling",
"Graceful degradation",
"Offline support"
],
"variants": ["default", "degraded", "error"]
},
"name": "mzizi-error-set",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/badge",
"https://api.mzizi.dev/v1/ui/nyuchi-verified-badge",
"https://api.mzizi.dev/v1/ui/nyuchi-harness"
],
"title": "mzizi Error Set",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["observability", "assurance"],
"dependencies": [],
"description": "Structured error collection, deduplication, and blast radius analysis. Catches errors from L5 error boundaries, enriches them with component backlinks (data-portal), calculates which mini-apps and layers are affected. Competitors: Sentry, Datadog Error Tracking.",
"docs": "Use it for: Catch and deduplicate errors, Enrich with component backlinks, Calculate blast radius, Report to Fundi for healing.\nIncludes: Structured error collection, Deduplication, Blast radius via data-portal attributes, L9 Fundi reporter integration, Severity classification.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-error-tracker",
"files": [
{
"path": "components/registry/n8-assurance/mzizi-error-tracker.ts",
"target": "lib/mzizi-error-tracker.ts",
"type": "registry:lib"
}
],
"meta": {
"collection": "observability",
"features": [
"Structured error collection",
"Deduplication",
"Blast radius via data-portal attributes",
"L9 Fundi reporter integration",
"Severity classification"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Catch and deduplicate errors",
"Enrich with component backlinks",
"Calculate blast radius",
"Report to Fundi for healing"
]
},
"name": "mzizi-error-tracker",
"registryDependencies": [],
"title": "mzizi Error Tracker",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["safety"],
"dependencies": [],
"description": "Feature flag gate. Instantly show/hide features based on remote config without deployment. Supports kill switch for instant feature disable. Based on Netflix feature flag pattern + OpenFeature standard. Checks local flag cache first (device-first), then remote config.",
"docs": "Use it for: Access control, Security gate, Verification check.\nVariants: allowed, blocked, loading.\nIncludes: Y-axis safety spine, Renders children when check passes, Branded explanation when blocked, Web2 safety gate.\nAccessibility: Screen reader announces gate state, Focus management on state change.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-feature-gate",
"files": [
{
"path": "components/registry/n4-safety/mzizi-feature-gate.tsx",
"target": "components/ui/mzizi-feature-gate.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Screen reader announces gate state",
"Focus management on state change"
],
"collection": "safety",
"features": [
"Y-axis safety spine",
"Renders children when check passes",
"Branded explanation when blocked",
"Web2 safety gate"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Access control", "Security gate", "Verification check"],
"variants": ["allowed", "blocked", "loading"]
},
"name": "mzizi-feature-gate",
"registryDependencies": [],
"title": "mzizi Feature Gate",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["safety"],
"dependencies": [],
"description": "Data sovereignty and jurisdiction gate. Ensures content and features comply with the user's local data protection laws (GDPR, POPIA, Zimbabwe DPRA). Blocks region-restricted content with branded explanation and jurisdiction info.",
"docs": "Use it for: Access control, Security gate, Verification check.\nVariants: allowed, blocked, loading.\nIncludes: Y-axis safety spine, Renders children when check passes, Branded explanation when blocked, Web2 safety gate.\nAccessibility: Screen reader announces gate state, Focus management on state change.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-geo-gate",
"files": [
{
"path": "components/registry/n4-safety/mzizi-geo-gate.tsx",
"target": "components/ui/mzizi-geo-gate.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Screen reader announces gate state",
"Focus management on state change"
],
"collection": "safety",
"features": [
"Y-axis safety spine",
"Renders children when check passes",
"Branded explanation when blocked",
"Web2 safety gate"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Access control", "Security gate", "Verification check"],
"variants": ["allowed", "blocked", "loading"]
},
"name": "mzizi-geo-gate",
"registryDependencies": [],
"title": "mzizi Geo Gate",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["observability", "assurance"],
"dependencies": [],
"description": "Incident lifecycle management: detect → triage → mitigate → resolve → postmortem. Tracks incidents with severity, affected components (via backlinks), timeline of actions, and generates postmortem templates. Competitors: PagerDuty, incident.io.",
"docs": "Use it for: Platform monitoring, L8 assurance observability.\nVariants: default.\nIncludes: Z-axis depth observability, Cross-layer blast radius analysis via data-portal backlinks, L9 Fundi integration for auto-healing.\nAccessibility: Non-visual infrastructure — no direct a11y requirements.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-incident-manager",
"files": [
{
"path": "components/registry/n8-assurance/mzizi-incident-manager.ts",
"target": "lib/mzizi-incident-manager.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Non-visual infrastructure — no direct a11y requirements"],
"collection": "observability",
"features": [
"Z-axis depth observability",
"Cross-layer blast radius analysis via data-portal backlinks",
"L9 Fundi integration for auto-healing"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Platform monitoring", "L8 assurance observability"],
"variants": ["default"]
},
"name": "mzizi-incident-manager",
"registryDependencies": [],
"title": "mzizi Incident Manager",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["resilience"],
"dependencies": [],
"description": "Prioritized load shedding. Under pressure, critical requests (auth, payment) survive while non-critical (analytics, recommendations, media enrichment) are shed first. Shows degraded mode indicator. Based on Netflix prioritized load shedding.",
"docs": "Use it for: Error handling, Graceful degradation, Offline support.\nVariants: default, degraded, error.\nIncludes: Y-axis resilience spine, Netflix resilience patterns.\nAccessibility: Error states announced to screen readers, Retry actions keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-load-shedder",
"files": [
{
"path": "components/registry/n5-resilience/mzizi-load-shedder.tsx",
"target": "components/ui/mzizi-load-shedder.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Error states announced to screen readers",
"Retry actions keyboard accessible"
],
"collection": "resilience",
"features": ["Y-axis resilience spine", "Netflix resilience patterns"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Error handling",
"Graceful degradation",
"Offline support"
],
"variants": ["default", "degraded", "error"]
},
"name": "mzizi-load-shedder",
"registryDependencies": [],
"title": "mzizi Load Shedder",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["safety"],
"dependencies": [],
"description": "Content moderation status gate. Blocks rendering until content passes the Shamwari AI safety pipeline. Shows branded \"under review\" state with estimated wait time. Supports on-device moderation check (CoreML/NNAPI) before cloud verification. Based on TikTok two-stage AI moderation.",
"docs": "Use it for: Access control, Security gate, Verification check.\nVariants: allowed, blocked, loading.\nIncludes: Y-axis safety spine, Renders children when check passes, Branded explanation when blocked, Web2 safety gate.\nAccessibility: Screen reader announces gate state, Focus management on state change.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-moderation-gate",
"files": [
{
"path": "components/registry/n4-safety/mzizi-moderation-gate.tsx",
"target": "components/ui/mzizi-moderation-gate.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Screen reader announces gate state",
"Focus management on state change"
],
"collection": "safety",
"features": [
"Y-axis safety spine",
"Renders children when check passes",
"Branded explanation when blocked",
"Web2 safety gate"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Access control", "Security gate", "Verification check"],
"variants": ["allowed", "blocked", "loading"]
},
"name": "mzizi-moderation-gate",
"registryDependencies": [],
"title": "mzizi Moderation Gate",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["safety"],
"dependencies": [],
"description": "Offline feature availability gate. Determines if a feature works offline, with cached data, or requires a connection. Shows branded \"available offline\" or \"requires connection\" state. Critical for local-first architecture — treats connectivity as a gradient, not a binary. Based on WhatsApp offline queuing but for all feature types.",
"docs": "Use it for: Access control, Security gate, Verification check.\nVariants: allowed, blocked, loading.\nIncludes: Y-axis safety spine, Renders children when check passes, Branded explanation when blocked, Local-first offline support.\nAccessibility: Screen reader announces gate state, Focus management on state change.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-offline-gate",
"files": [
{
"path": "components/registry/n4-safety/mzizi-offline-gate.tsx",
"target": "components/ui/mzizi-offline-gate.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Screen reader announces gate state",
"Focus management on state change"
],
"collection": "safety",
"features": [
"Y-axis safety spine",
"Renders children when check passes",
"Branded explanation when blocked",
"Local-first offline support"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Access control", "Security gate", "Verification check"],
"variants": ["allowed", "blocked", "loading"]
},
"name": "mzizi-offline-gate",
"registryDependencies": [],
"title": "mzizi Offline Gate",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["observability", "assurance"],
"dependencies": [],
"description": "OTLP exporter for N8 assurance signals. Turns probe results, tracked errors and fired alerts into OpenTelemetry spans and POSTs them to any OTLP/HTTP collector, so a Mzizi signal can be consumed by any agent or service that speaks OpenTelemetry. Zero dependencies and no Node built-ins - runs unchanged in Node, a Cloudflare Worker, Deno or a browser.",
"docs": "Use it for: Ship synthetic probe results to a collector, Give mzizi-rum / mzizi-error-tracker / mzizi-alert-engine a sink for their callbacks, Let other agents subscribe to Mzizi assurance events over a standard protocol, Emit assurance telemetry from a Cloudflare Worker, where the OTel JS SDK does not run.\nIncludes: OTLP/HTTP JSON traces - no @opentelemetry/* dependency, Maps the N8 ProbeResult contract to a run span plus one child span per step, Honours OTEL_EXPORTER_OTLP_ENDPOINT and OTEL_EXPORTER_OTLP_TRACES_ENDPOINT, Never throws and never changes the caller's verdict, Inert with no endpoint configured - no default collector is invented.\nAccessibility: Non-visual infrastructure - no direct a11y requirements.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-otel",
"files": [
{
"path": "components/registry/n8-assurance/mzizi-otel.ts",
"target": "lib/mzizi-otel.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Non-visual infrastructure - no direct a11y requirements"],
"collection": "observability",
"features": [
"OTLP/HTTP JSON traces - no @opentelemetry/* dependency",
"Maps the N8 ProbeResult contract to a run span plus one child span per step",
"Honours OTEL_EXPORTER_OTLP_ENDPOINT and OTEL_EXPORTER_OTLP_TRACES_ENDPOINT",
"Never throws and never changes the caller's verdict",
"Inert with no endpoint configured - no default collector is invented"
],
"hasDemo": false,
"owner": "mzizi",
"useCases": [
"Ship synthetic probe results to a collector",
"Give mzizi-rum / mzizi-error-tracker / mzizi-alert-engine a sink for their callbacks",
"Let other agents subscribe to Mzizi assurance events over a standard protocol",
"Emit assurance telemetry from a Cloudflare Worker, where the OTel JS SDK does not run"
]
},
"name": "mzizi-otel",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/mzizi-synthetic-probe"
],
"title": "mzizi Otel",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["observability", "assurance"],
"dependencies": [],
"description": "Web Vitals and performance monitoring. Tracks LCP, FID, CLS, INP, TTFB per page and per component (using data-portal backlinks). Reports to analytics. Competitors: Lighthouse, Web Vitals library, Vercel Analytics.",
"docs": "Use it for: Platform monitoring, L8 assurance observability.\nVariants: default.\nIncludes: Z-axis depth observability, Cross-layer blast radius analysis via data-portal backlinks, L9 Fundi integration for auto-healing.\nAccessibility: Non-visual infrastructure — no direct a11y requirements.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-perf-probe",
"files": [
{
"path": "components/registry/n8-assurance/mzizi-perf-probe.ts",
"target": "lib/mzizi-perf-probe.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Non-visual infrastructure — no direct a11y requirements"],
"collection": "observability",
"features": [
"Z-axis depth observability",
"Cross-layer blast radius analysis via data-portal backlinks",
"L9 Fundi integration for auto-healing"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Platform monitoring", "L8 assurance observability"],
"variants": ["default"]
},
"name": "mzizi-perf-probe",
"registryDependencies": [],
"title": "mzizi Perf Probe",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["safety"],
"dependencies": [],
"description": "Verification tier gate. Checks the user's verification tier against the required tier before rendering children. Shows a branded mineral-colored upgrade CTA if insufficient. Maps to system.verification_tier (5 tiers: unverified, community, OTP, government, licensed). Renders children when check passes, branded explanation when it doesn't.",
"docs": "Use it for: Gate features behind verification tier, Block posting for unverified users, Require government ID for selling, Restrict moderation to trusted users.\nIncludes: Renders children when check passes, Branded upgrade CTA when blocked, 5 verification tiers, Maps to system.verification_tier.\nAccessibility: aria-live announces gate state, Focus moves to CTA when blocked, Screen reader explains what is required.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-permission-gate",
"files": [
{
"path": "components/registry/n4-safety/mzizi-permission-gate.tsx",
"target": "components/ui/mzizi-permission-gate.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"aria-live announces gate state",
"Focus moves to CTA when blocked",
"Screen reader explains what is required"
],
"collection": "safety",
"features": [
"Renders children when check passes",
"Branded upgrade CTA when blocked",
"5 verification tiers",
"Maps to system.verification_tier"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Gate features behind verification tier",
"Block posting for unverified users",
"Require government ID for selling",
"Restrict moderation to trusted users"
]
},
"name": "mzizi-permission-gate",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/nyuchi-harness",
"https://api.mzizi.dev/v1/ui/utils"
],
"title": "mzizi Permission Gate",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["observability", "assurance"],
"dependencies": [],
"description": "Transparent platform health dashboard — N8 Assurance (Z-axis/depth). Observes the full 3D architecture: every horizontal layer (L2-L7), every vertical spine (L1 tokens, L4 safety, L5 resilience), and reports which intersections are operational, degraded, or in outage. The depth view into the system.",
"docs": "Use it for: Platform monitoring, L8 assurance observability.\nVariants: default.\nIncludes: Z-axis depth observability, Cross-layer blast radius analysis via data-portal backlinks, L9 Fundi integration for auto-healing.\nAccessibility: Non-visual infrastructure — no direct a11y requirements.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-platform-health",
"files": [
{
"path": "components/registry/n8-assurance/mzizi-platform-health.tsx",
"target": "components/ui/mzizi-platform-health.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Non-visual infrastructure — no direct a11y requirements"],
"collection": "observability",
"features": [
"Z-axis depth observability",
"Cross-layer blast radius analysis via data-portal backlinks",
"L9 Fundi integration for auto-healing"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Platform monitoring", "L8 assurance observability"],
"variants": ["default"]
},
"name": "mzizi-platform-health",
"registryDependencies": [],
"title": "mzizi Platform Health",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["resilience"],
"dependencies": [],
"description": "Pre-loads the next screen critical data and components while user is on current screen. TikTok seamless swipe pattern for all navigation. Respects Save-Data header and low battery.",
"docs": "Use it for: Error handling, Graceful degradation, Offline support.\nVariants: default, degraded, error.\nIncludes: Y-axis resilience spine, Netflix resilience patterns.\nAccessibility: Error states announced to screen readers, Retry actions keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-prefetch-boundary",
"files": [
{
"path": "components/registry/n5-resilience/mzizi-prefetch-boundary.tsx",
"target": "components/ui/mzizi-prefetch-boundary.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Error states announced to screen readers",
"Retry actions keyboard accessible"
],
"collection": "resilience",
"features": ["Y-axis resilience spine", "Netflix resilience patterns"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Error handling",
"Graceful degradation",
"Offline support"
],
"variants": ["default", "degraded", "error"]
},
"name": "mzizi-prefetch-boundary",
"registryDependencies": [],
"title": "mzizi Prefetch Boundary",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["safety"],
"dependencies": [],
"description": "Client-side rate limiting gate. Shows \"too many attempts\" with cooldown timer BEFORE requests leave the device. Prevents unnecessary server load and gives immediate feedback. Based on WeChat gateway rate limiting pattern.",
"docs": "Use it for: Access control, Security gate, Verification check.\nVariants: allowed, blocked, loading.\nIncludes: Y-axis safety spine, Renders children when check passes, Branded explanation when blocked, Web2 safety gate.\nAccessibility: Screen reader announces gate state, Focus management on state change.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-rate-gate",
"files": [
{
"path": "components/registry/n4-safety/mzizi-rate-gate.tsx",
"target": "components/ui/mzizi-rate-gate.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Screen reader announces gate state",
"Focus management on state change"
],
"collection": "safety",
"features": [
"Y-axis safety spine",
"Renders children when check passes",
"Branded explanation when blocked",
"Web2 safety gate"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Access control", "Security gate", "Verification check"],
"variants": ["allowed", "blocked", "loading"]
},
"name": "mzizi-rate-gate",
"registryDependencies": [],
"title": "mzizi Rate Gate",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["observability", "assurance"],
"dependencies": [],
"description": "Real User Monitoring. Collects page load timing, interaction delays, network quality, and navigation patterns from actual users. Aggregates by mini-app, page, device, and connection type. Privacy-respecting — no PII, only performance metrics. Competitors: Datadog RUM, Vercel Analytics.",
"docs": "Use it for: Platform monitoring, L8 assurance observability.\nVariants: default.\nIncludes: Z-axis depth observability, Cross-layer blast radius analysis via data-portal backlinks, L9 Fundi integration for auto-healing.\nAccessibility: Non-visual infrastructure — no direct a11y requirements.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-rum",
"files": [
{
"path": "components/registry/n8-assurance/mzizi-rum.ts",
"target": "lib/mzizi-rum.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Non-visual infrastructure — no direct a11y requirements"],
"collection": "observability",
"features": [
"Z-axis depth observability",
"Cross-layer blast radius analysis via data-portal backlinks",
"L9 Fundi integration for auto-healing"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Platform monitoring", "L8 assurance observability"],
"variants": ["default"]
},
"name": "mzizi-rum",
"registryDependencies": [],
"title": "mzizi Rum",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["resilience"],
"dependencies": [],
"description": "The workhorse section wrapper for every page. Combines error boundary, loading skeleton, health reporting, and optional lazy mounting into a single component. Every section of every page is wrapped in NyuchiSection. If one section fails, the rest keep working. Reports health status (healthy/degraded/error/loading) to the global health monitor. The architecture doc says: \"Every section of every page is wrapped in resilience.\"",
"docs": "Use it for: Wrap every page section in resilience, Isolate failures to individual sections, Report section health to global monitor, Lazy mount heavy sections.\nVariants: default, lazy, critical.\nIncludes: Error boundary integration, Loading skeleton, Health reporting (healthy/degraded/error/loading), Optional lazy mounting, data-slot attribute, data-portal backlink.\nAccessibility: aria-busy during loading, Error state announced to screen reader, Retry button keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-section",
"files": [
{
"path": "components/registry/n5-resilience/mzizi-section.tsx",
"target": "components/ui/mzizi-section.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"aria-busy during loading",
"Error state announced to screen reader",
"Retry button keyboard accessible"
],
"collection": "resilience",
"features": [
"Error boundary integration",
"Loading skeleton",
"Health reporting (healthy/degraded/error/loading)",
"Optional lazy mounting",
"data-slot attribute",
"data-portal backlink"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Wrap every page section in resilience",
"Isolate failures to individual sections",
"Report section health to global monitor",
"Lazy mount heavy sections"
],
"variants": ["default", "lazy", "critical"]
},
"name": "mzizi-section",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/nyuchi-harness",
"https://api.mzizi.dev/v1/ui/utils",
"https://api.mzizi.dev/v1/ui/error-boundary",
"https://api.mzizi.dev/v1/ui/section-error-boundary"
],
"title": "mzizi Section",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["resilience"],
"dependencies": [],
"description": "DEPRECATED — Loading states are built into each component from Layer 2 up via the loading prop. Every component renders its own shaped skeleton matching its exact proportions. This top-down skeleton set is a legacy pattern. Use instead of . Will be removed in the next major version.",
"docs": "Use it for: Loading states for feeds, Initial page-load placeholders, Data-fetching fallbacks in dashboards, Infinite-scroll loading indicators, Search-results loading state.\nVariants: card-list, feed-item, profile-block, chart-placeholder, row-item.\nIncludes: Respects prefers-reduced-motion (no shimmer when reduced), Matches final component shape to prevent layout shift, Configurable item count for list skeletons, Mineral accent subtle even in loading state, Harness integration for observability.\nAccessibility: aria-busy=true on parent container, aria-live=polite for updates when loading completes, Screen reader silent during shimmer (decorative), Non-interactive — no focus traps.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-skeleton-set",
"files": [
{
"path": "components/registry/n5-resilience/mzizi-skeleton-set.tsx",
"target": "components/ui/mzizi-skeleton-set.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"aria-busy=true on parent container",
"aria-live=polite for updates when loading completes",
"Screen reader silent during shimmer (decorative)",
"Non-interactive — no focus traps"
],
"collection": "resilience",
"features": [
"Respects prefers-reduced-motion (no shimmer when reduced)",
"Matches final component shape to prevent layout shift",
"Configurable item count for list skeletons",
"Mineral accent subtle even in loading state",
"Harness integration for observability"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Loading states for feeds",
"Initial page-load placeholders",
"Data-fetching fallbacks in dashboards",
"Infinite-scroll loading indicators",
"Search-results loading state"
],
"variants": [
"card-list",
"feed-item",
"profile-block",
"chart-placeholder",
"row-item"
]
},
"name": "mzizi-skeleton-set",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/skeleton",
"https://api.mzizi.dev/v1/ui/nyuchi-harness"
],
"title": "mzizi Skeleton Set",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["resilience"],
"dependencies": [],
"description": "CouchDB sync state indicator. Shows sync progress, conflict count, and resolution status. The bridge between local-first data and cloud truth. Displays: synced, syncing (with progress), conflicts pending, sync error, and offline-queued states.",
"docs": "Use it for: Error handling, Graceful degradation, Offline support.\nVariants: default, degraded, error.\nIncludes: Y-axis resilience spine, Netflix resilience patterns.\nAccessibility: Error states announced to screen readers, Retry actions keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-sync-status",
"files": [
{
"path": "components/registry/n5-resilience/mzizi-sync-status.tsx",
"target": "components/ui/mzizi-sync-status.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Error states announced to screen readers",
"Retry actions keyboard accessible"
],
"collection": "resilience",
"features": ["Y-axis resilience spine", "Netflix resilience patterns"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Error handling",
"Graceful degradation",
"Offline support"
],
"variants": ["default", "degraded", "error"]
},
"name": "mzizi-sync-status",
"registryDependencies": [],
"title": "mzizi Sync Status",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["observability", "assurance"],
"dependencies": [],
"description": "Synthetic user journey probes that run on schedule. Defines step-by-step user flows (login → navigate → action → verify) and executes them against live or staging environments. Reports pass/fail with latency per step. Competitors: Datadog Synthetic Monitoring, Checkly.",
"docs": "Use it for: Platform monitoring, L8 assurance observability.\nVariants: default.\nIncludes: Z-axis depth observability, Cross-layer blast radius analysis via data-portal backlinks, L9 Fundi integration for auto-healing.\nAccessibility: Non-visual infrastructure — no direct a11y requirements.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-synthetic-probe",
"files": [
{
"path": "components/registry/n8-assurance/mzizi-synthetic-probe.ts",
"target": "lib/mzizi-synthetic-probe.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": ["Non-visual infrastructure — no direct a11y requirements"],
"collection": "observability",
"features": [
"Z-axis depth observability",
"Cross-layer blast radius analysis via data-portal backlinks",
"L9 Fundi integration for auto-healing"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Platform monitoring", "L8 assurance observability"],
"variants": ["default"]
},
"name": "mzizi-synthetic-probe",
"registryDependencies": [],
"title": "mzizi Synthetic Probe",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["safety"],
"dependencies": [],
"description": "Trust score threshold gate. Blocks features that require a minimum trust score. Shows the user's current score, the required threshold, and actionable steps to improve. Maps to the Ubuntu Layer trust model: Status × Verification Tier → Trust Score. Used for: posting requires > 0.1, selling requires > 0.3, moderating requires > 0.5.",
"docs": "Use it for: Access control, Security gate, Verification check.\nVariants: allowed, blocked, loading.\nIncludes: Y-axis safety spine, Renders children when check passes, Branded explanation when blocked, Web2 safety gate.\nAccessibility: Screen reader announces gate state, Focus management on state change.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-trust-gate",
"files": [
{
"path": "components/registry/n4-safety/mzizi-trust-gate.tsx",
"target": "components/ui/mzizi-trust-gate.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Screen reader announces gate state",
"Focus management on state change"
],
"collection": "safety",
"features": [
"Y-axis safety spine",
"Renders children when check passes",
"Branded explanation when blocked",
"Web2 safety gate"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Access control", "Security gate", "Verification check"],
"variants": ["allowed", "blocked", "loading"]
},
"name": "mzizi-trust-gate",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/nyuchi-harness",
"https://api.mzizi.dev/v1/ui/utils"
],
"title": "mzizi Trust Gate",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["safety"],
"dependencies": [],
"description": "Web3 wallet connection gate. Verifies wallet is connected and optionally checks token balance (MIT soulbound, MXT transferable, NST storage, NHC utility). Shows branded connect CTA with mineral-colored wallet icon when not connected. Supports Cosmos SDK (Nyuchi Network), Polygon, and Ethereum wallets.",
"docs": "Use it for: Access control, Security gate, Verification check.\nVariants: allowed, blocked, loading.\nIncludes: Y-axis safety spine, Renders children when check passes, Branded explanation when blocked, Web3 integration.\nAccessibility: Screen reader announces gate state, Focus management on state change.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/mzizi-wallet-gate",
"files": [
{
"path": "components/registry/n4-safety/mzizi-wallet-gate.tsx",
"target": "components/ui/mzizi-wallet-gate.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Screen reader announces gate state",
"Focus management on state change"
],
"collection": "safety",
"features": [
"Y-axis safety spine",
"Renders children when check passes",
"Branded explanation when blocked",
"Web3 integration"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["Access control", "Security gate", "Verification check"],
"variants": ["allowed", "blocked", "loading"]
},
"name": "mzizi-wallet-gate",
"registryDependencies": [],
"title": "mzizi Wallet Gate",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "A native HTML select element styled to match the design system.",
"docs": "Use it for: Simple dropdown forms (country, language), Mobile-optimized form fields, Accessibility-preferred select in form contexts, Admin panels with native form control, Progressive-enhancement form fallbacks.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/native-select",
"files": [
{
"path": "components/registry/n2-primitives/native-select.tsx",
"target": "components/ui/native-select.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Simple dropdown forms (country, language)",
"Mobile-optimized form fields",
"Accessibility-preferred select in form contexts",
"Admin panels with native form control",
"Progressive-enhancement form fallbacks"
],
"variants": ["default", "sm", "lg"]
},
"name": "native-select",
"registryDependencies": [],
"title": "Native Select",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": ["class-variance-authority", "radix-ui"],
"description": "A collection of links for navigating websites.",
"docs": "Use it for: Primary site navigation with hover flyouts, Dropdown-enabled header menus, Multi-level category navigation, Documentation site top navigation, Marketing site navigation with submenus.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute, Radix UI primitive.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/navigation-menu",
"files": [
{
"path": "components/registry/n2-primitives/navigation-menu.tsx",
"target": "components/ui/navigation-menu.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": [
"cn() for className composition",
"data-slot attribute",
"Radix UI primitive"
],
"hasDemo": true,
"owner": "framework",
"useCases": [
"Primary site navigation with hover flyouts",
"Dropdown-enabled header menus",
"Multi-level category navigation",
"Documentation site top navigation",
"Marketing site navigation with submenus"
],
"variants": ["default", "sm", "lg"]
},
"name": "navigation-menu",
"registryDependencies": [],
"title": "Navigation Menu",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Proximity-sorted results list designed to pair with a map view. Shows distance, direction indicator, and listing preview. Standard split-view pattern for BushTrade browse, Places discovery, Nhimbe nearby events, and Transport nearby stops.",
"docs": "Use it for: nhimbe, places, transport.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/nearby-list",
"files": [
{
"path": "components/registry/n2-primitives/nearby-list.tsx",
"target": "components/ui/nearby-list.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["nhimbe", "places", "transport"],
"variants": ["default", "sm", "lg"]
},
"name": "nearby-list",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/map-view",
"https://api.mzizi.dev/v1/ui/nyuchi-listing-card"
],
"title": "Nearby List",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["components", "primitives"],
"dependencies": [],
"description": "NFT display card showing media (image/video), title, collection, owner, and marketplace actions. Used for Nhimbe ERC-1155 tickets, Novels chapter NFTs, Ubuntu badge NFTs, and creator content NFTs. Maps to wallet.nft_holdings.",
"docs": "Use it for: novels, nhimbe, wallet.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/nft-card",
"files": [
{
"path": "components/registry/n2-primitives/nft-card.tsx",
"target": "components/ui/nft-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "components",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "framework",
"useCases": ["novels", "nhimbe", "wallet"],
"variants": ["default", "sm", "lg"]
},
"name": "nft-card",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/badge",
"https://api.mzizi.dev/v1/ui/button"
],
"title": "Nft Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Honeycomb node health and earnings display. Shows node type (consumer/business/infrastructure), uptime, storage contributed, NHC earned, and peer count. Used in the Honeycomb network dashboard.",
"docs": "Use it for: wallet.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/node-status-card",
"files": [
{
"path": "components/registry/n2-primitives/node-status-card.tsx",
"target": "components/ui/node-status-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["wallet"],
"variants": ["default", "sm", "lg"]
},
"name": "node-status-card",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/badge",
"https://api.mzizi.dev/v1/ui/status-indicator",
"https://api.mzizi.dev/v1/ui/progress"
],
"title": "Node Status Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Compact note display with title, excerpt, and timestamp.",
"docs": "Use it for: Notes app card list, Quick notes in dashboard widgets, Meeting notes summary display, Bookmark preview cards, Article snippet previews in feeds.\nVariants: default.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/note-card",
"files": [
{
"path": "components/registry/n2-primitives/note-card.tsx",
"target": "components/ui/note-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Notes app card list",
"Quick notes in dashboard widgets",
"Meeting notes summary display",
"Bookmark preview cards",
"Article snippet previews in feeds"
],
"variants": ["default"]
},
"name": "note-card",
"registryDependencies": [],
"title": "Note Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Rich note editing interface with title, body (markdown or rich text), tags, and auto-save indicator. Supports inline images, checklists, and code blocks. The creation/editing counterpart to note-card (display). Reusable in any app that needs structured note capture.",
"docs": "Use it for: campfire, novels, planner.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/note-editor",
"files": [
{
"path": "components/registry/n2-primitives/note-editor.tsx",
"target": "components/ui/note-editor.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["campfire", "novels", "planner"],
"variants": ["default", "sm", "lg"]
},
"name": "note-editor",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/rich-text-editor",
"https://api.mzizi.dev/v1/ui/tag-input",
"https://api.mzizi.dev/v1/ui/input"
],
"title": "Note Editor",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "A notification bell icon with unread count badge and a popover panel listing notifications.",
"docs": "Use it for: App header notification icon with counter, Mobile header notification access, Unread count display with popover, Primary notification entry point, Quick-glance notification summary.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/notification-bell",
"files": [
{
"path": "components/registry/n2-primitives/notification-bell.tsx",
"target": "components/ui/notification-bell.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"App header notification icon with counter",
"Mobile header notification access",
"Unread count display with popover",
"Primary notification entry point",
"Quick-glance notification summary"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "notification-bell",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/popover",
"https://api.mzizi.dev/v1/ui/scroll-area",
"https://api.mzizi.dev/v1/ui/separator"
],
"title": "Notification Bell",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Notification center with tabs for all, unread, and mentions with grouped items.",
"docs": "Use it for: Full notification center page or drawer, Inbox-style notification management, Mentions and replies separation, Notification preferences and filters, Archived notification browsing.\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: Semantic HTML.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/notification-center",
"files": [
{
"path": "components/registry/n2-primitives/notification-center.tsx",
"target": "components/blocks/notification-center.tsx",
"type": "registry:block"
}
],
"meta": {
"a11y": ["Semantic HTML"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Full notification center page or drawer",
"Inbox-style notification management",
"Mentions and replies separation",
"Notification preferences and filters",
"Archived notification browsing"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "notification-center",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/badge",
"https://api.mzizi.dev/v1/ui/button",
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/scroll-area",
"https://api.mzizi.dev/v1/ui/separator",
"https://api.mzizi.dev/v1/ui/tabs"
],
"title": "Notification Center",
"type": "registry:block"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Full-screen or drawer notification management surface. Extends notification-center (existing Layer 2 component) with filter/search, archive, bulk actions, and grouped conversations view. Audit flagged as missing UX pattern for mature notification UX. ALPHA — awaiting frontend implementation.",
"docs": "Use it for: Full-screen notification management, Notification drawer with filters, Grouped conversations view, Archived notification browsing, Bulk mark-as-read and delete actions.\nVariants: drawer, full-page, modal.\nIncludes: Filter by all/unread/mentions/mine, Search within notifications, Date-grouped lists (today/yesterday/this week), Bulk selection with actions, Conversation threading.\nAccessibility: role=region with aria-label, Filter tabs with role=tablist, Notification items in role=feed, Keyboard-navigable with j/k shortcuts, Screen reader announces count changes.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/notification-center-full",
"files": [
{
"path": "components/registry/n2-primitives/notification-center-full.tsx",
"target": "components/ui/notification-center-full.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=region with aria-label",
"Filter tabs with role=tablist",
"Notification items in role=feed",
"Keyboard-navigable with j/k shortcuts",
"Screen reader announces count changes"
],
"collection": "primitives",
"features": [
"Filter by all/unread/mentions/mine",
"Search within notifications",
"Date-grouped lists (today/yesterday/this week)",
"Bulk selection with actions",
"Conversation threading"
],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Full-screen notification management",
"Notification drawer with filters",
"Grouped conversations view",
"Archived notification browsing",
"Bulk mark-as-read and delete actions"
],
"variants": ["drawer", "full-page", "modal"]
},
"name": "notification-center-full",
"registryDependencies": [],
"title": "Notification Center Full",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Notification feed with read/unread states, timestamps, and date grouping.",
"docs": "Use it for: Notification drawer content, Grouped notification display (today, yesterday, last week), Mark-as-read and bulk action lists, Activity log in admin interfaces, System event listings.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/notification-list",
"files": [
{
"path": "components/registry/n2-primitives/notification-list.tsx",
"target": "components/ui/notification-list.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Notification drawer content",
"Grouped notification display (today, yesterday, last week)",
"Mark-as-read and bulk action lists",
"Activity log in admin interfaces",
"System event listings"
],
"variants": ["default", "sm", "lg"]
},
"name": "notification-list",
"registryDependencies": [],
"title": "Notification List",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Book/manga cover display with genre badge, rating, chapter count, and status indicator (ongoing/completed/hiatus). Aspect ratio optimized for book covers (2:3). Maps to novels.work table.",
"docs": "Use it for: novels.\nVariants: default, sm, lg.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/novel-cover",
"files": [
{
"path": "components/registry/n2-primitives/novel-cover.tsx",
"target": "components/ui/novel-cover.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": ["novels"],
"variants": ["default", "sm", "lg"]
},
"name": "novel-cover",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/badge",
"https://api.mzizi.dev/v1/ui/rating"
],
"title": "Novel Cover",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["primitives"],
"dependencies": [],
"description": "Numeric input with increment and decrement buttons, min/max/step support.",
"docs": "Use it for: Quantity input in shopping carts, Price and currency amount entry, Age input in profile forms, Pagination size selector, Numeric settings (max retries, timeout).\nVariants: default, outline, ghost, destructive.\nIncludes: cn() for className composition, data-slot attribute.\nAccessibility: ARIA attributes, Keyboard accessible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/number-input",
"files": [
{
"path": "components/registry/n2-primitives/number-input.tsx",
"target": "components/ui/number-input.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": ["ARIA attributes", "Keyboard accessible"],
"collection": "primitives",
"features": ["cn() for className composition", "data-slot attribute"],
"hasDemo": true,
"owner": "mzizi",
"useCases": [
"Quantity input in shopping carts",
"Price and currency amount entry",
"Age input in profile forms",
"Pagination size selector",
"Numeric settings (max retries, timeout)"
],
"variants": ["default", "outline", "ghost", "destructive"]
},
"name": "number-input",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/button"],
"title": "Number Input",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["styling-libs", "tokens"],
"dependencies": [],
"description": "Accessibility infrastructure for the Nyuchi ecosystem. Exports FocusTrap (modal/overlay focus containment), LiveRegion (screen reader announcements for dynamic content), SkipNav (keyboard skip-to-content link), VisuallyHidden (screen-reader-only text), and a11y token definitions (focus ring styles, minimum touch targets, contrast-safe mineral pairings). Also exports useAnnounce hook for imperatively announcing trust score changes, notification arrivals, loading completions, and other dynamic updates to screen readers. Target: Rust compiled to WebAssembly. wasm-bindgen exposes the interface to SvelteKit. One Rust codebase compiles to both WASM (browser) and native binary (server).",
"docs": "Use it for: Design token infrastructure, All layers consume L1.\nVariants: default.\nIncludes: Y-axis vertical spine, CSS custom properties, Multi-platform generators.\nAccessibility: Defines focus ring tokens, Touch target minimums, Contrast-safe pairings.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/nyuchi-a11y",
"files": [
{
"path": "components/registry/n1-tokens/nyuchi-a11y.tsx",
"target": "lib/a11y/index.tsx",
"type": "registry:lib"
}
],
"meta": {
"a11y": [
"Defines focus ring tokens",
"Touch target minimums",
"Contrast-safe pairings"
],
"collection": "styling-libs",
"features": [
"Y-axis vertical spine",
"CSS custom properties",
"Multi-platform generators"
],
"hasDemo": true,
"owner": "bundu",
"useCases": ["Design token infrastructure", "All layers consume L1"],
"variants": ["default"]
},
"name": "nyuchi-a11y",
"registryDependencies": ["https://api.mzizi.dev/v1/ui/nyuchi-tokens"],
"title": "nyuchi a11y",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["brand"],
"dependencies": [],
"description": "Universal branded bottom action sheet for contextual actions on any content across the ecosystem. Share, save, report, copy link, block, follow — the standard set of actions available on listings, posts, profiles, and messages. Renders as a bottom sheet on mobile with mineral accent on destructive/primary actions. Composes sheet and share-dialog primitives.",
"docs": "Use it for: pulse, campfire, bytes, circles, novels.\nVariants: default.\nIncludes: Harness integration (log, motion, LiveRegion), animStyle with prefersReduced motion check, Mineral-colored accent via brand override, data-slot + data-portal DOM attributes.\nAccessibility: Focus-visible ring on interactive elements, 48px minimum touch targets, ARIA role attribute, aria-label for screen readers.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/nyuchi-action-sheet",
"files": [
{
"path": "components/registry/n3-brand/nyuchi-action-sheet.tsx",
"target": "components/ui/nyuchi-action-sheet.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Focus-visible ring on interactive elements",
"48px minimum touch targets",
"ARIA role attribute",
"aria-label for screen readers"
],
"collection": "brand",
"features": [
"Harness integration (log, motion, LiveRegion)",
"animStyle with prefersReduced motion check",
"Mineral-colored accent via brand override",
"data-slot + data-portal DOM attributes"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["pulse", "campfire", "bytes", "circles", "novels"],
"variants": ["default"]
},
"name": "nyuchi-action-sheet",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/sheet",
"https://api.mzizi.dev/v1/ui/nyuchi-harness"
],
"title": "nyuchi Action Sheet",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["documentation-engine", "documentation"],
"dependencies": [],
"description": "AI context provider for N10. Generates context windows for AI assistants (Claude, Cursor, Copilot, Windsurf) with current ecosystem model, node architecture, and coding rules. No hardcoded counts — always accepts live values from get_system_counts(). Used by the MCP server and IDE integrations.",
"docs": "Use it for: Documentation, AI context generation, Changelog display.\nVariants: default.\nIncludes: Layer 10 documentation infrastructure, Reads from documentation_pages + ai_instructions tables.\nAccessibility: Semantic HTML, Keyboard navigation, Screen reader compatible.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/nyuchi-ai-context",
"files": [
{
"path": "components/registry/n10-documentation/nyuchi-ai-context.ts",
"target": "lib/nyuchi-ai-context.ts",
"type": "registry:lib"
}
],
"meta": {
"a11y": [
"Semantic HTML",
"Keyboard navigation",
"Screen reader compatible"
],
"collection": "documentation-engine",
"features": [
"Layer 10 documentation infrastructure",
"Reads from documentation_pages + ai_instructions tables"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": [
"Documentation",
"AI context generation",
"Changelog display"
],
"variants": ["default"]
},
"name": "nyuchi-ai-context",
"registryDependencies": [],
"title": "nyuchi AI Context",
"type": "registry:lib"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["brand"],
"dependencies": [],
"description": "Universal branded alert banner with mineral-coded severity levels. Used across all ecosystem apps for weather alerts, system notifications, security warnings, trust advisories, and any time-sensitive information. Severity maps to minerals: watch=cobalt, moderate=terracotta, severe=gold. Renders as a prominent banner with dismiss, detail action, and safety instructions.",
"docs": "Use it for: wallet, campfire, circles, transport, bushtrade.\nVariants: default.\nIncludes: Harness integration (log, motion, LiveRegion), animStyle with prefersReduced motion check, Mineral-colored accent via brand override, data-slot + data-portal DOM attributes.\nAccessibility: Focus-visible ring on interactive elements, 48px minimum touch targets, ARIA role attribute, aria-label for screen readers.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/nyuchi-alert-banner",
"files": [
{
"path": "components/registry/n3-brand/nyuchi-alert-banner.tsx",
"target": "components/ui/nyuchi-alert-banner.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Focus-visible ring on interactive elements",
"48px minimum touch targets",
"ARIA role attribute",
"aria-label for screen readers"
],
"collection": "brand",
"features": [
"Harness integration (log, motion, LiveRegion)",
"animStyle with prefersReduced motion check",
"Mineral-colored accent via brand override",
"data-slot + data-portal DOM attributes"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["wallet", "campfire", "circles", "transport", "bushtrade"],
"variants": ["default"]
},
"name": "nyuchi-alert-banner",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/alert",
"https://api.mzizi.dev/v1/ui/nyuchi-harness"
],
"title": "nyuchi Alert Banner",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["brand"],
"dependencies": [],
"description": "Branded job application status timeline showing application stages (applied, reviewed, interview, offer, rejected) with timestamps and employer feedback. Gold mineral accent. Used in Jobs dashboard.",
"docs": "Use it for: jobs.\nVariants: default.\nIncludes: Harness integration (log, motion, LiveRegion), animStyle with prefersReduced motion check, Mineral-colored accent via brand override, data-slot + data-portal DOM attributes.\nAccessibility: Focus-visible ring on interactive elements, 48px minimum touch targets, ARIA role attribute, aria-label for screen readers.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/nyuchi-application-tracker",
"files": [
{
"path": "components/registry/n3-brand/nyuchi-application-tracker.tsx",
"target": "components/ui/nyuchi-application-tracker.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Focus-visible ring on interactive elements",
"48px minimum touch targets",
"ARIA role attribute",
"aria-label for screen readers"
],
"collection": "brand",
"features": [
"Harness integration (log, motion, LiveRegion)",
"animStyle with prefersReduced motion check",
"Mineral-colored accent via brand override",
"data-slot + data-portal DOM attributes"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["jobs"],
"variants": ["default"]
},
"name": "nyuchi-application-tracker",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/card",
"https://api.mzizi.dev/v1/ui/nyuchi-harness"
],
"title": "nyuchi Application Tracker",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["brand"],
"dependencies": [],
"description": "News article card extending nyuchi-listing-card with factcheck badge, source attribution, journalist byline, and read time. Maps to news.news_article (67 columns) and news.feed_source. Used in Mukoko News feeds, Pulse aggregation, and content discovery.",
"docs": "Use it for: News article feeds in Mukoko News, Pulse aggregation article listings, Content discovery feeds with journalist attribution, Feature article grids with source credibility, Cross-source news aggregation displays.\nVariants: default, compact, hero.\nIncludes: Harness integration (log, motion, LiveRegion), animStyle with prefersReduced motion check, Mineral-colored accent via brand override, data-slot + data-portal DOM attributes.\nAccessibility: Focus-visible ring on interactive elements, 48px minimum touch targets, ARIA role attribute.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/nyuchi-article-card",
"files": [
{
"path": "components/registry/n3-brand/nyuchi-article-card.tsx",
"target": "components/ui/nyuchi-article-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Focus-visible ring on interactive elements",
"48px minimum touch targets",
"ARIA role attribute"
],
"collection": "brand",
"features": [
"Harness integration (log, motion, LiveRegion)",
"animStyle with prefersReduced motion check",
"Mineral-colored accent via brand override",
"data-slot + data-portal DOM attributes"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": [
"News article feeds in Mukoko News",
"Pulse aggregation article listings",
"Content discovery feeds with journalist attribution",
"Feature article grids with source credibility",
"Cross-source news aggregation displays"
],
"variants": ["default", "compact", "hero"]
},
"name": "nyuchi-article-card",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/nyuchi-listing-card",
"https://api.mzizi.dev/v1/ui/badge",
"https://api.mzizi.dev/v1/ui/nyuchi-verified-badge",
"https://api.mzizi.dev/v1/ui/nyuchi-harness"
],
"title": "nyuchi Article Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["agentic-components", "brand"],
"dependencies": [],
"description": "Inline sign-in and registration rendered inside an AI surface (Claude, Claude Code, any MCP client) — never a browser tab. Drives the MCP inline-auth handoff (OAuth 2.1, Dynamic Client Registration, elicitation) and takes its accent from --brand-accent, so it carries the host brand's mineral.",
"docs": "Use it for: Authenticate a user inside Claude / Claude Code via an MCP, Register a new account inline before subscribing, First step of an inline UCP checkout flow.\nVariants: login, register.\nIncludes: Inline sign-in AND registration — never a browser tab, Mode toggle between login and register, SSO / passwordless provider buttons, Drives the MCP inline-auth handoff (OAuth 2.1 / DCR / elicitation), Dynamic mineral accent via --brand-accent, Pending + error states managed internally.\nAccessibility: Focus-visible ring on all interactive elements, 48px minimum touch targets, aria-modal dialog with aria-label, role=alert for error messaging, autoComplete + inputMode on inputs, prefers-reduced-motion honoured via the harness.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/nyuchi-auth-card",
"files": [
{
"path": "components/registry/n3-brand/nyuchi-auth-card.tsx",
"target": "agentic/nyuchi-auth-card.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"Focus-visible ring on all interactive elements",
"48px minimum touch targets",
"aria-modal dialog with aria-label",
"role=alert for error messaging",
"autoComplete + inputMode on inputs",
"prefers-reduced-motion honoured via the harness"
],
"collection": "agentic-components",
"features": [
"Inline sign-in AND registration — never a browser tab",
"Mode toggle between login and register",
"SSO / passwordless provider buttons",
"Drives the MCP inline-auth handoff (OAuth 2.1 / DCR / elicitation)",
"Dynamic mineral accent via --brand-accent",
"Pending + error states managed internally"
],
"owner": "nyuchi",
"useCases": [
"Authenticate a user inside Claude / Claude Code via an MCP",
"Register a new account inline before subscribing",
"First step of an inline UCP checkout flow"
],
"variants": ["login", "register"]
},
"name": "nyuchi-auth-card",
"registryDependencies": [
"https://api.mzizi.dev/v1/ui/nyuchi-harness",
"https://api.mzizi.dev/v1/ui/utils"
],
"title": "nyuchi Auth Card",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["pages"],
"dependencies": [],
"description": "Default auth screen layout that services all login, signup, and onboarding flows. Provides the branded container: centered card with mineral gradient background, Mukoko logo, language selector, and legal links. Individual auth flows (login-01..05, signup-01..05) render inside this layout as children.",
"docs": "Use it for: pulse, shamwari, campfire, circles, bytes.\nVariants: default, loading.\nIncludes: X-axis page composition, Pure composition — no inline UI, Semantic CSS vars only, Children/slots for content.\nAccessibility: role=main, aria-label, Loading state with skeleton, Focus management.\nInstall: npx shadcn@latest add https://api.mzizi.dev/v1/ui/nyuchi-auth-layout",
"files": [
{
"path": "components/registry/n6-pages/nyuchi-auth-layout.tsx",
"target": "components/ui/nyuchi-auth-layout.tsx",
"type": "registry:ui"
}
],
"meta": {
"a11y": [
"role=main",
"aria-label",
"Loading state with skeleton",
"Focus management"
],
"collection": "pages",
"features": [
"X-axis page composition",
"Pure composition — no inline UI",
"Semantic CSS vars only",
"Children/slots for content"
],
"hasDemo": true,
"owner": "nyuchi",
"useCases": ["pulse", "shamwari", "campfire", "circles", "bytes"],
"variants": ["default", "loading"]
},
"name": "nyuchi-auth-layout",
"registryDependencies": [],
"title": "nyuchi Auth Layout",
"type": "registry:ui"
},
{
"author": "Bundu Foundation, operated by Nyuchi Africa (Pvt) Ltd — https://mzizi.dev",
"categories": ["brand"],
"dependencies": [],
"description": "Overlapping +N social-proof avatar stack — the going/attendee cue. Ring-separated avatars overlap with negative margin, each an image or an initials fallback, showing up to `max` before a +N overflow bubble, with an optional trailing