fix(calm-widgets): render primitive arrays inline with comma separator list for for MDX compatibility (#2080)

calm-plugins/vscode/package.json

@@ -2,7 +2,7 @@
     "name": "calm-vscode-plugin",
     "displayName": "CALM",
     "description": "Live-visualize CALM architecture models, validate, and generate docs.",
-    "version": "0.4.1",
+    "version": "0.4.2",
     "publisher": "FINOS",
     "homepage": "https://calm.finos.org",
     "repository": {

calm-widgets/src/widgets.e2e.spec.ts

@@ -96,6 +96,15 @@ describe('Widgets E2E - Handlebars Integration', () => {
 
             expectToBeSameIgnoringLineEndings(result, expected);
         });
+
+        it('renders primitive arrays inline with comma separator (MDX-safe)', () => {
+            const { context, template, expected } = fixtures.loadFixture('table-widget', 'metadata-primitive-array');
+
+            const compiledTemplate = handlebars.compile(template);
+            const result = compiledTemplate(context);
+
+            expectToBeSameIgnoringLineEndings(result, expected);
+        });
     });
 
     describe('List Widget', () => {

calm-widgets/src/widgets/table/row-template.html

@@ -18,7 +18,7 @@
         {{> table-template.html rows=(objectEntries this) headers=false flatTable=false hasRows=true isNested=true}}
 
         {{else}}
-        {{this}}
+        {{this}}{{#unless @last}}, {{/unless}}
         {{/if}}
         {{/each}}
         {{else}}

calm-widgets/src/widgets/table/table-vertical.html

@@ -18,8 +18,7 @@
         {{> table-template.html rows=(objectEntries cellValue) headers=false flatTable=false hasRows=true isNested=true}}
         {{else if (isArray cellValue)}}{{#each cellValue}}{{#if (isObject this)}}
         {{> table-template.html rows=(objectEntries this) headers=false flatTable=false hasRows=true isNested=true}}
-        {{else}}{{this}}
-        {{/if}}{{/each}}{{else}}{{cellValue}}{{/if}}</td>
+        {{else}}{{this}}{{#unless @last}}, {{/unless}}{{/if}}{{/each}}{{else}}{{cellValue}}{{/if}}</td>
 </tr>
 {{/with}}
 {{/with}}

calm-widgets/test-fixtures/combined-widgets/comprehensive-documentation/expected.md

@@ -184,8 +184,8 @@
                         <tr>
                             <td><b>Value</b></td>
                             <td>
-                                Product Catalog
-                                Inventory Management
+                                Product Catalog, 
+                                Inventory Management, 
                                 Price Calculation
                             </td>
                         </tr>
@@ -347,8 +347,8 @@
                         <tr>
                             <td><b>Value</b></td>
                             <td>
-                                Order Processing
-                                Payment Integration
+                                Order Processing, 
+                                Payment Integration, 
                                 Order Tracking
                             </td>
                         </tr>

calm-widgets/test-fixtures/table-widget/metadata-primitive-array/context.json

@@ -0,0 +1,7 @@
+{
+  "metadata": {
+    "operations": ["add", "subtract", "multiply", "divide"],
+    "tags": ["payment", "financial", "api"],
+    "version": "1.0.0"
+  }
+}

calm-widgets/test-fixtures/table-widget/metadata-primitive-array/expected.md

@@ -0,0 +1,24 @@
+<div class="table-container">
+    <table>
+        <thead>
+        <tr>
+            <th>Key</th>
+            <th>Value</th>
+        </tr>
+        </thead>
+        <tbody>
+        <tr>
+            <th>Operations</th>
+            <td>add, subtract, multiply, divide</td>
+        </tr>
+        <tr>
+            <th>Tags</th>
+            <td>payment, financial, api</td>
+        </tr>
+        <tr>
+            <th>Version</th>
+            <td>1.0.0</td>
+        </tr>
+        </tbody>
+    </table>
+</div>

calm-widgets/test-fixtures/table-widget/metadata-primitive-array/template.hbs

@@ -0,0 +1 @@
+{{table metadata orientation="vertical"}}

cli/test_fixtures/template/expected-output/widget-tests/sad-test.md

@@ -942,8 +942,8 @@ The system follows a microservices architecture pattern deployed on Kubernetes,
                                                         <tr>
                                                             <td><b>Nodes</b></td>
                                                             <td>
-                                                                load-balancer
-                                                                attendees
+                                                                load-balancer, 
+                                                                attendees, 
                                                                 attendees-store
                                                             </td>
                                                         </tr>

cli/test_fixtures/template/expected-output/widget-tests/table-test.md

@@ -911,8 +911,8 @@ url-to-local-file-mapping: ../../../getting-started/url-to-local-file-mapping.js
                                                         <tr>
                                                             <td><b>Nodes</b></td>
                                                             <td>
-                                                                load-balancer
-                                                                attendees
+                                                                load-balancer, 
+                                                                attendees, 
                                                                 attendees-store
                                                             </td>
                                                         </tr>