Panel Editor

The editor is the main screen in ElectroBoard, where you design your electrical panel. Here you add devices, configure the connections between them, set cables, and see check results in real time.

---

Panel navigation#

The working area is an SVG canvas with DIN rails and devices. You can freely pan and zoom it.

On a computer:

• Mouse wheel — zoom to the cursor position
• Left mouse button + drag on the background — pan
• The current zoom is shown in the toolbar as a percentage

On mobile:

• Pinch (two fingers) — zoom
• One finger on the background — pan

Adding devices#

New devices are added by dragging them from the palette onto a DIN rail.

On a computer:

1. Open the palette on the left (visible by default)
2. Use the search at the top of the palette — it works by name, abbreviation, description, device parameters, and hints (for example, "Modbus", "gG", "RS485")
3. Or find the device you need in the relevant group — each group has a coloured abbreviation and a badge with the device count
4. Press and drag it onto the panel rail — the coloured left-border on the card helps you spot the right type quickly
5. Release at the desired position — the device "snaps" to the nearest free slot

On mobile:

1. Tap "⚡ Add module" to open the palette
2. Long-press the device for 300 ms — you will feel a vibration
3. Drag it onto the rail

Devices can be dragged between rails and between positions on the same rail.

Cloning (Ctrl+drag): hold Ctrl while dragging — the device is copied with all its parameters (rating, curve, cable, consumers) into the target slot.

[screenshot: dragging a device from the palette onto a rail]

Moving devices — Smart DnD#

The drag-and-drop system in ElectroBoard automatically picks the best way to place a device depending on the situation:

Free slot → Placement#

If the target slot is free, the device simply moves there. Highlighted green.

Occupied slot → Insert with shift#

If the target slot is occupied, the system automatically inserts the device, shifting its neighbours — this works both on the same rail and when moving between rails:

• Adjacent devices shift automatically to make room
• During the drag the devices immediately show their new positions — you see the result before releasing
• A semi-transparent copy of the device being moved appears on the target slot
• If there is no room to the right, the system automatically tries to shift to the left

Cannot place → Blocked#

If there is no room for a shift, the device returns to its starting position. Highlighted red.

[screenshot: insert with shift — blue line and highlighted modules]

Selecting and configuring a device#

Click a device to select it. A properties panel appears on the right with sections:

• General — name, rating, extra parameters (characteristic, RCD type, etc.)
• Connection — connection variant (1P/2P/3P/4P), phase, width in modules, feed direction
• Hierarchy — parent device, reserve source (for a transfer switch/changeover), N bar, connected devices
• Control — the contactor for the control circuit (for contactor switches, time relays, voltage relays, multifunction relays, a smart controller)
• Loading — calculated load, consumers, cable, room zone (only for devices with an outgoing cable — MCB, RCBO, AFDD, dimmer, fuse)
• Extra — notes

The properties panel does not close on a background click — only via the × button.

Sections can be collapsed by clicking the header. The collapsed/expanded state is remembered per device type — if you collapse "Extra" on breakers, it stays collapsed on all subsequent breakers, but does not affect other types.

Consumers#

Click "Consumers →" in the properties panel to open a drawer with the consumer list. Here you can:

• Add consumers from the catalog (29 presets across 5 categories: kitchen, bathroom, lighting, HVAC, sockets)
• Add a custom consumer with arbitrary parameters
• Change the quantity, power, cosφ, and demand factor
• See the calculated load in real time

The consumers drawer replaces the properties panel (it does not overlay it) — close it via ← or ×.

Device terminal editor#

Many devices (transfer switches, changeovers, relays, contactors, meters, RCD/RCBO, and others) let you fine-tune their terminals — the marking, placement, and internal jumpers. The editor opens in the properties panel of the selected device.

At its centre is a device replica diagram: a scaled copy of the body with terminals on their real edges (top/bottom), coloured by conductor. This is the same view as on the panel canvas — click any terminal on the diagram to open its card. Every change applies immediately (no "Apply") and syncs with the diagram and the canvas.

Terminal card#

• Terminal marking — the label per standard (IEC numbering: 1/3/5 for the primary input, 2/4/6 for the reserve, N, U/V/W for outputs — depending on the device type). You can pick a catalog value or enter your own.
• Placement — which edge the terminal sits on (Top / Bottom) and its position along the edge (a ‹ 1/8 › stepper). If the slot is occupied, the terminals swap. A hint is on the ⓘ icon.
• Input source — for dual-source devices (transfer switch/changeover) it shows which source the terminal belongs to (Primary / Reserve). The "Swap sources" button atomically swaps the whole set of primary and reserve inputs.
• ↺ in the card header resets that terminal to the default.

The device feed direction (↑ Top / ↓ Bottom) is set right here, above the diagram (for devices that support it).

Bridges & connections#

The "Bridges & connections" section (collapsed by default) manages jumpers between terminals:

• Reserve-input jumper — for multi-phase transfer switches, one toggle joins the reserve-input phase terminals into a group (for example, so a single-phase reserve feeds all phases). On the diagram and canvas it is drawn as a shared bridge bar and follows the reserve source on "Swap sources".
• Jumper list — all existing jumpers with friendly terminal labels (for example, 1 → 3) and an origin mark.
• Add manually — choose the type (Internal connection between two terminals of the same device, or a Reserve jumper), the "From"/"To" terminals, and press +. Dangerous connections (a short circuit between different conductors L↔N/PE) are blocked with an explanation.

