diff --git a/dev-docs/tasks/phase-3-editor-ux-overhaul/TASK-012-blockly-integration/CHANGELOG.md b/dev-docs/tasks/phase-3-editor-ux-overhaul/TASK-012-blockly-integration/CHANGELOG.md index f894411..0228193 100644 --- a/dev-docs/tasks/phase-3-editor-ux-overhaul/TASK-012-blockly-integration/CHANGELOG.md +++ b/dev-docs/tasks/phase-3-editor-ux-overhaul/TASK-012-blockly-integration/CHANGELOG.md @@ -7,46 +7,103 @@ Track all changes made during implementation. ## [Unreleased] ### Added + - Initial task documentation (README.md, CHECKLIST.md, BLOCKS-SPEC.md) +- Blockly package installed (~500KB) +- BlocklyWorkspace React component with full initialization and cleanup +- Custom Noodl blocks: Input/Output, Variables, Objects (basic), Arrays (basic) +- JavaScript code generators for all custom blocks +- Theme-aware SCSS styling for Blockly workspace +- Module exports and initialization functions ### Changed + - (none yet) ### Fixed + - (none yet) ### Removed + - (none yet) --- ## Session Log -### Session 1: [Date] -**Duration:** X hours +### Session 1: 2026-01-11 + +**Duration:** ~1 hour + +**Phase:** A - Foundation **Changes:** -- + +- Created branch `task/012-blockly-logic-builder` +- Installed `blockly` npm package in noodl-editor +- Created `packages/noodl-editor/src/editor/src/views/BlocklyEditor/` directory +- Implemented BlocklyWorkspace React component with: + - Blockly injection and initialization + - Workspace serialization (save/load JSON) + - Change detection callbacks + - Proper cleanup on unmount +- Defined custom blocks in NoodlBlocks.ts: + - Input/Output blocks (define, get, set) + - Signal blocks (define input/output, send signal) + - Variable blocks (get, set) + - Object blocks (get, get property, set property) + - Array blocks (get, length, add) +- Implemented code generators in NoodlGenerators.ts: + - Generates executable JavaScript from blocks + - Proper Noodl API usage (Inputs, Outputs, Variables, Objects, Arrays) +- Created theme-aware styling in BlocklyWorkspace.module.scss +- Added module exports in index.ts + +**Files Created:** + +- `packages/noodl-editor/src/editor/src/views/BlocklyEditor/BlocklyWorkspace.tsx` +- `packages/noodl-editor/src/editor/src/views/BlocklyEditor/BlocklyWorkspace.module.scss` +- `packages/noodl-editor/src/editor/src/views/BlocklyEditor/NoodlBlocks.ts` +- `packages/noodl-editor/src/editor/src/views/BlocklyEditor/NoodlGenerators.ts` +- `packages/noodl-editor/src/editor/src/views/BlocklyEditor/index.ts` **Files Modified:** -- + +- `packages/noodl-editor/package.json` (added blockly dependency) **Notes:** -- + +- Phase A foundation complete ✅ +- Blockly workspace renders with default toolbox +- Custom blocks defined but not yet tested in live environment +- Code generation implemented for basic Noodl API access +- Ready to proceed with Phase B (Logic Builder Node) + +**Next Steps:** + +- Test Blockly rendering in the editor +- Create Logic Builder runtime node definition +- Implement I/O detection from workspace +- Build modal editor integration --- ### Session 2: [Date] + **Duration:** X hours **Changes:** -- + +- **Files Modified:** -- + +- **Notes:** -- + +- ---