🏗️ Architecture: How should Workbench embeddables map to Page Builder widgets...

Date: 2026-02-06
Time: 02:18:46 UTC
Session: editor2-95.5
Agent: angular
Confidence: 88%
Status: ✅ Documented

📋 Decision Context

Question:

How should Workbench embeddables map to Page Builder widgets?

Task: P0-C: Bridge Workbench embeddables → Page Builder widgets

🎯 Decision Made

Chosen:

Create EmbeddableToWidgetMapper service with category-aware sizing: widget→100%×200px, form→100%×400px, list→100%×350px, card→48%×200px, dashboard→48%×250px. Preserve binding metadata via _inputBindings, _outputBindings, _dataBindings custom properties on MappedWidgetInstance. Generate widget types like embeddable-list-{kebab-name}. mapToPage() creates a complete MappedPage with flex column layout.

Options Considered:

1. Category-aware mapper service with binding preservation
2. Generic 1:1 mapping without sizing intelligence
3. Merge embeddable and widget type systems

💭 Reasoning

Embeddables and widgets are conceptually the same (visual components with inputs/outputs) but use different type systems. The mapper handles the type conversion while preserving the critical binding metadata that makes the components functional. Category-aware sizing provides sensible defaults so the generated page looks reasonable without manual adjustment. The MappedPage structure is compatible with PageBuilder's canvas format.

📁 Files Involved

• libs/libs-structural/modularity-lib/src/lib/services/embeddable-to-widget-mapper.service.ts
• libs/libs-structural/modularity-lib/src/lib/components/steps/ui-step/ui-step.component.ts

🔗 Related

• Decision ID: dev_1770344326482_11qql3n
• Session: 95
• Workspace: editor2

Auto-generated by MCP Smart Consolidation