@africode/core 5.0.0

package/src/index.ts

@@ -0,0 +1,196 @@
+/**
+ * AfriCode v5.0.0 - Autonomous Framework Entry Point
+ * African-centric full-stack framework with AI safety and fintech compliance
+ */
+
+import { createReactiveState, subscribe, createSignal, createEffect } from '../core/state.js';
+import { store, actions } from '../core/store.js';
+import patterns from '../core/patterns.js';
+import * as motion from '../core/motion.js';
+import { hydrate } from '../core/hydration.js';
+import { html, Layout } from '../core/html.js';
+import { schemas, Validation, rules, afri, AfriFieldBuilder, normalizeInput, buildSchema } from '../core/validation.js';
+import { createFramework, getConfig } from '../core/config.js';
+import {
+    AfriCodeError, ValidationError, InvalidUrlError,
+    SecurityError, CsrfError, RateLimitError,
+    DatabaseError, ComponentError
+} from '../core/errors.js';
+
+// v5.0.0 autonomous features
+import { initA2UI, A2UIRenderer, A2UIProtocol } from '../core/a2ui.js';
+import { NIDAClient, TIPSClient, AMLComplianceEngine, ComplianceMiddleware } from '../core/compliance.js';
+import { initBunRuntime, HotReloadEngine, BunHTTPServer, BunDatabase, PerformanceMonitor } from '../core/bun-runtime.js';
+import { EnhancedHMRMiddleware } from '../core/enhanced-hmr.js';
+import { A2uiSchemaManager } from '../core/a2ui-schema-manager.js';
+import { LipaNambaJourney } from '../core/lipa-namba-journey.js';
+
+import { componentMap as coreMap } from '../components/index.js';
+
+/**
+ * AfriCode Framework Class
+ * Autonomous application lifecycle management
+ */
+export class AfriCode {
+    private config: any;
+    private server?: BunHTTPServer;
+    private hmr?: EnhancedHMRMiddleware;
+    private schemaManager?: A2uiSchemaManager;
+
+    constructor(config: {
+        port?: number;
+        pagesDir?: string;
+        publicDir?: string;
+        enableHMR?: boolean;
+        enableA2UI?: boolean;
+        fintechCompliance?: boolean;
+    } = {}) {
+        this.config = {
+            port: 3000,
+            pagesDir: 'pages',
+            publicDir: 'public',
+            enableHMR: true,
+            enableA2UI: true,
+            fintechCompliance: true,
+            ...config
+        };
+    }
+
+    /**
+     * Initialize the autonomous framework
+     */
+    async initialize(): Promise<void> {
+        console.log('🚀 Initializing AfriCode v5.0.0...');
+
+        // Initialize Bun runtime
+        await initBunRuntime();
+
+        // Initialize A2UI schema manager
+        if (this.config.enableA2UI) {
+            this.schemaManager = new A2uiSchemaManager();
+            await this.schemaManager.generateManifest();
+        }
+
+        // Initialize HMR if enabled
+        if (this.config.enableHMR) {
+            this.hmr = new EnhancedHMRMiddleware({
+                port: this.config.port + 1,
+                watchPaths: [this.config.pagesDir, 'components', 'core']
+            });
+        }
+
+        console.log('✅ AfriCode initialized successfully');
+    }
+
+    /**
+     * Start the autonomous server
+     */
+    async start(): Promise<void> {
+        await this.initialize();
+
+        // Create HTTP server with file-based routing
+        this.server = new BunHTTPServer({
+            port: this.config.port,
+            pagesDir: this.config.pagesDir,
+            publicDir: this.config.publicDir,
+            middleware: [
+                this.config.fintechCompliance ? new ComplianceMiddleware() : null,
+                this.hmr
+            ].filter(Boolean)
+        });
+
+        // Start HMR if enabled
+        if (this.hmr) {
+            await this.hmr.initialize(this.server);
+        }
+
+        await this.server.start();
+        console.log(`🌐 Server running on http://localhost:${this.config.port}`);
+    }
+
+    /**
+     * Stop the framework
+     */
+    async stop(): Promise<void> {
+        if (this.server) {
+            await this.server.stop();
+        }
+        if (this.hmr) {
+            await this.hmr.shutdown();
+        }
+        console.log('🛑 AfriCode stopped');
+    }
+}
+
+/**
+ * Utility to initialize the full framework (legacy compatibility)
+ */
+export function init(projectComponentMap: Record<string, any> = {}): void {
+    if (typeof window !== 'undefined') {
+        console.log('🌍 AfriCode SDK Initialized (Zero-Config Mode)');
+
+        // Merge project map with core map
+        const finalMap = { ...coreMap, ...projectComponentMap };
+
+        if (Object.keys(finalMap).length > 0) {
+            hydrate(finalMap);
+        }
+    }
+}
+
+// Core exports
+export {
+    createReactiveState,
+    subscribe,
+    createSignal,
+    createEffect,
+    store,
+    actions,
+    patterns,
+    motion,
+    hydrate,
+    html,
+    Layout,
+    schemas,
+    Validation,
+    rules,
+    afri,
+    AfriFieldBuilder,
+    normalizeInput,
+    buildSchema,
+    createFramework,
+    getConfig,
+    AfriCodeError,
+    ValidationError,
+    InvalidUrlError,
+    SecurityError,
+    CsrfError,
+    RateLimitError,
+    DatabaseError,
+    ComponentError
+};
+
+// v5.0.0 autonomous exports
+export {
+    initA2UI,
+    A2UIRenderer,
+    A2UIProtocol,
+    NIDAClient,
+    TIPSClient,
+    AMLComplianceEngine,
+    ComplianceMiddleware,
+    initBunRuntime,
+    HotReloadEngine,
+    BunHTTPServer,
+    BunDatabase,
+    PerformanceMonitor,
+    EnhancedHMRMiddleware,
+    A2uiSchemaManager,
+    LipaNambaJourney
+};
+
+// Component exports
+export { componentMap as components } from '../components/index.js';
+
+// Re-export for convenience
+export default AfriCode;

