Event Description Text Overflow in State Diagram UI - Safari

[mbushpilot2b]

Description:

When creating or viewing state diagrams within the interface, it is observed that the description text is overflowing out of the event boxes, thereby obscuring the full text and affecting the readability and overall user experience.

Machine Example:

Stately.ai Link

Environment:

Browser (e.g., Chrome/Firefox/Safari): Safari
Operating System (e.g., macOS/Windows/Linux): macOS

Steps to Reproduce:

1. Go to the 'Test Project' within the state diagram interface.
2. Click on any state to view its associated events and descriptions.
3. Observe that the description text for events, such as 'SLEEP', 'FETCH', 'STAND_UP', and 'GIVE_TREAT', overflows the boundaries of the event box.

Expected Behavior:

The text within the event boxes should be contained and fully visible, wrapping appropriately or providing a scrolling mechanism if the text exceeds the box size.

Actual Behavior:

The description text extends beyond the edge of the event boxes, making it difficult to read the full description without a workaround.

Reproducibility:

Always/Intermittently (choose one based on observation): Always

Screenshots: