@atlashub/smartstack-cli 4.74.0 → 4.76.0

package/templates/skills/{business-analyse → business-analyse-design}/references/spec-auto-inference.md

@@ -1,117 +1,117 @@
-# Specification: Auto-Inference Rules
-
-> Reference for step-03-specify.md — convention/override depth auto-generation from entity definitions.
-
-## Entity Attribute → SmartTable Column
-
-| Attribute Type | Column Format | Sortable | Filterable | Notes |
-|---|---|---|---|---|
-| string + unique | text | yes | yes | clickAction: navigate:detail |
-| string | text | yes | yes | — |
-| enum / status | badge | yes | yes (multi-select) | colorMap from lifeCycles if exists |
-| FK:Entity | text (join .name) | yes | yes (EntityLookup) | Display related entity name, filter via searchable EntityLookup |
-| decimal | currency | yes | no | — |
-| int | number | yes | no | — |
-| datetime | date-relative | yes | yes (date-range) | — |
-| bool | boolean | yes | yes (toggle) | — |
-| text (long) | — | no | no | Hidden in table, visible in detail |
-
-## Entity Attribute → SmartForm Field
-
-| Attribute Type | Component | Required from | Notes |
-|---|---|---|---|
-| string | Input | entity.required | — |
-| string (multiline) | TextArea | entity.required | rows: 4 |
-| enum | Select | entity.required | source: enum name |
-| FK:Entity | EntityLookup | entity.required | source: target entity, searchable. Component: `@/components/ui/EntityLookup`. NEVER plain text input for FK Guid fields. Backend API MUST support `?search=` param. See `smartstack-frontend.md` section 6. |
-| FK:User (person role) | `EntityLookup` | entity.required | searchable dropdown searching Users by name + email. `<EntityLookup apiEndpoint="/api/administration/users" mapOption={(user) => ({id: user.id, label: `${user.firstName} ${user.lastName}`, sublabel: user.email})} />` |
-| decimal | NumberInput | entity.required | — |
-| int | NumberInput | entity.required | — |
-| datetime | DatePicker | entity.required | — |
-| bool | Toggle | — | default: false |
-
-## Auto-Generated UI Components by featureType
-
-> **RULE:** Sections are functional, not CRUD-based. `create`/`edit` are separate pages with own URL routes (`/create` and `/:id/edit`). `detail` is a tabbed page reached from `list`.
-
-| featureType | Sections (functional) | permissionMode | List page includes | Form pages | Detail page tabs |
-|---|---|---|---|---|---|
-| data-centric | list | `crud` | grid, filters, create button | `/create` page, `/:id/edit` page | Infos, {relations} |
-| data-centric | (detail — implicit) | `inherit` | — | — | — |
-| workflow | list | `crud` | grid, filters, create button | `/create` page, `/:id/edit` page | Infos, {relations}, Historique |
-| workflow | approve | `custom:approve,reject` | — | — | — |
-| integration | list | `crud` | grid, filters, config button | `/create` page, `/:id/edit` page | Infos, Config, Logs |
-| reporting | dashboard | `read-only` | — | — | — |
-| full-module | list | `crud` | grid, filters, create button | `/create` page, `/:id/edit` page | Infos, {relations}, Historique |
-| full-module | dashboard | `read-only` | — | — | — |
-
-> **RULE:** `detail` is NEVER a section with its own permission set. It is always `sectionType: view`, `permissionMode: inherit`. Detail pages inherit permissions from their parent module.
-
-## Component Generation Rules
-
-1. **list section:** SmartTable with all non-long-text attributes as columns, actions = [view, edit, delete], defaultSort = { createdAt, desc }. Create button navigates to `/create` page. Edit action navigates to `/:id/edit` page.
-2. **create page (`/create` route):** SmartForm (full page) with all writable attributes as fields, component inferred from type. Back button + form + submit. NEVER a modal.
-3. **edit page (`/:id/edit` route):** Same form as create but pre-filled with entity data. Full page with back button. NEVER a modal or inline toggle.
-4. **detail page (from list click):** TabPanel with: Info tab (all attributes read-only + edit button navigating to `/:id/edit`), relation tabs (child SmartTable for each 1:N relationship), History tab (if auditable). See "Detail Page Tab Auto-Inference" below for exact rules.
-5. **dashboard section:** Trigger 3d (dashboard specification)
-
-## Detail Page Tab Auto-Inference
-
-> **RULE:** Every module with a `list` section MUST have a companion detail page. Tabs are inferred from multiple sources.
-
-### Tab sources (merged in order)
-
-| Priority | Source | Tabs generated |
-|----------|--------|----------------|
-| 1 | `coverageMatrix[].detailTabs` (from cadrage) | Exact tab names as specified by client |
-| 2 | Entity `relationships[]` where `type = "1:N"` | One tab per child relationship (SmartTable) |
-| 3 | Entity has `lifeCycles[]` | History tab (Timeline) |
-| 4 | Always present | Info tab (first position) |
-
-### Merge algorithm
-
-```
-detailTabs = []
-
-# 1. Always add Info tab first
-detailTabs.push({ code: "info", label: "Informations", content: DetailCard })
-
-# 2. If cadrage specified detailTabs, use those names
-IF coverageMatrix[module].detailTabs EXISTS:
-  FOR EACH tabName IN detailTabs:
-    IF tabName matches a 1:N relationship entity → SmartTable tab
-    ELIF tabName == "Historique"/"History" → Timeline tab
-    ELSE → custom DetailCard tab (contents TBD in step-03)
-
-# 3. If no cadrage tabs, auto-infer from relationships
-ELSE:
-  FOR EACH rel IN entity.relationships WHERE rel.type == "1:N":
-    detailTabs.push({ code: rel.target (kebab-case), label: rel.target (plural), content: SmartTable })
-
-# 4. Add History tab if auditable
-IF entity has lifeCycles:
-  detailTabs.push({ code: "history", label: "Historique", content: Timeline })
-```
-
-### Detail section auto-generation
-
-When auto-generating the detail section, create:
-- `specification.sections[]` entry with `code: "detail"`, `navigation: "hidden"`, route `/{app}/{module}/:id`
-- `specification.uiWireframes[]` entry with `section: "detail"` and ASCII mockup showing all tabs
-- Resources: `{module}-detail-header` (DetailHeader), `{module}-detail-tabs` (TabPanel), `{module}-info-card` (DetailCard), one `{module}-{relation}-grid` per relation tab, `{module}-history` (Timeline if auditable)
-
-### Detail page navigation wiring
-
-The detail page is NOT a sidebar entry. Navigation is handled by:
-- **From list**: row click action `navigate:detail` → `/{app}/{module}/{id}`
-- **Back button**: detail header → `/{app}/{module}`
-- **Route registration**: route MUST be registered in frontend routing with `:id` parameter
-
-## Status/Lifecycle Enhancement
-
-If entity has a status/enum field AND lifeCycles exists:
-- list section: status column gets `format: badge`, `colorMap: stateMachine:{Entity}`
-- list section: rowActions get `showWhen` conditions based on state machine transitions
-- detail section: add StatusBadge resource + transition action buttons
-
-Write auto-generated sections to `specification.sections[]` via `ba-writer.enrichSection()`
+# Specification: Auto-Inference Rules
+
+> Reference for step-03-specify.md — convention/override depth auto-generation from entity definitions.
+
+## Entity Attribute → SmartTable Column
+
+| Attribute Type | Column Format | Sortable | Filterable | Notes |
+|---|---|---|---|---|
+| string + unique | text | yes | yes | clickAction: navigate:detail |
+| string | text | yes | yes | — |
+| enum / status | badge | yes | yes (multi-select) | colorMap from lifeCycles if exists |
+| FK:Entity | text (join .name) | yes | yes (EntityLookup) | Display related entity name, filter via searchable EntityLookup |
+| decimal | currency | yes | no | — |
+| int | number | yes | no | — |
+| datetime | date-relative | yes | yes (date-range) | — |
+| bool | boolean | yes | yes (toggle) | — |
+| text (long) | — | no | no | Hidden in table, visible in detail |
+
+## Entity Attribute → SmartForm Field
+
+| Attribute Type | Component | Required from | Notes |
+|---|---|---|---|
+| string | Input | entity.required | — |
+| string (multiline) | TextArea | entity.required | rows: 4 |
+| enum | Select | entity.required | source: enum name |
+| FK:Entity | EntityLookup | entity.required | source: target entity, searchable. Component: `@/components/ui/EntityLookup`. NEVER plain text input for FK Guid fields. Backend API MUST support `?search=` param. See `smartstack-frontend.md` section 6. |
+| FK:User (person role) | `EntityLookup` | entity.required | searchable dropdown searching Users by name + email. `<EntityLookup apiEndpoint="/api/administration/users" mapOption={(user) => ({id: user.id, label: `${user.firstName} ${user.lastName}`, sublabel: user.email})} />` |
+| decimal | NumberInput | entity.required | — |
+| int | NumberInput | entity.required | — |
+| datetime | DatePicker | entity.required | — |
+| bool | Toggle | — | default: false |
+
+## Auto-Generated UI Components by featureType
+
+> **RULE:** Sections are functional, not CRUD-based. `create`/`edit` are separate pages with own URL routes (`/create` and `/:id/edit`). `detail` is a tabbed page reached from `list`.
+
+| featureType | Sections (functional) | permissionMode | List page includes | Form pages | Detail page tabs |
+|---|---|---|---|---|---|
+| data-centric | list | `crud` | grid, filters, create button | `/create` page, `/:id/edit` page | Infos, {relations} |
+| data-centric | (detail — implicit) | `inherit` | — | — | — |
+| workflow | list | `crud` | grid, filters, create button | `/create` page, `/:id/edit` page | Infos, {relations}, Historique |
+| workflow | approve | `custom:approve,reject` | — | — | — |
+| integration | list | `crud` | grid, filters, config button | `/create` page, `/:id/edit` page | Infos, Config, Logs |
+| reporting | dashboard | `read-only` | — | — | — |
+| full-module | list | `crud` | grid, filters, create button | `/create` page, `/:id/edit` page | Infos, {relations}, Historique |
+| full-module | dashboard | `read-only` | — | — | — |
+
+> **RULE:** `detail` is NEVER a section with its own permission set. It is always `sectionType: view`, `permissionMode: inherit`. Detail pages inherit permissions from their parent module.
+
+## Component Generation Rules
+
+1. **list section:** SmartTable with all non-long-text attributes as columns, actions = [view, edit, delete], defaultSort = { createdAt, desc }. Create button navigates to `/create` page. Edit action navigates to `/:id/edit` page.
+2. **create page (`/create` route):** SmartForm (full page) with all writable attributes as fields, component inferred from type. Back button + form + submit. NEVER a modal.
+3. **edit page (`/:id/edit` route):** Same form as create but pre-filled with entity data. Full page with back button. NEVER a modal or inline toggle.
+4. **detail page (from list click):** TabPanel with: Info tab (all attributes read-only + edit button navigating to `/:id/edit`), relation tabs (child SmartTable for each 1:N relationship), History tab (if auditable). See "Detail Page Tab Auto-Inference" below for exact rules.
+5. **dashboard section:** Trigger 3d (dashboard specification)
+
+## Detail Page Tab Auto-Inference
+
+> **RULE:** Every module with a `list` section MUST have a companion detail page. Tabs are inferred from multiple sources.
+
+### Tab sources (merged in order)
+
+| Priority | Source | Tabs generated |
+|----------|--------|----------------|
+| 1 | `coverageMatrix[].detailTabs` (from cadrage) | Exact tab names as specified by client |
+| 2 | Entity `relationships[]` where `type = "1:N"` | One tab per child relationship (SmartTable) |
+| 3 | Entity has `lifeCycles[]` | History tab (Timeline) |
+| 4 | Always present | Info tab (first position) |
+
+### Merge algorithm
+
+```
+detailTabs = []
+
+# 1. Always add Info tab first
+detailTabs.push({ code: "info", label: "Informations", content: DetailCard })
+
+# 2. If cadrage specified detailTabs, use those names
+IF coverageMatrix[module].detailTabs EXISTS:
+  FOR EACH tabName IN detailTabs:
+    IF tabName matches a 1:N relationship entity → SmartTable tab
+    ELIF tabName == "Historique"/"History" → Timeline tab
+    ELSE → custom DetailCard tab (contents TBD in step-03)
+
+# 3. If no cadrage tabs, auto-infer from relationships
+ELSE:
+  FOR EACH rel IN entity.relationships WHERE rel.type == "1:N":
+    detailTabs.push({ code: rel.target (kebab-case), label: rel.target (plural), content: SmartTable })
+
+# 4. Add History tab if auditable
+IF entity has lifeCycles:
+  detailTabs.push({ code: "history", label: "Historique", content: Timeline })
+```
+
+### Detail section auto-generation
+
+When auto-generating the detail section, create:
+- `specification.sections[]` entry with `code: "detail"`, `navigation: "hidden"`, route `/{app}/{module}/:id`
+- `specification.uiWireframes[]` entry with `section: "detail"` and ASCII mockup showing all tabs
+- Resources: `{module}-detail-header` (DetailHeader), `{module}-detail-tabs` (TabPanel), `{module}-info-card` (DetailCard), one `{module}-{relation}-grid` per relation tab, `{module}-history` (Timeline if auditable)
+
+### Detail page navigation wiring
+
+The detail page is NOT a sidebar entry. Navigation is handled by:
+- **From list**: row click action `navigate:detail` → `/{app}/{module}/{id}`
+- **Back button**: detail header → `/{app}/{module}`
+- **Route registration**: route MUST be registered in frontend routing with `:id` parameter
+
+## Status/Lifecycle Enhancement
+
+If entity has a status/enum field AND lifeCycles exists:
+- list section: status column gets `format: badge`, `colorMap: stateMachine:{Entity}`
+- list section: rowActions get `showWhen` conditions based on state machine transitions
+- detail section: add StatusBadge resource + transition action buttons
+
+Write auto-generated sections to `specification.sections[]` via `ba-writer.enrichSection()`

package/templates/skills/business-analyse-design/steps/step-01-screens.md

@@ -9,7 +9,7 @@ next_step: steps/step-02-wireframes.md
 
 ## Objective
 
-For each module, define all sections and resources with detailed interface specifications: SmartTable columns, SmartForm fields with types, SmartDashboard KPIs, SmartKanban columns.
+For each module, define all sections and resources with detailed interface specifications: SmartTable columns, SmartForm fields with types, SmartDashboard KPIs, SmartKanban columns, SmartFilter filters, SmartCard layouts.
 
 ## Context Recovery
 
@@ -54,180 +54,54 @@ Load via ba-reader:
 
 For each module, transform anticipatedSections into detailed screen specs.
 
-**SmartTable resource:**
-```json
-{
-  "code": "{entity-plural}-grid",
-  "type": "SmartTable",
-  "label": "Grille des {entity-plural}",
-  "columns": [
-    { "field": "code", "label": "Code", "type": "text", "sortable": true, "width": "100px" },
-    { "field": "fullName", "label": "Nom", "type": "text", "sortable": true },
-    { "field": "department.name", "label": "Departement", "type": "lookup", "filterable": true },
-    { "field": "status", "label": "Statut", "type": "badge", "filterable": true, "options": ["Active", "Inactive"] }
-  ],
-  "actions": ["create", "edit", "delete", "export"],
-  "filters": [
-    { "field": "department", "type": "select", "label": "Departement" },
-    { "field": "status", "type": "select", "label": "Statut" }
-  ],
-  "permission": "{AppCode}.{ModuleCode}.Read",
-  "rowActions": ["edit", "view-detail"],
-  "defaultSort": { "field": "code", "direction": "asc" },
-  "pageSize": 25
-}
-```
+> **SmartComponent templates & canonical output format:**
+> Load: `/references/smartcomponents-templates.md`
+> - All SmartComponent JSON examples (SmartTable, SmartForm, SmartDashboard, SmartKanban, SmartFilter, SmartCard)
+> - Canonical screens.json output format with `sections[]` wrapper
 
-**SmartForm resource:**
-```json
-{
-  "code": "{entity}-form",
-  "type": "SmartForm",
-  "label": "Fiche {entity}",
-  "tabs": [
-    {
-      "label": "Informations",
-      "fields": [
-        { "field": "firstName", "label": "Prenom", "type": "text", "required": true, "col": 6 },
-        { "field": "lastName", "label": "Nom", "type": "text", "required": true, "col": 6 },
-        { "field": "email", "label": "Email", "type": "email", "required": true, "validation": "unique" },
-        { "field": "department", "label": "Departement", "type": "lookup", "entity": "Department", "required": true },
-        { "field": "status", "label": "Statut", "type": "select", "options": ["Active", "Inactive"], "readonly": "onCreate" }
-      ]
-    },
-    {
-      "label": "Contrats",
-      "type": "subtable",
-      "entity": "Contract",
-      "columns": ["contractType", "startDate", "endDate", "status"]
-    }
-  ],
-  "permission": "{AppCode}.{ModuleCode}.Update"
-}
-```
+### 3. Column/Field Type Mapping & Business Rules
 
-**SmartDashboard resource:**
-```json
-{
-  "code": "{module}-dashboard",
-  "type": "SmartDashboard",
-  "label": "Tableau de bord {module}",
-  "kpis": [
-    { "label": "Total actifs", "value": "count(status=Active)", "icon": "users", "color": "primary" },
-    { "label": "En conge", "value": "count(status=OnLeave)", "icon": "calendar", "color": "warning" }
-  ],
-  "charts": [
-    { "type": "pie", "label": "Repartition par departement", "dataSource": "employees", "groupBy": "department" },
-    { "type": "bar", "label": "Evolution des effectifs", "dataSource": "employees", "groupBy": "hireDate.year" }
-  ],
-  "permission": "{AppCode}.{ModuleCode}.Read"
-}
-```
+Map entity attribute types to UI component types and apply business rules for computed fields, lookups, and workflows.
 
