Code Canvas now includes two reusable modules that provide the core functionality:
A module for managing state documentation in AI-assisted projects. It provides:
- Lifecycle management (FSM definitions)
- State history tracking
- Validation rules configuration
- Canvas-based design documentation
A module for automated validation and guardrails in AI-assisted development. It provides:
- Pre-commit validation (Guardian)
- FSM enforcement
- Rules engine for invariants and chores
- Activity-based file access control
Both modules support a "dual support" pattern:
- Internal Use: Code Canvas uses State-Docs and ADP to govern its own development
- External Offering: Projects created with Code Canvas can include these modules
This creates a "squared" effect where:
- Code Canvas → uses State-Docs + ADP
- Projects created by Code Canvas → can also use State-Docs + ADP
- Each level benefits from the same governance patterns
modules/
├── state-docs/
│ ├── README.md # Module documentation
│ ├── mod.ts # Main exports
│ ├── mod.test.ts # Tests
│ └── deno.json # Module configuration
└── adp/
├── README.md # Module documentation
├── mod.ts # Main exports
├── mod.test.ts # Tests
└── deno.json # Module configuration
The integrated-guardian.ts tool demonstrates how to use both modules:
# Validate files
deno run -A tools/integrated-guardian.ts validate src/app.ts
# Show current activity
deno run -A tools/integrated-guardian.ts activity
# Show lifecycle states
deno run -A tools/integrated-guardian.ts lifecycle
# Check if path is allowed
deno run -A tools/integrated-guardian.ts check-path src/new-file.tsThe templates/project-with-modules/ template shows how new projects can include both modules:
# Copy template to create new project
cp -r templates/project-with-modules my-new-project
cd my-new-project
# Install hooks
deno task prepare-hooks
# Use the integrated tools
deno task activity
deno task validate// Import modules
import { StateDocsManager } from "./modules/state-docs/mod.ts";
import { Guardian, FSMManager } from "./modules/adp/mod.ts";
// Set up state management
const stateManager = new StateDocsManager("./sot");
// Use Guardian for validation
const guardian = new Guardian(stateManager);
const result = await guardian.validate(["src/app.ts"]);
// Use FSM Manager for state transitions
const fsmManager = new FSMManager(stateManager);
const transitions = await fsmManager.getAvailableTransitions();Code Canvas itself uses these modules:
- sot/: Contains state documentation (lifecycle, rules, activity)
- tools/guardian.ts: Can be replaced with integrated-guardian.ts
- .githooks/pre-commit: Uses Guardian for validation
This demonstrates the "use itself to develop itself" principle.
- Modular Architecture: Core functionality is separated into reusable modules
- Better Testing: Each module has its own tests
- Cleaner Code: Separation of concerns between state management and validation
- Self-Validation: Code Canvas uses its own modules for governance
- Easy Integration: Include modules by copying or importing
- Consistent Patterns: Same governance patterns across all projects
- Customizable: Modules can be configured per project
- Independent: Modules work independently or together
Use both State-Docs and ADP for complete FSM-controlled development:
const stateManager = new StateDocsManager("./sot");
const guardian = new Guardian(stateManager);
const fsmManager = new FSMManager(stateManager);
// Validate changes
await guardian.validate(files);
// Manage state transitions
await fsmManager.transition("implementation", "human", "Starting implementation");Use only State-Docs for state management without validation:
const stateManager = new StateDocsManager("./sot");
// Read current state
const activity = await stateManager.getCurrentActivity();
const lifecycle = await stateManager.getLifecycle();
// Check permissions
const allowed = await stateManager.isPathAllowed("src/app.ts");Use only ADP for validation without full state management:
// Minimal state manager
const stateManager = new StateDocsManager("./sot");
const guardian = new Guardian(stateManager);
// Just validate
const result = await guardian.validate(files);Configure in sot/:
lifecycle.yaml: FSM state definitionsrules.yaml: Validation rulesstate/activity.yaml: Current activitystate/history.yaml: Activity history
ADP reads configuration from State-Docs:
- Uses
lifecycle.yamlfor allowed paths - Uses
rules.yamlfor validation rules - Uses
state/activity.yamlfor current context
- Separate Repositories: Publish modules as separate npm/JSR packages
- Version Management: Independent versioning for each module
- Plugin System: Allow custom validators and state managers
- Web UI: Visual interface for state management and validation
- CI/CD Integration: GitHub Actions for automated validation
- Keep existing
tools/guardian.tsfor backward compatibility - Use
tools/integrated-guardian.tsfor new features - Gradually migrate existing hooks and tools
- Add
modules/directory with State-Docs and ADP - Update
deno.jsontasks to use integrated tools - Configure
sot/structure if not already present
Run tests for both modules:
# Test State-Docs
cd modules/state-docs
deno task test
# Test ADP
cd modules/adp
deno task test
# Test integration
deno task testEach module has its own README:
modules/state-docs/README.md: State-Docs documentationmodules/adp/README.md: ADP documentation- This document: Integration guide
See templates/project-with-modules/ for a complete example of a project using both modules.
For issues or questions:
- Check module READMEs for detailed documentation
- See examples in
templates/project-with-modules/ - Review tests in
modules/*/mod.test.ts - Open an issue on GitHub
ISC - Same as Code Canvas project