It's useful to be able to see how an action interacts with the State. However, the current visualization tries to display the action's name, reads, and writes on the same line, which rapidly increases the figure's size and reduces readability.

For example, this only has 1 to 3 reads + writes:

Proposed solution

Make reads start on a newline and writes on another newline. We will need to indicate if it's a read or write for the first item of each section. Here are some examples:

No reads/writes

action_name

Only reads

action_name
reads:
  read_1
  read_2

Only writes

action_name
writes:
   write_1
   write_2

With reads and writes

action_name
reads:
  read_1
writes:
  write_1

Keeping the same font for all items helps with readability. The value for action_name could be bolded