-**SmartKanban resource:**
-```json
-{
-  "code": "{entity}-kanban",
-  "type": "SmartKanban",
-  "label": "Kanban {entity}",
-  "statusField": "status",
-  "columns": [
-    { "value": "Draft", "label": "Brouillon", "color": "gray" },
-    { "value": "Submitted", "label": "Soumis", "color": "blue" },
-    { "value": "Approved", "label": "Approuve", "color": "green" }
-  ],
-  "cardFields": ["code", "assignee", "dueDate"],
-  "permission": "{AppCode}.{ModuleCode}.Read"
-}
-```
-
-### 3. Column/Field Type Mapping
-
-Map entity attribute types to UI component types:
-
-| Entity type | SmartTable type | SmartForm type |
-|-------------|----------------|----------------|
-| `string` | `text` | `text` |
-| `int`, `decimal` | `number` | `number` |
-| `date` | `date` | `datepicker` |
-| `datetime` | `datetime` | `datetimepicker` |
-| `bool` | `boolean` | `checkbox` |
-| `enum` | `badge` | `select` |
-| `guid` (FK) | `lookup` | `lookup` |
-| `text` (long) | `text` (truncated) | `textarea` |
+> **Type mapping, readonly rules, computed attribute handling, lookup detection, and workflow auto-detection:**
+> Load: `/references/screens-type-mapping.md`
+> - Column/field type mapping table
+> - Computed attribute rules (readonly on edit, absent on create)
+> - Readonly field rules (boolean only, no string values)
+> - SmartForm section location rules (list vs detail)
+> - Lookup field entity requirement (SmartForm + SmartFilter)
+> - SmartKanban auto-detection rule for workflow entities (status enum >= 3 options)
+> - SmartFilter mandatory rule for list sections with SmartTable
 
 ### 4. Write screens.json
 