System-managed connection types (the bond to a standalone source's neutral, a reference to a comb) are created automatically and are not offered for manual creation.

Deleting a device#

There are three ways to delete a device:

• Keyboard — select the device and press ⌨️ Delete or Backspace. Confirm the deletion in the dialog.
• Context menu — right-click the device and choose "🗑 Delete". Handy when you do not want to select the device with a separate click first.
• Properties panel — open the device settings and press the "Delete component" button at the bottom of the panel. Handy on mobile.

Warning: when you delete a device that is a parent of others (for example, an RCD with connected MCBs), the child devices lose their link to the parent.

Undo / Redo#

Any action can be undone:

• ⌨️ Ctrl+Z — undo
• ⌨️ Ctrl+Y or Ctrl+Shift+Z — redo

The ↩ ↪ buttons are also available in the toolbar. The action history is kept for the entire time you work on a project.

Rail management#

A panel is made of DIN rails onto which devices are mounted. Each rail has:

• A name — you can rename it with a double-click (for example, "Rail 1 — Incomer")
• A module count — how many modules the rail holds (6, 9, 12, 18, 24, 36, 48)

The maximum number of rails is 12. This matches the largest domestic and small commercial panels. For larger jobs it is recommended to split them into separate projects.

Rail control buttons#

Each rail has a set of buttons in its header:

• 🗑 — delete the rail (together with all devices on it)
• ⇅ — arrange the devices on the rail (auto-sort)
• + Rail — add a new rail (only on the last rail)

Rail auto-sort (⇅)#

The ⇅ button automatically orders the devices on a rail in a logical sequence:

1. Incoming devices (isolators, meters)
2. RCDs and RCBOs (protective devices)
3. Circuit breakers
4. Auxiliary devices

Within each type — sorting by phase (L1 → L2 → L3) and by rating (from higher to lower). A parent device is always placed before its children. The action supports Undo (Ctrl+Z).

Changing the module count#

A dropdown in the top-right corner of the first rail changes the module count for all rails at once. If the devices no longer fit, the system will ask you to confirm deleting those that fall outside the bounds.

Bars#

At the bottom of the panel the bars are shown — N (neutral), PE (protective earth), and PEN (combined). The set of bars is determined automatically depending on the chosen earthing system:

• TN-S — separate N and PE bars
• TN-C-S — N, PE, and PEN bars
• TN-C — PEN only
• TT — separate N and PE
• IT — PE only

When an RCD is present, a separate N bar is created automatically for each protection group. RCBOs, voltage relays, and other devices with an N pole connect to the panel's common N bar.

Phase distribution bars (L1/L2/L3)#

Besides N/PE/PEN, the "Distribution bars" palette has a "+ L" button — it adds a phase distribution bar to aggregate a group of 1P/3P breakers on one phase. It works for all panels (1-ph/2-ph/3-ph) — even on a single-phase panel, 5+ breakers on L1 benefit from a shared L bar instead of a "web" of wires.

Owner-bound model: after adding a bar, you choose its owner in its properties (a parent distributor, for example the incoming MCB or a contactor) and the phase. The bar colour is derived automatically from the phase. Until an owner is assigned, the bar is shown as a grey placeholder with an "L" badge.

Connecting children: for a 1P/3P breaker, the L1/L2/L3 bars appear as options in the "SOURCE" dropdown in the properties, alongside the parent breakers. When you choose a bar of a different phase for a 1P breaker, the phase switches automatically.

Phase combs: a 1P comb can be fed directly from an L bar — one wire from the bar to the comb instead of separate wires to each member.

Mounting zones#

Bars can be placed in different zones of the panel:

• Bottom zone — the standard position under the rails (horizontal)
• Top zone — above the rails (horizontal)
• Left / right side — vertical strips on the side of the panel
• On a DIN rail — mounted on any rail as a modular device

The mounting zone can be changed in the bar's properties panel, or you can drag the bar between zones.

Terminals and assignment#

Each bar has a defined terminal count (standard sizes: 2, 4, 6, 8, 10, 12, 15, 18, 24). The system automatically:

• Counts the occupied terminals — based on the connected devices
• Offers to increase — if there are more connections than terminals, a dialog appears offering the nearest standard size
• Assigns terminals — automatic distribution (the "Auto" button in the properties panel)

The properties panel shows the bar's terminal-assignment list. Clicking a row highlights the corresponding module on the panel with a pulsing animation.

Comb aggregation in the connection list#

An N comb fed from this bar is shown in the list as a single group terminal instead of N separate rows for each comb member. This is physically correct: one wire runs from the bar to the comb, and the comb itself then distributes N to its breakers.

• A chevron arrow ▶/▼ on the comb row — expands/collapses the list of internal devices
• An "X dev." badge — the number of comb members
• Nested members — read-only, managed via the comb panel (a "comb" badge on each row)

The occupied-terminal counter and auto-assignment count by groups: a comb of 5 breakers = 1 occupied terminal, not 5. This fixes the case where a 10-terminal bar falsely showed "overflow" due to a small number of physical connections.

"N incomer" — a virtual row from the mains#

When the panel's root device (with no parent) has no N pole (a 3P MCB, generator, inverter, UPS without N), a virtual row #1 "N incomer (mains/source)" is added to the bar's terminal list — the physical N cable arrives at the bar directly from the mains, outside the breaker. If the root has an N pole (for example a 4P MCB or a 3P+N SPD as root), this row is not needed — the root is itself the source and is shown as an ordinary connection.

Highlight when a bar is selected#

When you click a bar, the related devices are highlighted:

• Blue dashes — devices with a direct connection to the bar
• Yellow dashes — indirect descendants (supply passes through the bar, but without a direct wire)

More: Network settings

Combs (busbar combs)#

A comb is a copper connecting bar that replaces the individual wires for a group of breakers. Instead of a "web" of wires from a parent to each child device — one compact bar.

Creating a comb#

A right-click on a breaker opens a context menu:

• ⚡ Comb 1P (N devices) — an input comb that replaces the wires from the parent to the group
• ⚡ Output comb 1P (N children) — replaces the wires from the breaker to its child devices

The comb type (1P, 3P, 1P+N, 3P+N) is determined automatically from the breakers' phases.

Comb types#

Type	Conductors	Purpose
1P	L1	Single-phase groups
3P	L1, L2, L3	Three-phase groups
1P+N	L1, N	Single-phase with neutral
3P+N	L1, L2, L3, N	Three-phase with neutral
N	N	Neutral distribution (N comb)

N combs — a separate DIN comb for the N conductor instead of individual wires to each breaker. They are fed directly from an N bar, cascaded from another N comb, or from a distributor device — for example a 4P cross-module, which is itself a point of N distribution. The latter is useful when the panel has no N bar yet and you want to quickly create an N comb under the cross-module. The breaker's context menu offers a "From N bar / From cross-module" sub-menu when both options are available.

Phase selection for single-phase combs#

When a comb of type 1P or 1P+N is fed from a three-phase parent (3P/3P+N), a "Phase" selector appears in the properties panel — L1, L2, or L3. This lets you explicitly set which phase the comb is on, without editing each member separately.

Phase propagation (BFS): when you change the phase of a parent 1P/1P+N device, the system automatically updates the phase of the corresponding comb, of all single-phase child devices, and of the comb members in the subtree. Three-phase parents (3P/3P+N) do not propagate the phase — each child chooses on its own. 2P descendants are not affected.

Locked fields on comb members#

Comb members have locked fields in the properties panel: the parent device, the phase, and their own N bar. These parameters can be managed only via the comb panel — this prevents state inconsistency. The locked fields show a "managed by comb" badge.

When you change the comb feeder (via the comb panel), all members are automatically reassigned to the new parent.

Phase cascade#

Phase combs automatically lay out a skip pattern — they skip slots between breakers of different phases. For example, in a mixed 1P/3P group: 1P on L2 + 3P (L1L2L3) + 1P on L3 — the comb correctly connects only the matching phase of each breaker, without shorting the neighbours.

A continuous bar render — no gaps between sections, a visually single line.

Feeding from another rail#

A comb on one rail can be fed from a breaker on another rail (or from an N bar separately from the comb). The feeder breaker and the comb do not have to be on the same rail.

N cascade (comb from comb)#

An N comb can be fed not only from an N bar but also from another N comb — a cross-rail cascade, to reduce the number of wires on the board.

Input and output#

A breaker can have two combs at once on different sides:

• Input (top) — replaces the wires from the parent device
• Output (bottom) — replaces the wires to the child devices

Properties panel#

Clicking a comb (a coloured horizontal line) opens a panel on the right:

• Label — an arbitrary name (for example, "Lighting group")
• Role — input or output
• Conductors — which phases the comb carries
• Inc — the comb's rated withstand (validated against the total load)
• Membership — add / remove a breaker from the comb, a subset filter (show only members)
• Split / Merge — split a large comb into smaller ones or merge adjacent ones
• Part number — the manufacturer number for the bill of materials
• Delete — restores the individual wires

Context menu#

A right-click on a breaker or on a comb:

• Add to comb / Remove from comb — if the breaker is next to an existing one
• Split comb — divide into smaller groups
• Merge with adjacent — if two combs have the same conductors and feed direction

Automatic comb adaptation#

When a breaker's parameters change, the comb adapts automatically:

• Flipping (a feed-direction change) — the breaker is removed from an incompatible comb
• A connection change (1P → 3P) — compatibility is checked; on a mismatch the breaker leaves the comb
• Moving to another rail — automatic removal from the comb
• Changing the parent to an incompatible one — the breaker is evicted from the comb
• On each such action a toast message appears at the bottom of the screen with navigation to the cause

Validation rules#

A comb requires:

• At least 2 breakers
• All on the same DIN rail
• A common parent device
• Identical conductors (phases)
• The same feed direction
• No overlap with other combs on the same side

Validation indicator#

In the bottom-right corner of the editor there is a check-indicator button:

• 🔴/🟡/🔵 There are issues — the button is active; a click opens the validation panel with the list of Issues
• 🟢 All good — the button is inactive (disabled), the text is "All good", and a click does nothing

This lets you immediately tell "a panel with no errors" from "a panel not yet checked", and avoids being distracted by an empty panel.

Wire Mode#

Wire Mode is a special visualization mode that shows all conductors on the panel. Toggle it with ⌨️ Alt+W or the toolbar button.

In the toolbar, bar filters are available: the N and PE buttons let you hide the corresponding conductors — handy for checking specific circuits.

The state of the display settings (diamond visibility, tag mode) is preserved across wire-mode toggles — no need to re-enable it every time.

In wire mode, clicking a bar or a comb opens its properties panel; a click on empty space closes any panel and clears the selection.

The "Wiring editor" panel (on the right) contains sections in order of how often they are used:

• Display — two main toggles:
  • All diamonds — show/hide the edit points on all wires at once
  • Wire tags — labelling modes with a hint of the active mode: Off / Wires (a running number W001) / Terminals (the address of the opposite terminal QF1:2) / Nodes (one potential = one number L1-1, as on a wiring diagram). In "Nodes" mode, clicking a wire highlights the entire equipotential node (all terminals at the same potential)
• Selected wire / Selected — information about the selected wire (phase, route, from→to) or the selected group, with buttons to reset the correction and clear the selection
• Manual corrections — a collapsible list of all wires with a manual route correction. Each item shows a coloured dot, the phase, and from→to. A click selects the wire on the canvas; the ↺ button resets an individual correction
• Cables — an overview of all cables on the panel with status badges (✓ Auto / ⚠ Auto stale / ✎ Manual), a filter (All / Stale / Manual), and a bulk-apply button "Accept recommendations (N)" with a confirmation for manually edited cables. Clicking a row opens an inline editor (one at a time) with the wires highlighted on the canvas; Esc collapses it. Details — in Cable system
• Colour standard — a palette choice (IEC, legacy, NEC, ElectroBoard Classic) in a compact 2×2 grid
• Wire thickness — 5 presets (thin → thick) for the visual line thickness on the canvas. Handy for printing panels with many circuits, where thin lines overlap
• Wire lengths — a length calculator based on the real geometry of the routes. It shows a breakdown by phase (L1/L2/L3/N/PE) with the wire count and length of each. It supports an installation margin (+10/15/20%). Clicking a phase expands the individual wires with their lengths
• Rail spacing — a slider from 10 to 50 cm that scales the SVG display of the physical distance between DIN rails
• Hints — a collapsible accordion with keyboard shortcuts and tips

To change a wire's route, drag the diamonds (◆) on the conductors: a horizontal diamond — up/down, a vertical one (↔) — left/right.

Selecting and labelling wires#

• Clicking a wire — selects it (it is highlighted brighter, the rest dim). Next to each connection a marking is shown (for example, W001/A3:2)
• Clicking again on a selected wire — resets its manual route to the automatic one
• Shift+Click — adds/removes a wire from the selection group. Resetting the manual route applies to the whole group at once
• Tab / Shift+Tab — moves the focus between wires with an automatic scroll to the chosen one

Undo/Redo of routes#

Manual route changes (dragging the diamonds) support Ctrl+Z / Ctrl+Y — just like adding and deleting devices.

[screenshot: Wire Mode with the wiring-editor panel]

Minimap#

When you zoom into large panels (3+ rails), a minimap appears in the bottom-right corner — a thumbnail of the whole panel with a rectangle for the currently visible region.

• A click on the minimap — instantly moves the view to the chosen point
• Dragging — smooth navigation around the panel
• Resizing — drag the minimap edge for a convenient size (S/M/L/XL)
• The minimap hides automatically when the whole panel is visible on screen

---

Toolbar — in detail#

Save indicator#

Next to the project name in the toolbar there is a coloured dot:

• 🟢 Green — all changes are saved
• 🟡 Yellow — saving...
• 🔴 Red — a save error (the changes are saved locally and will sync when the connection is restored)

Phase load balance#

For three-phase projects the toolbar shows the load distribution across phases L1, L2, L3 and the imbalance percentage. Click this area for an expanded view.

Incomer loading#

Shows the ratio of the total load to the allocated power:

• Up to 70% — normal operation
• 70–90% — caution, approaching the limit
• Over 90% — overload

Mobile interface#

On a mobile device the interface is adapted:

• The toolbar is split into 3 rows instead of 2
• The palette — a bottom sheet at the bottom with accordion categories (one group open at a time) and search
• The properties panel — a bottom sheet (dynamic height: 40vh by default, up to 85vh when expanded)
• The consumers drawer — replaces the properties panel in the same bottom sheet
• The project list — a full-screen overlay
• Dragging — a long press (300 ms) with vibration
• The AI button (the "⚡ AI Assistant" pill at the bottom) hides automatically when any bottom sheet is open — so it does not cover the panel
• The status bar (hotkeys + rail status) is hidden on mobile — a touch interface does not need keyboard hints

Bottom sheet — gestures#

All bottom-sheet panels (palette, properties, comb, bar, consumers) support the same set of gestures:

• A drag handle (a horizontal bar at the top) — drag to change the height
• Snap zones — on release the panel automatically snaps to one of the positions:
  • ≤14vh — the panel closes
  • 14–60vh — returns to the default (40vh)

  • 60vh — expands to the maximum (85vh for properties, 75vh for the comb/bar)

• Swipe down to close — drag down to 14vh to close
• Backdrop click — a click on the dimmed background also closes the panel
• Keyboard-aware — when a virtual keyboard opens (e.g. in the palette search field), the panel automatically rises above it via the visualViewport API

---

Interface theme#

ElectroBoard supports two themes:

• 🌙 Dark — the default, optimized for long work sessions
• ☀️ Light — the Windows 11 default, comfortable in bright office lighting

The theme switch is in the main menu (≡) → "Theme". The state is saved between sessions.

Details:

• The toolbar chrome (the top bar with buttons) is dark in both themes. This is a design decision after the pattern of professional CAD tools (Photoshop, Figma, Fusion 360): a contrasting bar of controls visually separates the working canvas from the UI
• The canvas is light in both themes (like a sheet of paper — a CAD convention)
• The palette, sidebar, and dialogs adapt to the theme
• The phase colours (L1/L2/L3/N) are invariant per the IEC 60445 standard
• The power-source roles have invariant colours (mains = blue, generator = amber, inverter = purple, and so on)

By default the system theme is used. On the first click, the switch locks to the chosen option.

---

Renaming a project#

A double-click on the project name in the toolbar activates edit mode. Enter a new name and press Enter or click outside the field.

Switching between projects#

Press ⌨️ Ctrl+O or click the project name to open the project list. Here you can:

• Move to another project
• Create a new project
• Delete a project (with confirmation)

💡 Auto-name: if you leave the name field empty when creating a new project, a name is generated automatically — "New panel", "New panel (2)", "New panel (3)", and so on (the first free number is used). Handy when you need to quickly create a panel for a test or sketch.

Panel settings (⚙)#

In the toolbar, the "Panel settings" toggle (the gear) opens a side panel with parameters:

• Network preset — a quick choice of a typical configuration (apartment / house / EU standard)
• Phase count — 1-ph / 2-ph / 3-ph
• Earthing system — TN-C-S / TN-S / TN-C / TT / IT
• Voltage, frequency, line voltage — automatic for the presets
• Allocated power — kW or A (for the incomer-overload check)
• Default cable installation — a choice of 4 options (In a wall / In a conduit / Exposed / In the ground). The global default: Exposed on a wall (for a realistic panel scenario). New MCBs/RCBOs inherit this method; existing cables are not changed.
• Validation standards — a checkbox list: IEC 60364 (default) / regional codes. Choose one or several — the Validation panel shows only the Issues that belong to the active set. New-panel defaults are inherited from the settings profile. The active set is shown as a chip indicator in the validation-panel header (click the chip to scroll here).

Visual indicators on devices#

• Source-role icon: above the body of a device with a source role (inverter, solar, generator, battery, UPS), an emoji role icon is shown. It lets you visually tell a supply entry point from ordinary devices. For a mains source and "other", no icon is drawn.
• 2P mode badge: for an MCB/fuse/contactor/time relay/isolator in the 2P variant, the phase badges in the body match the pole configuration exactly: L+N mode → one L badge (N is not shown as a phase), L1+L2 mode → two badges, L1 and L2.