Editor has no 'duplicate with offset' option — duplicating a path leaves the copy at the same position, user has to drag it to a new spot, no 'duplicate and place next to original' affordance #300

New issue

Closed

opened 2026-10-04 03:48:34 +00:00 by Mark · 1 comment

Mark commented

2026-10-04 03:48:34 +00:00

Owner

Finding

The editor's "Duplicate Path" button (per #187) creates a copy at the same position. The user has to drag the new copy to a new position.

grep -rn 'duplicateWithOffset' src/components/editor/ returns 0.

A user wanting to create a parallel offset path:

Duplicates the original
Drags the duplicate by some amount
Often, the user wants the duplicate at a specific offset (e.g., 5mm to the right)

The fix is a "Duplicate with offset" option that places the duplicate at a specific offset.

Where

Duplicate Path button: src/components/editor/EditorRightPanel.tsx (per #187)
No offset: grep -rn 'duplicateWithOffset' src/components/editor/ returns 0

Suggested fix shape

UI: a small "Offset" input next to the Duplicate button:

<div className="flex items-center gap-1">
  <button onClick={onDuplicate} data-testid="duplicate">
    <Copy size={12} /> Duplicate
  </button>
  <select
    value={duplicateOffset}
    onChange={(e) => setDuplicateOffset(Number(e.target.value))}
    className="text-[11px]"
  >
    <option value={0}>0 mm</option>
    <option value={1}>1 mm</option>
    <option value={2.5}>2.5 mm</option>
    <option value={5}>5 mm</option>
    <option value={10}>10 mm</option>
  </select>
</div>

Behavior: the duplicate is offset by (offset, offset) from the original.
Visual feedback: a faint preview of where the duplicate will land, before clicking.
History: single undoable action.
Use cases: creating parallel borders (per #280's offset), copying a logo to compare two versions, etc.

Severity

Low. The user can drag. Power users with repetitive layouts notice.

Discovered by

Gap analysis (2026-10-02) of editor path operations.

#187 (closed) — Path duplicate. The basic duplicate is in place; the offset is the addition.
#280 (open) — Path offset. The path offset is the auto-computed version; the duplicate-with-offset is the manual version.
Figma/Illustrator have "Duplicate" with the option to place the copy at an offset (often Cmd+D).

## Finding The editor's "Duplicate Path" button (per #187) creates a copy at the same position. The user has to drag the new copy to a new position. `grep -rn 'duplicateWithOffset' src/components/editor/` returns 0. A user wanting to create a parallel offset path: - Duplicates the original - Drags the duplicate by some amount - Often, the user wants the duplicate at a specific offset (e.g., 5mm to the right) The fix is a "Duplicate with offset" option that places the duplicate at a specific offset. ## Where - Duplicate Path button: `src/components/editor/EditorRightPanel.tsx` (per #187) - No offset: `grep -rn 'duplicateWithOffset' src/components/editor/` returns 0 ## Suggested fix shape 1. **UI**: a small "Offset" input next to the Duplicate button: ```tsx <div className="flex items-center gap-1"> <button onClick={onDuplicate} data-testid="duplicate"> <Copy size={12} /> Duplicate </button> <select value={duplicateOffset} onChange={(e) => setDuplicateOffset(Number(e.target.value))} className="text-[11px]" > <option value={0}>0 mm</option> <option value={1}>1 mm</option> <option value={2.5}>2.5 mm</option> <option value={5}>5 mm</option> <option value={10}>10 mm</option> </select> </div> ``` 2. **Behavior**: the duplicate is offset by (offset, offset) from the original. 3. **Visual feedback**: a faint preview of where the duplicate will land, before clicking. 4. **History**: single undoable action. 5. **Use cases**: creating parallel borders (per #280's offset), copying a logo to compare two versions, etc. ## Severity Low. The user can drag. Power users with repetitive layouts notice. ## Discovered by Gap analysis (2026-10-02) of editor path operations. ## Related - #187 (closed) — Path duplicate. The basic duplicate is in place; the offset is the addition. - #280 (open) — Path offset. The path offset is the auto-computed version; the duplicate-with-offset is the manual version. - Figma/Illustrator have "Duplicate" with the option to place the copy at an offset (often Cmd+D).

Mark added the

feature-request

triage-approved

labels

2026-10-04 03:48:34 +00:00

Mark referenced this issue from a commit

2026-10-04 20:48:28 +00:00

fix(#300): editor Duplicate Path now has a 0/1/2.5/5/10 mm offset picker

Mark commented

2026-10-04 20:58:34 +00:00

Author

Owner

Shipped fix at cff90972f9 on main.

Editor Duplicate button has a small <select> next to it (0/1/2.5/5/10 mm) so the user can pick the offset. Editor.tsx handler accepts an optional offsetMm; keyboard shortcut and right-click context menu fall through to the legacy 10 mm default.

Button label trimmed to Duplicate, tooltip tracks current offset (offset by 5mm), picker disabled in lockstep with the button.

9 new tests in issue-300.test.tsx pin: picker renders, options match, click forwards the right value, fractional offsets, disabled when no path selected, tooltip tracks offset, omission hides whole group.

Shipped fix at cff90972f9eb46b91f3103dc02532c376df91b9f on `main`. Editor Duplicate button has a small `<select>` next to it (0/1/2.5/5/10 mm) so the user can pick the offset. `Editor.tsx` handler accepts an optional `offsetMm`; keyboard shortcut and right-click context menu fall through to the legacy 10 mm default. Button label trimmed to `Duplicate`, tooltip tracks current offset (`offset by 5mm`), picker disabled in lockstep with the button. 9 new tests in `issue-300.test.tsx` pin: picker renders, options match, click forwards the right value, fractional offsets, disabled when no path selected, tooltip tracks offset, omission hides whole group.

Mark closed this issue

2026-10-04 20:58:37 +00:00