-For each module, write via ba-writer:
+For each module, write via ba-writer using the canonical `sections[]` format:
 
-> **CANONICAL FORMAT (MANDATORY):** screens.json MUST use the `sections[]` wrapper format below.
-> Keys MUST be `sectionCode` and `sectionLabel` (not `id`/`displayName`/`code`/`label`).
-> Each section MUST have a `resources[]` array with typed resource objects (SmartTable, SmartForm, etc.).
-> The flat `screens[]` format (one object per screen with componentType at top level) is **DEPRECATED**.
+> **CANONICAL FORMAT (MANDATORY):** screens.json MUST use the `sections[]` wrapper with `sectionCode`, `sectionLabel`, and `resources[]`.
+> The flat `screens[]` format is **DEPRECATED**.
 > All downstream consumers (business-analyse-html, business-analyse-handoff, business-analyse-develop) expect `sections[]`.
+>
+> Load full format with examples: `/references/smartcomponents-templates.md`
 
-```json
-{
-  "sections": [
-    {
-      "sectionCode": "list",
-      "sectionLabel": "Liste des employes",
-      "resources": [
-        {
-          "code": "employees-grid",
-          "type": "SmartTable",
-          "label": "Grille des employes",
-          "columns": [ /* ... */ ],
-          "filters": [ /* ... */ ],
-          "actions": ["create", "export"],
-          "permission": "HumanResources.Employees.Read"
-        }
-      ]
-    },
-    {
-      "sectionCode": "detail",
-      "sectionLabel": "Fiche employe",
-      "resources": [
-        {
-          "code": "employee-form",
-          "type": "SmartForm",
-          "label": "Fiche employe",
-          "tabs": [ /* ... */ ],
-          "actions": ["save", "cancel"],
-          "permission": "HumanResources.Employees.Update"
-        }
-      ]
-    },
-    {
-      "sectionCode": "dashboard",
-      "sectionLabel": "Tableau de bord",
-      "resources": [
-        {
-          "code": "employees-dashboard",
-          "type": "SmartDashboard",
-          "label": "Tableau de bord RH",
-          "kpis": [ /* ... */ ],
-          "charts": [ /* ... */ ],
-          "permission": "HumanResources.Employees.Read"
-        }
-      ]
-    }
-  ]
-}
-```
+Update `index.json` with screens.json hash and status.
 
