Grid lines separating clock cycles. Placed relative to the FIRST SHOWN cycle, like the cursor highlight beside them, because the SVG they are drawn in starts at x = 0 whatever the view is scrolled to (`viewBoxMinX`). Drawing them at the absolute cycle number instead put them StartCycle cycles to the right of where they belong - off the end of the waveforms, and only visible at all because that SVG does not clip (it must not, or a tooltip could not run out over the columns beside it). Scrolled to cycle 0 they were right, which is why this survived: what it looked like further along was a grid that came and went with the scroll position.

Calculate the necessary with of the naes column based on the longest name.

The height the waveform table wants: one row per waveform DRAWN, which is a selected wave that WaveDetails still holds, plus the row of clock cycle numbers above them.

Props for Checkbox.Input

Style of checkboxes

List of Style properties for clock cycle button

Style for clock cycle buttons

Style for inner clock cycle buttons (buttons to move by one clock cycle)

Props for clock cycle text Input field No AutoFocus. React focuses an autofocused element every time it mounts, so this box took the keyboard whenever the viewer's control row was rebuilt - on Start, and after a cursor move or a zoom. The keyboard then belonged to a text field, and the Left and Right arrows that step the cursor stopped working until something else was clicked. You click into a box to type in it; SelectedComponentView's name box says the same thing for the same reason.

Style for clock cycle text Input field

Style for left-most clock cycle button

Props for row of clock cycle numbers

Style for right-most clock cycle button

Style for clock cycle number row

Props for text in clock cycle row

Style of line separating clock cycles

Controls the background highlighting of which clock cycle is selected

Props for HTML Details element

Right-most visible clock cycle.

Style for showing error messages in waveform simulator.

Eye, drawn to the size of the box it is given. Marks the button which shows a waveform's component on the schematic.

Style for name label

Prop for Level.left in name row.

Style for Bulma level element in name row

Background for the names column, or for one row of it. The strip at the left, where the view button sits, is painted as pane rather than as column, so that the button reads as standing outside the line the labels start on - which is what it is. The delete cross is inside that line, because it belongs to the label. Any line along the row starts at that same place rather than running out into the strip. It is painted as a second background layer, since a border cannot be inset. The line is given as thickness, colour, and whether it goes along the top of the element rather than the bottom.

Props for names column

Style properties for names column

The line under the top row of the values column, which has no strip to keep clear of.

Convert XYPos list to string

Style for A HTML element in radixTabs

Props for radix tabs

Style for radixTabs

Style for row in ramTable

Props for Bulma Level element for single ramTable

Style for each row of ramTable

Props for Bulma Level element for ramTables

The RAM tables within that pane: at most half of it, less if they need less, scrolling within whatever they get. Nothing at all when no RAM is selected, which is what leaves the waveforms the whole pane.

Style for left-most clock cycle button

Button style for scrollbar's right button. Left button uses clkCycleLeftStyle.

Props for selectRamButton when no RAMs are selectable

Props for selectWavesButton

Props for selectWavesButton when no waves are selectable

The waves the viewer draws: those the user has selected that the simulation still holds. All three columns are built from this, so it is also what a row number means anything against.

Sets or clears a subset of ShowGroupDetail

Open or close nodes of the wave selector's hierarchy, each named by its path of design-time sheet names. Opening one closes any other node of the same sheet. A sheet that several routes reach appears in several places, and showing more than one of them at once is the multiplying that collapsing the hierarchy is there to prevent. Where only one route reaches a sheet this is vacuous - there is only one such node - so the rule needs no test for which kind of sheet it is.

Change Tooltip SVG element based on mouse position.

The pane below the controls, holding the waveforms, their horizontal scrollbar and the RAM tables. It is the space left under the controls, and it NEVER scrolls: the waveforms scroll inside it, and so do the RAM tables when there are any. It used to be sized from its CONTENT - the height of the whole selection, or the whole window when RAMs were shown - so a selection taller than the pane made the pane taller than the window, and the tab body scrolled to reach the rest. That is where the second scrollbar came from: an outer one that moved the controls off the top of the screen, and an inner one that moved the waveforms.

Style for waveforms only path of viewer

Props for displaying values on non-binary waves by starting position.

Width of one clock cycle.

Props for HTML Summary element True if this is a summary element, false if it is a details element. isSummary is used to determine if the click handler is used.

SVG group element for tooltip. The props of the tooltip, as well as its text, are set in the function changeToolTip. Initial props make it invisible.

Style for top half of waveform simulator (instructions and buttons)

Empty row used in namesColumn and valuesColumn. Shifts these down by one to allow for the row of clk cycle numbers in waveformsColumn. The background carries the line under the row: the names column insets that line past the view button strip, the values column has no strip and draws it as a plain border.

Style for top row of buttons. Each is as wide as its own label needs. It used to be one fixed width for a shipped build and a wider one for a development build - where the button that starts a simulation also names the simulator it will start - which made every OTHER button in the row that much fatter to hold a label none of them has, ran the row past the edge of the pane, and left the development build looking nothing like the one people use.

Style for value label

Style properties for values column

Left-most coordinate of the SVG viewbox.

Total width of the SVG viewbox.

Style of the button which shows a waveform's component on the schematic. It sits in a slot of its own at the outer edge of the name row, beyond the delete icon, so that it reads as an extra beside the label rather than as one of the label's own controls. Green when the component cannot be seen and grey when it is already in front of the user; shown only while the row is hovered.

Style for viewWaveSim

Style of polyline used to draw waveforms

Props for each row in waveform column

Style for each row in waveform column

Style for rows in waveforms column

List of Style properties for columns in wave viewer.

Props for waveform column rows

Style for waveforms column

The waveforms within that pane: whatever height is left after the scrollbar and the RAM tables, scrolling within it. With no RAMs that is all of it. `min-height: 0` is what lets it be SHORTER than its content: a flex item's floor is its content by default, which would push the pane out again and put the outer scrollbar back.