Skip to content

Circuit-Editor Multi-Target Gate Support - #3426

Draft
Scott Carda (ScottCarda-MS) wants to merge 5 commits into
mainfrom
sccarda/ce-multitarget
Draft

Circuit-Editor Multi-Target Gate Support#3426
Scott Carda (ScottCarda-MS) wants to merge 5 commits into
mainfrom
sccarda/ce-multitarget

Conversation

@ScottCarda-MS

@ScottCarda-MS Scott Carda (ScottCarda-MS) commented Jul 8, 2026

Copy link
Copy Markdown
Contributor

Circuit Editor: multi-target / group drag-editing

Adds drag-editing for multi-wire gates in the circuit-vis circuit editor:
move multi-target gates and groups as rigid units, clone them as a unit
(Ctrl-drag), and extend a group onto new wires (Shift-drag). Purely additive on
top of the existing single-target editing paths. Also tightens the shift-extend
ghost/dropzone geometry so the previews line up with the group box in the
tricky cases (classical controls, long labels).

What's new

  • Rigid unit-move. Dragging a multi-target gate or group shifts the gate's
    own registers and every register in its child grid by the same delta, so the
    box and its contents stay aligned. Classical controls anchor correctly
    (external measurement refs stay put, internal ones move with the subtree), and
    a shift that would push any wire below 0 is refused without mutating the model.
  • Clone-as-unit (Ctrl-drag). Leaves the source in place and drops a full
    copy at the target, using the same child-register remap as a unit-move.
  • Shift-to-extend (Shift-drag). Dragging a child out of an expanded group
    offers dropzones on wires outside the group's span and paints a ghost border
    showing the extended bounds, growing the group onto new wires.
  • Accurate shift-extend previews. The ghost border and the "inside the
    group" test are driven off the group box's rendered pixel bounds instead of
    the quantum-target range, so a classically-controlled group (whose box reaches
    down to the producing measurement's classical wire) extends from the right
    edge and offers dropzones on the correct wires.
  • Label-slack dropzone coverage. A long group label stretches the group box
    wider than its child columns; that extra width is owned by the box, not any
    column. The layout pass now publishes each group's box right edge through the
    LayoutMap, and the editor stretches the group's trailing "extend-sideways"
    dropzone (both the always-on and shift-extend variants) to cover that slack —
    no more dead gutter on the right of a wide-labeled group.

Changes

Area File What it adds
Source actions/circuit-actions/move.ts moveAsUnit, shiftAllRegisters, subtree wire-swap helpers, and the unit-shift branch of moveY.
Source actions/circuitActions.ts Unit-shift wire-growth/bounds in moveOperation; clone-as-unit + sourceWire param in addOperation.
Source editor/controllers/dragController.ts Shift-extend lifecycle (setup / spawn dropzones / paint ghost / tear down), the multi-leg dropzone loop, box-pixel "inside group" test, and label-slack trailing band.
Source editor/draggable.ts makeShiftExtendGhost geometry helper (clones the rendered box, slides one edge) and trailingBandRightX / bandRightX label-slack stretching.
Source editor/domUtils.ts getGroupBoxElem — recovers a group's rendered box <rect> so the ghost and inside-group test can read its pixel bounds.
Source renderer/process.ts Computes each expanded group's absolute box right edge and threads it into the child scope's LayoutMap entry.
Source renderer/layoutMap.ts LayoutScope.boxRightX — the enclosing group box's right edge, source of truth for label-slack stretching.
Docs ux/circuit-vis/README.md Documents the transient single-gesture shift-extend state on DragController and the ghost box as the one sanctioned exception to "LayoutMap is the single source of geometry."
Tests 5 files under test/circuit-editor/ 30 new tests (see below).

Testing

30 new circuit-editor tests, all passing: 7 clone-as-unit, 7 rigid unit-move /
bounds, 8 shift-extend lifecycle, 7 dropzone/ghost geometry (shift-extend ghost
edges + label-slack band stretch/overhang), and 1 shift-extend end-to-end
dropzone case.

# from source/npm/qsharp/
npm run build:ux
node --test "test/circuit-editor/**/*.test.mjs"

@ScottCarda-MS Scott Carda (ScottCarda-MS) changed the title multi-target gate support Circuit-Editor Multi-Target Gate Support Jul 8, 2026
Base automatically changed from sccarda/ce-foundation to main July 31, 2026 16:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant