Fix: Syntax error in class diagrams with nested generics and inline type definitions

[hadileee]

Description

The class diagram renderer throws a Syntax error in text when attempting to define a class with an inline nested generic type (e.g., class People ListListPerson~~). Additionally, the parser in version 11.13.0 struggles to differentiate between nested generic closings (~~) and markdown strike-through tokens, leading to a rendering crash in the classchart.html demo file.

Steps to reproduce

1. Open the packages/mermaid/demos/classchart.html file in the development environment.

2. Navigate to the Person and People class diagram section.

3. Observe that the diagram fails to render, showing a "Syntax error in text" message.

4. Note that the error occurs immediately after the Fruit namespace diagrams.

Screenshots

Before:

After:

Code Sample

<!-- Original broken code -->

<pre class="mermaid">
    classDiagram
      class Person {
        +ID : Guid
        +FirstName : string
        +LastName : string
        -privateProperty : string
        #ProtectedProperty : string
        ~InternalProperty : string
        ~AnotherInternalProperty : List~List~string~~
      }
      class People List~List~Person~~
    </pre>
    <hr />
    <pre class="mermaid">
    classDiagram
      namespace Company.Project.Module {
        class GenericClass~T~ {
          +addItem(item: T)
          +getItem() T
        }
      }
    </pre>
    
<!-- Fixed code -->

<pre class="mermaid">
    classDiagram
      class Person {
        +ID : Guid
        +FirstName : string
        +LastName : string
        -privateProperty : string
        #ProtectedProperty : string
        ~InternalProperty : string
        ~AnotherInternalProperty : List~List~string~ ~
      }
      class People {
        +List~List~Person~~ members
      }
    </pre>
    <hr />
    <pre class="mermaid">
    classDiagram
      namespace Company.Project.Module {
        class GenericClass~T~ {
          +addItem(item: T)
          +getItem() : T
        }
      }
    </pre>

Setup

Mermaid Version: 11.13.0

Browser: (Chrome

OS: Windows

Suggested Solutions

The issue was caused by the parser's inability to handle the space-separated class alias on a single line.

• Class Definition: Changed class People ListListPerson~~ to a standard block definition class People { ... }.

• Generic Tokenization: Added a whitespace between nested tildes (~ ~) in AnotherInternalProperty to prevent the parser from misinterpreting the closing generics as a strike-through symbol.

• Method Syntax: Added missing colons to method return types ( +getItem() : T) to comply with the stricter Langium parser requirements in the current monorepo.

Additional Context

This error was identified while testing the classchart.html file within the monorepo using pnpm run dev. Fixing these syntax triggers allows the full suite of demo diagrams to render correctly.

[Sigmabrogz]

I'd like to work on this and fix the syntax error in the demo file as you suggested!

[hadileee]

I appreciate you looking into this! I actually pushed a fix and opened a PR for that syntax error right after reporting it, as mentioned above. Thanks for the follow-up!

[ashishjain0512]

@hadileee Thanks for reporting this. We have approved the issue.

I have also looked at your PR(#7481). While it does fix it in the short run in the documentation, we would like to explore a proper fix in the jison parser to allow the original code to work, rather than updating the example.

[theolivenbaum]

FYI - I also noticed that other files in the demos folder seem to be also broken: