325a06139f
Frontend Maintenance: - Updated cache-busting version parameters on all script/CSS links - researcher.html: Version updates for navbar, i18n, scroll-animations - implementer.html: Version updates for components - leader.html: Version updates for components - i18n-simple.js: Updated internationalization utility These version updates ensure users get fresh content after website audit deployment and prevent stale cache issues. All changes deployed to production and verified working.
649 lines
27 KiB
HTML
649 lines
27 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Framework Implementation Guide | Tractatus</title>
|
|
<meta name="description" content="Technical documentation for integrating Tractatus framework: architecture, API reference, and code examples from production implementation.">
|
|
|
|
<link rel="manifest" href="/manifest.json">
|
|
<meta name="theme-color" content="#3b82f6">
|
|
<link rel="icon" type="image/svg+xml" href="/favicon-new.svg">
|
|
<link rel="stylesheet" href="/css/fonts.css?v=1761163813">
|
|
<link rel="stylesheet" href="/css/tailwind.css?v=1761163813">
|
|
<link rel="stylesheet" href="/css/tractatus-theme.min.css?v=1761163813">
|
|
<style>
|
|
.skip-link { position: absolute; left: -9999px; top: 0; }
|
|
.skip-link:focus { left: 0; z-index: 100; background: white; padding: 1rem; border: 2px solid #3b82f6; }
|
|
a:focus, button:focus { outline: 3px solid #3b82f6; outline-offset: 2px; }
|
|
a:focus:not(:focus-visible) { outline: none; }
|
|
a:focus-visible { outline: 3px solid #3b82f6; outline-offset: 2px; }
|
|
|
|
/* Mobile code block optimizations */
|
|
pre {
|
|
-webkit-overflow-scrolling: touch;
|
|
max-width: 100%;
|
|
}
|
|
pre code {
|
|
display: block;
|
|
white-space: pre;
|
|
word-wrap: normal;
|
|
}
|
|
@media (max-width: 640px) {
|
|
pre { font-size: 11px; }
|
|
body { font-size: 16px; } /* Prevent iOS zoom on input focus */
|
|
}
|
|
|
|
/* Diagram sizing */
|
|
.diagram-img {
|
|
max-width: 600px;
|
|
width: 100%;
|
|
height: auto;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body class="bg-gray-50">
|
|
|
|
<a href="#main-content" class="skip-link">Skip to main content</a>
|
|
<script src="/js/components/navbar.js?v=1761163813"></script>
|
|
|
|
<!-- Breadcrumb -->
|
|
<nav class="bg-gray-50 border-b border-gray-200 py-3" aria-label="Breadcrumb">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<ol class="flex items-center space-x-2 text-sm">
|
|
<li><a href="/" class="hover:underline transition-colors text-tractatus-link">Home</a></li>
|
|
<li class="text-gray-400">/</li>
|
|
<li class="text-gray-900 font-medium" aria-current="page">Implementation Guide</li>
|
|
</ol>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Hero -->
|
|
<div class="bg-gradient-to-br from-blue-50 to-indigo-50 py-16">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center">
|
|
<h1 class="text-5xl font-bold text-gray-900 mb-6">
|
|
Framework Implementation Guide
|
|
</h1>
|
|
<p class="text-xl text-gray-600 max-w-3xl mx-auto">
|
|
Technical documentation for integrating the 6 Tractatus governance services into your AI systems. Production-tested architecture and real code examples.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Quick Links -->
|
|
<div class="bg-white border-b border-gray-200">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
|
|
<nav class="flex justify-center flex-wrap gap-4 sm:gap-8" aria-label="Page sections">
|
|
<a href="#architecture" class="text-blue-600 hover:text-blue-800 font-medium px-2 py-2 min-h-[44px] flex items-center">Architecture</a>
|
|
<a href="#services" class="text-blue-600 hover:text-blue-800 font-medium px-2 py-2 min-h-[44px] flex items-center">Services</a>
|
|
<a href="#api" class="text-blue-600 hover:text-blue-800 font-medium px-2 py-2 min-h-[44px] flex items-center">API Reference</a>
|
|
<a href="#examples" class="text-blue-600 hover:text-blue-800 font-medium px-2 py-2 min-h-[44px] flex items-center">Code Examples</a>
|
|
<a href="#deployment" class="text-blue-600 hover:text-blue-800 font-medium px-2 py-2 min-h-[44px] flex items-center">Deployment</a>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Framework Architecture -->
|
|
<main id="main-content">
|
|
<div id="architecture" class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-8">Framework Architecture</h2>
|
|
|
|
<!-- Main Flow Diagram -->
|
|
<div class="bg-white rounded-xl shadow-lg p-8 mb-8">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-4">Service Interaction Flow</h3>
|
|
<div class="bg-gray-50 rounded-lg p-6">
|
|
<img src="/docs/diagrams/architecture-main-flow.svg"
|
|
alt="Tractatus Framework Architecture: Shows how 6 governance services interact in sequence"
|
|
class="diagram-img"
|
|
loading="lazy">
|
|
</div>
|
|
<div class="mt-6 flex gap-4">
|
|
<a href="/docs/diagrams/architecture-main-flow.svg" download
|
|
class="inline-flex items-center bg-blue-600 text-white px-4 py-2 rounded-lg text-sm font-semibold hover:bg-blue-700 transition min-h-[44px]"
|
|
aria-label="Download architecture main flow diagram as SVG">
|
|
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
|
|
</svg>
|
|
Download SVG
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Trigger Decision Tree -->
|
|
<div class="bg-white rounded-xl shadow-lg p-8 mb-8">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-4">Service Trigger Conditions</h3>
|
|
<div class="bg-gray-50 rounded-lg p-6">
|
|
<img src="/docs/diagrams/trigger-decision-tree.svg"
|
|
alt="Service Trigger Decision Tree: When each framework service activates"
|
|
class="diagram-img"
|
|
loading="lazy">
|
|
</div>
|
|
<div class="mt-6 flex gap-4">
|
|
<a href="/docs/diagrams/trigger-decision-tree.svg" download
|
|
class="inline-flex items-center bg-blue-600 text-white px-4 py-2 rounded-lg text-sm font-semibold hover:bg-blue-700 transition min-h-[44px]"
|
|
aria-label="Download service trigger decision tree as SVG">
|
|
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
|
|
</svg>
|
|
Download SVG
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Core Services -->
|
|
<div id="services" class="bg-gray-50 py-16">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-8">Core Services</h2>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
|
<!-- BoundaryEnforcer -->
|
|
<div class="bg-white rounded-lg p-6 shadow-lg">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-3">BoundaryEnforcer</h3>
|
|
<p class="text-sm text-gray-600 mb-4">
|
|
Implements Tractatus 12.1-12.7: AI cannot make values decisions without human approval.
|
|
</p>
|
|
<div class="text-sm text-gray-700 mb-3">
|
|
<strong>Boundaries:</strong>
|
|
<ul class="list-disc list-inside mt-2 space-y-1">
|
|
<li>VALUES (12.1) - Ethics, privacy, principles</li>
|
|
<li>INNOVATION (12.2) - Architectural decisions</li>
|
|
<li>WISDOM (12.3) - Strategic judgment</li>
|
|
<li>PURPOSE (12.4) - Goal definition</li>
|
|
</ul>
|
|
</div>
|
|
<pre role="region" aria-label="BoundaryEnforcer example code" class="bg-gray-900 text-gray-100 p-3 rounded text-xs overflow-x-auto"><code>const { checkBoundary } = require('./services/BoundaryEnforcer')
|
|
const result = await checkBoundary(decision)
|
|
// Returns: { allowed: false, requires_human: true }</code></pre>
|
|
</div>
|
|
|
|
<!-- InstructionPersistenceClassifier -->
|
|
<div class="bg-white rounded-lg p-6 shadow-lg">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-3">InstructionPersistenceClassifier</h3>
|
|
<p class="text-sm text-gray-600 mb-4">
|
|
Classifies instructions by quadrant (STRATEGIC/OPERATIONAL/TACTICAL/SYSTEM) and persistence level (HIGH/MEDIUM/LOW).
|
|
</p>
|
|
<div class="text-sm text-gray-700 mb-3">
|
|
<strong>Classification:</strong>
|
|
<ul class="list-disc list-inside mt-2 space-y-1">
|
|
<li>Quadrant (STRATEGIC/OPERATIONAL/TACTICAL/SYSTEM)</li>
|
|
<li>Persistence (HIGH/MEDIUM/LOW)</li>
|
|
<li>Temporal scope (PROJECT/SESSION/TASK)</li>
|
|
<li>Explicitness score (0.0-1.0)</li>
|
|
</ul>
|
|
</div>
|
|
<pre role="region" aria-label="InstructionPersistenceClassifier example code" class="bg-gray-900 text-gray-100 p-3 rounded text-xs overflow-x-auto"><code>const { classify } = require('./services/InstructionPersistenceClassifier')
|
|
const result = await classify(instruction)
|
|
// Returns: { quadrant, persistence, temporal_scope, explicitness }</code></pre>
|
|
</div>
|
|
|
|
<!-- CrossReferenceValidator -->
|
|
<div class="bg-white rounded-lg p-6 shadow-lg">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-3">CrossReferenceValidator</h3>
|
|
<p class="text-sm text-gray-600 mb-4">
|
|
Validates AI actions against stored instructions to prevent pattern recognition overrides.
|
|
</p>
|
|
<div class="text-sm text-gray-700 mb-3">
|
|
<strong>Validation:</strong>
|
|
<ul class="list-disc list-inside mt-2 space-y-1">
|
|
<li>Checks action against HIGH persistence instructions</li>
|
|
<li>Detects conflicts (pattern vs explicit instruction)</li>
|
|
<li>Provides correct parameters when rejected</li>
|
|
</ul>
|
|
</div>
|
|
<pre role="region" aria-label="CrossReferenceValidator example code" class="bg-gray-900 text-gray-100 p-3 rounded text-xs overflow-x-auto"><code>const { validate } = require('./services/CrossReferenceValidator')
|
|
const result = await validate(action, instructions)
|
|
// Returns: { status: 'REJECTED', conflicts, correct_parameters }</code></pre>
|
|
</div>
|
|
|
|
<!-- ContextPressureMonitor -->
|
|
<div class="bg-white rounded-lg p-6 shadow-lg">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-3">ContextPressureMonitor</h3>
|
|
<p class="text-sm text-gray-600 mb-4">
|
|
Monitors token usage and context pressure, triggering safety protocols at thresholds.
|
|
</p>
|
|
<div class="text-sm text-gray-700 mb-3">
|
|
<strong>Pressure Levels:</strong>
|
|
<ul class="list-disc list-inside mt-2 space-y-1">
|
|
<li>NORMAL (0-50%) - Full operation</li>
|
|
<li>ELEVATED (50-75%) - Increase verification</li>
|
|
<li>HIGH (75-90%) - Reduce complexity</li>
|
|
<li>CRITICAL (90%+) - Suggest handoff</li>
|
|
</ul>
|
|
</div>
|
|
<pre role="region" aria-label="ContextPressureMonitor example code" class="bg-gray-900 text-gray-100 p-3 rounded text-xs overflow-x-auto"><code>const { analyzePressure } = require('./services/ContextPressureMonitor')
|
|
const result = await analyzePressure(tokens, messages)
|
|
// Returns: { level: 'HIGH', score: 82, shouldReduce: true }</code></pre>
|
|
</div>
|
|
|
|
<!-- MetacognitiveVerifier -->
|
|
<div class="bg-white rounded-lg p-6 shadow-lg">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-3">MetacognitiveVerifier</h3>
|
|
<p class="text-sm text-gray-600 mb-4">
|
|
Verifies action reasoning and confidence, requiring confirmation for low-confidence actions.
|
|
</p>
|
|
<div class="text-sm text-gray-700 mb-3">
|
|
<strong>Verification:</strong>
|
|
<ul class="list-disc list-inside mt-2 space-y-1">
|
|
<li>Confidence scoring (0.0-1.0)</li>
|
|
<li>Selective mode (HIGH persistence only)</li>
|
|
<li>Requires confirmation if confidence < 0.7</li>
|
|
</ul>
|
|
</div>
|
|
<pre role="region" aria-label="MetacognitiveVerifier example code" class="bg-gray-900 text-gray-100 p-3 rounded text-xs overflow-x-auto"><code>const { verify } = require('./services/MetacognitiveVerifier')
|
|
const result = await verify(action, reasoning)
|
|
// Returns: { confidence: 0.65, requires_confirmation: true }</code></pre>
|
|
</div>
|
|
|
|
<!-- PluralisticDeliberationOrchestrator -->
|
|
<div class="bg-white rounded-lg p-6 shadow-lg">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-3">PluralisticDeliberationOrchestrator</h3>
|
|
<p class="text-sm text-gray-600 mb-4">
|
|
Manages multi-stakeholder deliberation ensuring value pluralism in decisions.
|
|
</p>
|
|
<div class="text-sm text-gray-700 mb-3">
|
|
<strong>Features:</strong>
|
|
<ul class="list-disc list-inside mt-2 space-y-1">
|
|
<li>Stakeholder perspective tracking</li>
|
|
<li>Value conflict detection</li>
|
|
<li>Deliberation session management</li>
|
|
<li>Precedent storage</li>
|
|
</ul>
|
|
</div>
|
|
<pre role="region" aria-label="PluralisticDeliberationOrchestrator example code" class="bg-gray-900 text-gray-100 p-3 rounded text-xs overflow-x-auto"><code>const { orchestrate } = require('./services/PluralisticDeliberationOrchestrator')
|
|
const result = await orchestrate(decision, stakeholders)
|
|
// Returns: { decision, perspectives, conflicts_identified }</code></pre>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Source Code Reference -->
|
|
<div class="mt-8 bg-blue-50 border-l-4 border-blue-500 p-6 rounded-r-lg">
|
|
<p class="text-sm text-blue-900 font-medium mb-2">📁 Source Code</p>
|
|
<p class="text-sm text-blue-800">
|
|
All services are available in the GitHub repository:
|
|
<a href="https://github.com/AgenticGovernance/tractatus-framework/tree/main/src/services"
|
|
class="underline font-medium hover:text-blue-900"
|
|
target="_blank"
|
|
rel="noopener noreferrer">
|
|
/src/services/
|
|
</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- API Reference -->
|
|
<div id="api" class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-8">API Reference</h2>
|
|
|
|
<!-- BoundaryEnforcer API -->
|
|
<div class="bg-white rounded-lg shadow-lg p-6 mb-6">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-4">BoundaryEnforcer.checkBoundary()</h3>
|
|
<pre class="bg-gray-900 text-gray-100 p-4 rounded-lg overflow-x-auto text-sm mb-4"><code>const { checkBoundary } = require('./src/services/BoundaryEnforcer.service')
|
|
|
|
// Check if decision crosses Tractatus boundary
|
|
const decision = {
|
|
domain: 'values',
|
|
description: 'Change privacy policy to enable analytics',
|
|
context: { /* ... */ }
|
|
}
|
|
|
|
const result = await checkBoundary(decision)
|
|
|
|
// Returns:
|
|
{
|
|
allowed: false, // AI cannot proceed
|
|
requires_human: true, // Human decision required
|
|
boundary: "12.1", // Tractatus boundary violated
|
|
principle: "Values cannot be automated, only verified",
|
|
reason: "Decision involves values domain",
|
|
ai_can_provide: [ // What AI CAN do
|
|
"Analyze privacy implications",
|
|
"List alternative approaches",
|
|
"Document tradeoffs"
|
|
]
|
|
}</code></pre>
|
|
<div class="text-sm text-gray-700">
|
|
<strong>Keywords detected:</strong> value, principle, ethic, moral, should, ought, right, wrong, privacy, policy, trade-off, etc.
|
|
</div>
|
|
</div>
|
|
|
|
<!-- InstructionPersistenceClassifier API -->
|
|
<div class="bg-white rounded-lg shadow-lg p-6 mb-6">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-4">InstructionPersistenceClassifier.classify()</h3>
|
|
<pre class="bg-gray-900 text-gray-100 p-4 rounded-lg overflow-x-auto text-sm mb-4"><code>const { classify } = require('./src/services/InstructionPersistenceClassifier.service')
|
|
|
|
const instruction = "Always use MongoDB on port 27017"
|
|
const result = await classify(instruction, context)
|
|
|
|
// Returns:
|
|
{
|
|
quadrant: 'SYSTEM', // Decision domain
|
|
persistence: 'HIGH', // How long to remember
|
|
temporal_scope: 'PROJECT', // Scope of applicability
|
|
verification_required: 'MANDATORY', // Verification level
|
|
explicitness: 0.85, // Confidence score
|
|
parameters: {
|
|
port: "27017",
|
|
database: "mongodb",
|
|
service: "mongodb"
|
|
}
|
|
}</code></pre>
|
|
<div class="text-sm text-gray-700">
|
|
<strong>Quadrants:</strong> STRATEGIC, OPERATIONAL, TACTICAL, SYSTEM, STORAGE<br>
|
|
<strong>Persistence:</strong> HIGH (override all), MEDIUM (session-scoped), LOW (can be superseded)
|
|
</div>
|
|
</div>
|
|
|
|
<!-- CrossReferenceValidator API -->
|
|
<div class="bg-white rounded-lg shadow-lg p-6 mb-6">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-4">CrossReferenceValidator.validate()</h3>
|
|
<pre class="bg-gray-900 text-gray-100 p-4 rounded-lg overflow-x-auto text-sm mb-4"><code>const { validate } = require('./src/services/CrossReferenceValidator.service')
|
|
|
|
// User instructed: "Use port 27027"
|
|
// AI attempting: port 27017 (pattern recognition)
|
|
|
|
const action = {
|
|
type: 'db_config',
|
|
parameters: { port: 27017 }
|
|
}
|
|
|
|
const instructions = await getStoredInstructions() // From MongoDB
|
|
const result = await validate(action, instructions)
|
|
|
|
// Returns (CONFLICT):
|
|
{
|
|
status: 'REJECTED',
|
|
conflicts: [
|
|
{
|
|
instruction_id: 'inst_042',
|
|
instruction: 'Use MongoDB port 27027',
|
|
persistence: 'HIGH',
|
|
conflict: 'Proposed port 27017 conflicts with instruction port 27027'
|
|
}
|
|
],
|
|
correct_parameters: {
|
|
port: 27027 // Use this instead
|
|
}
|
|
}</code></pre>
|
|
</div>
|
|
|
|
<!-- ContextPressureMonitor API -->
|
|
<div class="bg-white rounded-lg shadow-lg p-6">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-4">ContextPressureMonitor.analyzePressure()</h3>
|
|
<pre class="bg-gray-900 text-gray-100 p-4 rounded-lg overflow-x-auto text-sm mb-4"><code>const { analyzePressure } = require('./src/services/ContextPressureMonitor.service')
|
|
|
|
const pressure = await analyzePressure({
|
|
currentTokens: 150000,
|
|
maxTokens: 200000,
|
|
messageCount: 45,
|
|
errorCount: 2
|
|
})
|
|
|
|
// Returns:
|
|
{
|
|
level: 'HIGH', // NORMAL|ELEVATED|HIGH|CRITICAL
|
|
score: 75, // 0-100 percentage
|
|
shouldReduce: true, // Reduce complexity
|
|
recommendations: [
|
|
'Consider handoff to new session',
|
|
'Reduce verbose explanations',
|
|
'Increase verification for remaining actions'
|
|
],
|
|
thresholds: {
|
|
tokens: 75, // 75% of max
|
|
messages: 64, // 45/70 messages
|
|
errors: 40 // 2 errors
|
|
}
|
|
}</code></pre>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Code Examples -->
|
|
<div id="examples" class="bg-gray-50 py-16">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-8">Integration Examples</h2>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
|
<!-- Express Middleware -->
|
|
<div class="bg-white rounded-lg p-6 shadow-lg">
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-4">Express Middleware Integration</h3>
|
|
<pre class="bg-gray-900 text-gray-100 p-4 rounded-lg text-xs overflow-x-auto"><code>const express = require('express')
|
|
const { BoundaryEnforcer } = require('./services')
|
|
|
|
const app = express()
|
|
|
|
// Add boundary checking middleware
|
|
app.use(async (req, res, next) => {
|
|
if (req.body.decision) {
|
|
const check = await BoundaryEnforcer.checkBoundary(
|
|
req.body.decision
|
|
)
|
|
|
|
if (!check.allowed) {
|
|
return res.status(403).json({
|
|
error: 'Boundary violation',
|
|
reason: check.reason,
|
|
alternatives: check.ai_can_provide
|
|
})
|
|
}
|
|
}
|
|
next()
|
|
})</code></pre>
|
|
</div>
|
|
|
|
<!-- Real-World Validation -->
|
|
<div class="bg-white rounded-lg p-6 shadow-lg">
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-4">Instruction Validation</h3>
|
|
<pre class="bg-gray-900 text-gray-100 p-4 rounded-lg text-xs overflow-x-auto"><code>const {
|
|
InstructionPersistenceClassifier,
|
|
CrossReferenceValidator
|
|
} = require('./services')
|
|
|
|
// Classify and store user instruction
|
|
const classification = await
|
|
InstructionPersistenceClassifier.classify(
|
|
userInstruction
|
|
)
|
|
|
|
if (classification.explicitness >= 0.6) {
|
|
await storeInstruction(classification)
|
|
}
|
|
|
|
// Validate AI action before execution
|
|
const validation = await
|
|
CrossReferenceValidator.validate(
|
|
proposedAction,
|
|
await getStoredInstructions()
|
|
)
|
|
|
|
if (validation.status === 'REJECTED') {
|
|
console.error(validation.conflicts)
|
|
useCorrectParameters(
|
|
validation.correct_parameters
|
|
)
|
|
}</code></pre>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- MongoDB Models -->
|
|
<div class="mt-8 bg-white rounded-lg shadow-lg p-6">
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-4">MongoDB Data Models</h3>
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
|
<div>
|
|
<h4 class="font-medium text-gray-900 mb-2">GovernanceRule</h4>
|
|
<pre class="bg-gray-900 text-gray-100 p-3 rounded text-xs overflow-x-auto"><code>{
|
|
id: "inst_001",
|
|
text: "Use MongoDB port 27017",
|
|
quadrant: "SYSTEM",
|
|
persistence: "HIGH",
|
|
temporal_scope: "PROJECT",
|
|
explicitness: 0.85,
|
|
parameters: { port: "27017" },
|
|
active: true,
|
|
timestamp: "2025-10-21T10:00:00Z"
|
|
}</code></pre>
|
|
</div>
|
|
<div>
|
|
<h4 class="font-medium text-gray-900 mb-2">AuditLog</h4>
|
|
<pre class="bg-gray-900 text-gray-100 p-3 rounded text-xs overflow-x-auto"><code>{
|
|
action: "boundary_check",
|
|
result: "REJECTED",
|
|
boundary: "12.1",
|
|
decision: { /* ... */ },
|
|
timestamp: "2025-10-21T11:30:00Z",
|
|
session_id: "2025-10-21-001"
|
|
}</code></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Deployment -->
|
|
<div id="deployment" class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-8">Deployment</h2>
|
|
|
|
<div class="bg-white rounded-lg shadow-lg p-8 mb-8">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-4">Requirements</h3>
|
|
<ul class="space-y-2 text-gray-700">
|
|
<li class="flex items-start">
|
|
<span class="text-blue-600 mr-2">•</span>
|
|
<div><strong>Node.js:</strong> v18.0.0+ (v20+ recommended)</div>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="text-blue-600 mr-2">•</span>
|
|
<div><strong>MongoDB:</strong> v7.0+ (for instruction persistence)</div>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="text-blue-600 mr-2">•</span>
|
|
<div><strong>Memory:</strong> 2GB+ recommended</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="bg-white rounded-lg shadow-lg p-8">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-4">Installation</h3>
|
|
<pre class="bg-gray-900 text-gray-100 p-4 rounded-lg overflow-x-auto text-sm mb-4"><code># Clone the framework repository
|
|
git clone https://github.com/AgenticGovernance/tractatus-framework.git
|
|
cd tractatus-framework
|
|
|
|
# Install dependencies
|
|
npm install
|
|
|
|
# Configure environment
|
|
cp .env.example .env
|
|
# Edit .env with your MongoDB URI
|
|
|
|
# Initialize MongoDB indexes
|
|
node scripts/init-db.js
|
|
|
|
# Start the server
|
|
npm start</code></pre>
|
|
|
|
<div class="mt-6 bg-blue-50 border-l-4 border-blue-500 p-4 rounded-r-lg">
|
|
<p class="text-sm text-blue-900 font-medium mb-2">📖 Full Documentation</p>
|
|
<p class="text-sm text-blue-800">
|
|
Complete deployment guide available at:
|
|
<a href="https://github.com/AgenticGovernance/tractatus-framework/tree/main/deployment-quickstart"
|
|
class="underline font-medium hover:text-blue-900"
|
|
target="_blank"
|
|
rel="noopener noreferrer">
|
|
/deployment-quickstart/
|
|
</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Resources -->
|
|
<div class="bg-blue-50 py-16">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-8 text-center">Resources</h2>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
|
<div class="bg-white rounded-lg p-6">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-4">Documentation</h3>
|
|
<ul class="space-y-3">
|
|
<li>
|
|
<a href="https://github.com/AgenticGovernance/tractatus-framework"
|
|
class="text-blue-600 hover:text-blue-700 font-medium"
|
|
target="_blank"
|
|
rel="noopener noreferrer">
|
|
→ GitHub Repository
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/docs.html" class="text-blue-600 hover:text-blue-700 font-medium">
|
|
→ Full Documentation
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/demos/27027-demo.html" class="text-blue-600 hover:text-blue-700 font-medium">
|
|
→ Live Demos
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="bg-white rounded-lg p-6">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-4">Source Code</h3>
|
|
<ul class="space-y-3 text-sm">
|
|
<li>
|
|
<a href="https://github.com/AgenticGovernance/tractatus-framework/tree/main/src/services"
|
|
class="text-blue-600 hover:text-blue-700 font-medium"
|
|
target="_blank"
|
|
rel="noopener noreferrer">
|
|
→ /src/services/
|
|
</a>
|
|
<span class="text-gray-500 ml-2">11 services</span>
|
|
</li>
|
|
<li>
|
|
<a href="https://github.com/AgenticGovernance/tractatus-framework/tree/main/src/models"
|
|
class="text-blue-600 hover:text-blue-700 font-medium"
|
|
target="_blank"
|
|
rel="noopener noreferrer">
|
|
→ /src/models/
|
|
</a>
|
|
<span class="text-gray-500 ml-2">10 MongoDB models</span>
|
|
</li>
|
|
<li>
|
|
<a href="https://github.com/AgenticGovernance/tractatus-framework/tree/main/tests"
|
|
class="text-blue-600 hover:text-blue-700 font-medium"
|
|
target="_blank"
|
|
rel="noopener noreferrer">
|
|
→ /tests/
|
|
</a>
|
|
<span class="text-gray-500 ml-2">17 test files</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="bg-white rounded-lg p-6">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-4">Support</h3>
|
|
<p class="text-gray-600 mb-4 text-sm">
|
|
Questions about implementation or integration?
|
|
</p>
|
|
<ul class="space-y-2 text-sm text-gray-600">
|
|
<li>• GitHub Issues</li>
|
|
<li>• GitHub Discussions</li>
|
|
<li>• research@agenticgovernance.digital</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<!-- Footer -->
|
|
<script src="/js/i18n-simple.js?v=1761163813"></script>
|
|
<script src="/js/components/language-selector.js?v=1761163813"></script>
|
|
<script src="/js/scroll-animations.js?v=1761163813"></script>
|
|
<script src="/js/page-transitions.js?v=1761163813"></script>
|
|
<script src="/js/version-manager.js?v=1761163813"></script>
|
|
<script src="/js/components/footer.js?v=1761163813"></script>
|
|
|
|
</body>
|
|
</html>
|