-> **Key naming:** Use `sectionCode` (not `id`, `code`). Use `sectionLabel` (not `displayName`, `label`).
-> Resource `type` must be one of: `SmartTable`, `SmartForm`, `SmartDashboard`, `SmartKanban`, `SmartCard`, `SmartFilter`.
+## Validation Summary
 
-Update `index.json` with screens.json hash and status.
+Run POST-CHECK validation after writing ALL screens.json files:
 
-## Validation
+> Load: `/references/screens-post-check.md`
+> - Complete validation script (10 checks: 8 BLOCKING + 2 WARNING)
+> - CHECK 1: Section resources (at least 1 per section)
+> - CHECK 2-3: Entity + permission references
+> - CHECK 4-5: SmartTable/SmartForm attribute references
+> - CHECK 6: Lookup field entity requirement
+> - CHECK 7: Computed attribute readonly handling
+> - CHECK 8: SmartFilter lookup entity requirement
+> - CHECK 9: SmartFilter mandatory for list sections with SmartTable
+> - CHECK 10: SmartKanban auto-detection for workflow entities
 
-- [ ] Every resource has a valid `permission` referencing permissions.json
-- [ ] Every SmartTable column references a valid entity attribute
-- [ ] Every SmartForm field references a valid entity attribute
-- [ ] Every section has at least one resource
-- [ ] Every module has at least one section
+**BLOCKING** errors must be fixed before proceeding to step-02.
+**WARNING** errors should be reviewed but do not block progress.
 
 ## Transition
 

package/templates/skills/business-analyse-design/steps/step-02-wireframes.md

@@ -29,8 +29,6 @@ For each resource in each section, generate a wireframe object:
 **SmartTable wireframe:**
 ```json
 {
-  "screen": "{sectionCode}-{resourceCode}",
-  "section": "{sectionCode}",
   "mockupFormat": "ascii",
   "mockup": "+----------------------------------------------------------+\n| [Departement v] [Statut v]        [+ Nouveau employe]    |\n+------+----------------+---------------+--------+---------+\n| Code | Nom complet    | Departement   | Statut | Actions |\n+------+----------------+---------------+--------+---------+\n| E001 | Dupont Marie   | RH            | Actif  | [E] [S] |\n| E002 | Martin Pierre  | IT            | Conge  | [E] [S] |\n+------+----------------+---------------+--------+---------+\n| << 1 2 3 ... 10 >>                           25 par page |\n+----------------------------------------------------------+",
   "elements": ["FilterBar", "DataGrid", "Pagination", "ActionButtons"],
@@ -52,8 +50,6 @@ For each resource in each section, generate a wireframe object:
 **SmartForm wireframe:**
 ```json
 {
-  "screen": "{sectionCode}-{resourceCode}",
-  "section": "{sectionCode}",
   "mockupFormat": "ascii",
   "mockup": "+----------------------------------------------------------+\n| Fiche Employe                              [Sauvegarder] |\n+----------------------------------------------------------+\n| [Informations] [Contrats] [Documents]                    |\n+----------------------------------------------------------+\n| Prenom:      [_______________]  Nom: [_______________]   |\n| Email:       [_______________]  Tel: [_______________]   |\n| Departement: [Selectionnez v ]  Poste: [_____________]   |\n| Date embauche: [__ /__ /____]   Statut: [Actif      v]  |\n+----------------------------------------------------------+",
   "elements": ["TabBar", "FormFields", "SaveButton"],
@@ -74,8 +70,6 @@ For each resource in each section, generate a wireframe object:
 **SmartDashboard wireframe:**
 ```json
 {
-  "screen": "{sectionCode}-{resourceCode}",
-  "section": "{sectionCode}",
   "mockupFormat": "ascii",
   "mockup": "+----------------------------------------------------------+\n| Tableau de bord RH                                       |\n+-------------+-------------+-------------+----------------+\n| Total actifs| En conge    | Nouveaux    | Taux rotation  |\n|    156      |     12      |      8      |    3.2%        |\n+-------------+-------------+-------------+----------------+\n| [Repartition par dept (pie)]  [Evolution effectifs (bar)]|\n+----------------------------------------------------------+",
   "elements": ["KPICards", "PieChart", "BarChart"],
@@ -109,7 +103,6 @@ For each module, update screens.json to embed wireframes at the resource level:
           "type": "SmartTable",
           "columns": [ /* ... */ ],
           "wireframe": {
-            "screen": "list-employees-grid",
             "mockupFormat": "ascii",
             "mockup": "...",
             "elements": [...],
@@ -141,6 +134,13 @@ Write via ba-writer for each module. Update index.json hashes.
 | `layout` | object | Layout type and regions |
 | `permissionsRequired` | string[] | Permission paths needed |
 
+> **INTERDICTION:** `componentMapping` MUST use the canonical object format:
+> ```json
+> [{ "wireframeElement": "FilterBar", "reactComponent": "SmartFilter" }]
+> ```
+> The shorthand `[{ "FilterBar": "SmartFilter" }]` is **NOT valid** and will break downstream consumers.
+> Each entry MUST have both `wireframeElement` and `reactComponent` keys.
+
 ## Validation
 
 - [ ] Every resource has a wireframe object
@@ -148,6 +148,7 @@ Write via ba-writer for each module. Update index.json hashes.
 - [ ] Every wireframe has `elements[]` and `componentMapping[]`
 - [ ] Wireframe `permissionsRequired` references valid permission paths
 - [ ] All wireframes have `mockupFormat` set ("ascii" or "html")
+- [ ] Every `componentMapping` entry uses canonical format (`wireframeElement` + `reactComponent` keys, no shorthand)
 
 ## Transition