package/styles/africanity.css

@@ -0,0 +1,322 @@
+@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300..700&family=Inter:wght@400;500;600;700;800;900&display=swap');
+
+:root {
+   /* =========================================
+     CULTURAL PALETTES (Immutable Design Tokens)
+     ========================================= */
+   /* Accents */
+   --afri-green: #1EB53A; /* Growth (Tanzania) */
+   --afri-gold: #FCD116;  /* Wealth */
+   --afri-blue: #00A3DD;  /* Water */
+   --afri-red: #EF3340;   /* Vitality */
+
+   /* Maasai (Kenya/Tanzania) */
+   --maasai-red: #E31C23;
+   --maasai-blue: #00A3DD;
+
+   /* Kente (Ghana) */
+   --kente-gold: #FFD700;
+   --kente-green: #00966C;
+
+   /* Tuareg (Sahara) */
+   --tuareg-indigo: #2D3D6B;
+   --tuareg-sky: #6B8CC7;
+   --sahara-sand: #F4A460;
+
+   /* Ndebele (South Africa) */
+   --ndebele-pink: #FF69B4;
+   --ndebele-turquoise: #40E0D0;
+
+   /* =========================================
+     FRACTAL SPACING (FIBONACCI)
+     ========================================= */
+   --space-5: 5px;
+   --space-8: 8px;
+   --space-13: 13px;
+   --space-21: 21px;
+   --space-34: 34px;
+   --space-55: 55px;
+   --space-89: 89px;
+
+   /* Motion */
+   --ease-drum: cubic-bezier(0.1, 0.9, 0.2, 1.0);
+   --ease-snap: cubic-bezier(0.34, 1.56, 0.64, 1);
+
+   /* Typography */
+   --font-logo: 'Space Grotesk', sans-serif;
+   --font-body: 'Inter', system-ui, sans-serif;
+
+   /* Layout Standards */
+   --page-max-width: 1280px;
+   --nav-height: 80px;
+   --radius-lg: 12px;
+   --radius-md: 8px;
+   --radius-sm: 6px;
+   --glass-blur: 12px;
+
+   /* Backward-compatible aliases */
+   --brand-gold: var(--afri-gold);
+   --brand-green: var(--afri-green);
+   --slate-800: #1e293b;
+   --slate-900: #0f172a;
+   --slate-950: #020617;
+}
+
+/* =========================================
+  THEME: PROFOUND DARK (Default)
+  ========================================= */
+:root, [data-theme="dark"] {
+   /* Base Backgrounds */
+   --afri-black: #050505;
+   --afri-void: #0f172a;      /* Page Background */
+   --afri-charcoal: #1e293b;  /* Surface 1 */
+   --afri-obsidian: #334155;  /* Surface 2 */
+
+   /* Text System */
+   --text-primary: #f8fafc;
+   --text-secondary: #cbd5e1;
+   --text-muted: #94a3b8;
+
+   /* Structural Variables */
+   --bg-base: var(--afri-void);
+   --glass-bg: rgba(15, 23, 42, 0.7);
+   --glass-border: rgba(255, 255, 255, 0.1);
+   --border-color: var(--glass-border);
+   --text-main: var(--text-primary);
+}
+
+/* =========================================
+  THEME: RADIANT LIGHT
+  ========================================= */
+[data-theme="light"] {
+   /* Base Backgrounds */
+   --afri-black: #ffffff;
+   --afri-void: #f8fafc;      /* Page Background */
+   --afri-charcoal: #ffffff;  /* Surface 1 */
+   --afri-obsidian: #e2e8f0;  /* Surface 2 */
+
+   /* Text System */
+   --text-primary: #0f172a;
+   --text-secondary: #334155;
+   --text-muted: #64748b;
+
+   /* Structural Variables */
+   --bg-base: var(--afri-void);
+   --glass-bg: rgba(255, 255, 255, 0.7);
+   --glass-border: rgba(0, 0, 0, 0.1);
+   --border-color: var(--glass-border);
+   --text-main: var(--text-primary);
+}
+
+body {
+   background-color: var(--afri-void);
+   color: var(--text-primary);
+   font-family: var(--font-body);
+   margin: 0;
+   padding: 0;
+   line-height: 1.6;
+   overflow-x: hidden;
+}
+
+/* Typography Overrides */
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+   font-family: var(--font-logo);
+   font-weight: 700;
+   letter-spacing: -0.025em;
+   color: var(--text-primary);
+   margin-top: 0;
+   margin-bottom: var(--space-21);
+}
+
+h1 {
+   font-size: clamp(2.5rem, 5vw, 4rem);
+}
+
+h2 {
+   font-size: clamp(2rem, 4vw, 3rem);
+}
+
+h3 {
+   font-size: 1.5rem;
+}
+
+/* =========================================
+   COMPONENT PREVIEW CARD (Global Design System)
+   Used in Showcase, Patterns, Components pages
+   ========================================= */
+.preview-card {
+   background: var(--afri-charcoal);
+   border: 1px solid var(--afri-obsidian);
+   border-radius: var(--radius-lg);
+   overflow: hidden;
+   display: flex;
+   flex-direction: column;
+   transition: border-color 0.3s ease, transform 0.3s ease;
+}
+
+.preview-card:hover {
+   border-color: var(--afri-green);
+   transform: translateY(-4px);
+}
+
+.preview-header {
+   border-bottom: 1px solid var(--afri-obsidian);
+   padding: 16px 24px;
+   display: flex;
+   justify-content: space-between;
+   align-items: center;
+   background: rgba(0, 0, 0, 0.2);
+}
+
+.preview-title {
+   font-weight: 600;
+   font-size: 0.9rem;
+   color: var(--text-primary);
+   text-transform: uppercase;
+   letter-spacing: 0.05em;
+}
+
+.preview-canvas {
+   padding: 40px;
+   background-image: radial-gradient(var(--afri-obsidian) 1px, transparent 1px);
+   background-size: 20px 20px;
+   flex-grow: 1;
+   display: flex;
+   justify-content: center;
+   align-items: center;
+   min-height: 200px;
+}
+
+/* Layout Utilities */
+.page-container {
+   max-width: var(--page-max-width);
+   margin: 0 auto;
+   padding: 100px var(--space-34) var(--space-89);
+   min-height: 100vh;
+}
+
+.page-header {
+   text-align: center;
+   margin-bottom: var(--space-89);
+   position: relative;
+}
+
+.page-header h1 {
+   background: linear-gradient(to right, #4ade80, #38bdf8);
+   background-clip: text;
+   -webkit-background-clip: text;
+   -webkit-text-fill-color: transparent;
+   margin-bottom: var(--space-13);
+}
+
+.page-header p {
+   font-size: 1.25rem;
+   color: var(--text-secondary);
+   max-width: 600px;
+   margin: 0 auto;
+}
+
+/* Scrollbar */
+::-webkit-scrollbar {
+   width: var(--space-8);
+}
+
+::-webkit-scrollbar-track {
+   background: var(--afri-black);
+}
+
+::-webkit-scrollbar-thumb {
+   background: var(--afri-obsidian);
+   border-radius: var(--space-5);
+   border: 2px solid var(--afri-black);
+}
+
+::-webkit-scrollbar-thumb:hover {
+   background: var(--afri-green);
+}
+
+/* =========================================
+   RESPONSIVE BREAKPOINTS
+   ========================================= */
+
+@media (max-width: 768px) {
+   :root {
+      --space-34: 24px;
+      --space-55: 40px;
+      --space-89: 60px;
+   }
+
+   .page-container {
+      padding: 90px 20px 60px;
+   }
+
+   .preview-card {
+      border-radius: var(--space-8);
+   }
+
+   .preview-canvas {
+      padding: 24px;
+      min-height: 150px;
+   }
+
+   h1 {
+      font-size: 2.5rem;
+   }
+
+   h2 {
+      font-size: 1.8rem;
+   }
+
+   h3 {
+      font-size: 1.25rem;
+   }
+
+   .page-header p {
+      font-size: 1rem;
+   }
+}
+
+/* Mobile Small */
+@media (max-width: 480px) {
+   :root {
+      --space-21: 16px;
+   }
+
+   .page-container {
+      padding: 85px 16px 40px;
+   }
+
+   /* =========================================
+   COMPONENT FALLBACKS (Headless Proofing)
+   ========================================= */
+
+   af-navbar:not(:defined) {
+      display: flex;
+      height: 80px;
+      background: rgba(15, 23, 42, 0.9);
+      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+      align-items: center;
+      padding: 0 5%;
+      gap: 24px;
+   }
+
+   af-navbar:not(:defined) a {
+      color: #94a3b8;
+      text-decoration: none;
+      font-size: 0.9rem;
+   }
+
+   af-button:not(:defined) {
+      display: inline-flex;
+      padding: 12px 24px;
+      background: #1EB53A;
+      color: white;
+      border-radius: 8px;
+      font-weight: 600;
+   }
+}

package/styles/typography.css

@@ -0,0 +1,141 @@
+/* 
+ * AFRICODE CUSTOM TYPOGRAPHY SYSTEM
+ * "Our Own Font" - Pattern-Driven Text
+ * 
+ * Instead of relying on external fonts, we create our own
+ * distinctive type using pattern fills, gradients, and effects.
+ */
+
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');
+
+:root {
+    /* Base fonts - clean foundation */
+    --font-base: 'Inter', system-ui, -apple-system, sans-serif;
+    --font-geo: var(--font-base);
+}
+
+body {
+    font-family: var(--font-base);
+    font-weight: 400;
+}
+
+/* 
+ * AFRICODE DISPLAY TYPE
+ * Bold, geometric, pattern-filled
+ */
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-family: var(--font-base);
+    font-weight: 900;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    line-height: 1.0;
+}
+
+/* 
+ * PATTERN-FILLED TEXT
+ * Text becomes a mask for our African patterns
+ */
+.afri-text {
+    font-weight: 900;
+    text-transform: uppercase;
+    letter-spacing: 0.08em;
+    background: linear-gradient(135deg, var(--afri-green), var(--afri-gold));
+    background-clip: text;
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    color: transparent;
+}
+
+/* Pattern variants using SVG fills (set via JS) */
+.afri-text-pattern {
+    font-weight: 900;
+    text-transform: uppercase;
+    letter-spacing: 0.08em;
+    background-size: 30px 30px;
+    background-clip: text;
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    color: transparent;
+}
+
+/* 
+ * GLOW EFFECT
+ * Adds depth and "vibrancy"
+ */
+.afri-text-glow {
+    text-shadow:
+        0 0 10px var(--afri-green),
+        0 0 20px rgba(30, 181, 58, 0.5),
+        0 0 40px rgba(30, 181, 58, 0.3);
+}
+
+/* 
+ * STROKE OUTLINE STYLE
+ * For headers that need impact
+ */
+.afri-text-outline {
+    font-weight: 900;
+    text-transform: uppercase;
+    letter-spacing: 0.1em;
+    color: transparent;
+    -webkit-text-stroke: 2px var(--afri-gold);
+    text-stroke: 2px var(--afri-gold);
+}
+
+/* 
+ * DUOTONE GRADIENT
+ * African sunset/earth tones
+ */
+.afri-text-earth {
+    font-weight: 900;
+    background: linear-gradient(180deg, #CD853F 0%, #8B4513 100%);
+    background-clip: text;
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+}
+
+.afri-text-sunset {
+    font-weight: 900;
+    background: linear-gradient(135deg, #FF6B00 0%, #FCD116 50%, #1EB53A 100%);
+    background-clip: text;
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+}
+
+/* 
+ * STACKED/LAYERED TEXT
+ * Creates depth illusion
+ */
+.afri-text-stack {
+    position: relative;
+    font-weight: 900;
+    text-transform: uppercase;
+    color: var(--afri-gold);
+}
+
+.afri-text-stack::before {
+    content: attr(data-text);
+    position: absolute;
+    left: 3px;
+    top: 3px;
+    color: var(--afri-green);
+    z-index: -1;
+}
+
+/* 
+ * VERNACULAR ACCENT
+ * For energetic callouts
+ */
+.vernacular {
+    font-weight: 800;
+    font-style: italic;
+    text-transform: uppercase;
+    letter-spacing: 0.15em;
+    transform: skewX(-5deg);
+    display: inline-block;
+}

package/templates/starter/.env.example

@@ -0,0 +1,15 @@
+# AfriCode Environment Configuration
+
+# Server Settings
+PORT=3000
+NODE_ENV=development
+
+# Database Settings
+DB_FILE=./data.db
+
+# Security
+SESSION_SECRET=replace_this_with_a_long_random_string
+JWT_SECRET=replace_this_with_another_long_random_string
+
+# API Keys (Add yours here)
+# PUBLIC_API_URL=http://localhost:3000

package/templates/starter/africode.config.js

@@ -0,0 +1,40 @@
+/**
+ * AfriCode Framework Configuration
+ */
+export default {
+    // Project entry point
+    entry: 'src/index.js',
+    
+    // Server Configuration
+    server: {
+        port: process.env.PORT || 3000,
+        host: '0.0.0.0',
+        staticDir: 'public',
+        cors: true
+    },
+    
+    // Directory structure mapping
+    directories: {
+        src: 'src',
+        pages: 'src/pages',
+        components: 'src/components',
+        styles: 'src/styles',
+        build: 'dist'
+    },
+    
+    // Database Configuration (SQLite)
+    database: {
+        client: 'sqlite',
+        connection: {
+            filename: process.env.DB_FILE || './data.db'
+        },
+        useNullAsDefault: true,
+        walMode: true // Write-Ahead Logging for performance
+    },
+
+    // Theme defaults
+    theme: {
+        default: 'dark',
+        toggleAttribute: 'data-theme'
+    }
+};