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

[LeighFinegold]

Description

Fix MDX compilation error when metadata contains arrays of primitive values.

When relationships have metadata with array values (e.g., "operations": ["add", "subtract", "multiply", "divide"]), the generated documentation site fails to compile with:

Expected a closing tag for `<td>` before the end of `paragraph`

This was caused by array values being rendered with newlines inside <td> elements, which MDX interprets as paragraph breaks.

The fix renders primitive arrays inline with comma separators: add, subtract, multiply, divide

Example in #2080 now renders appropriately

Type of Change

• 🐛 Bug fix (non-breaking change which fixes an issue)

Affected Components

• CALM Widgets (calm-widgets/)
• Vscode (calm-plugins\vsscode)
• Cli (cli)

Testing

• I have tested my changes locally
• I have added/updated unit tests
• All existing tests pass

Added new test fixture metadata-primitive-array to verify MDX-safe array rendering.

Checklist

• My commits follow the conventional commit format
• I have updated documentation if necessary
• I have added tests for my changes (if applicable)
• My changes follow the project's coding standards

[markscott-ms]

Why is the choice , and not <br/>?

[LeighFinegold]

If we want to treat this a list separated by new line, I would recommend then we build an inner list and leverage the list widget then.

<br/> has no semantic reasoning

[rocketstack-matt]

If this renders comprehensibly with comma, I'd suggest we go with it and raise a feature request is we want to add a list widget.

[Copilot]

Pull request overview

This PR fixes an MDX compilation error that occurs when CALM architecture metadata contains arrays of primitive values. The fix ensures primitive arrays are rendered inline with comma separators instead of with newlines, preventing MDX from interpreting the content as paragraph breaks within <td> elements.

Changes:

• Modified table-vertical.html to render primitive arrays inline with comma-space separators
• Modified row-template.html to add commas after primitive array elements
• Added test fixture metadata-primitive-array and E2E test for the new behavior
• Updated expected outputs for existing tests to reflect comma separators

Reviewed changes

Copilot reviewed 10 out of 11 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
calm-widgets/src/widgets/table/table-vertical.html	Added inline rendering for primitive arrays with comma-space separators; contains a critical bug (using cellValue instead of this on line 20)
calm-widgets/src/widgets/table/row-template.html	Added comma separators for primitive arrays (preserves newlines)
calm-widgets/test-fixtures/table-widget/metadata-primitive-array/*	New test fixture demonstrating MDX-safe inline rendering
calm-widgets/src/widgets.e2e.spec.ts	New E2E test for primitive array rendering
cli/test_fixtures/template/expected-output/widget-tests/*	Updated expected outputs to include comma separators
calm-widgets/test-fixtures/combined-widgets/comprehensive-documentation/expected.md	Updated expected output to include comma separators
calm-plugins/vscode/package.json	Version bump (appears unrelated to this PR)
package-lock.json	Lock file update for VSCode plugin version

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.