Editor's Path Properties section has no 'thread color by number' input — user wanting to enter a specific Robison-Anton code (e.g., '9012') has to scroll the catalog and find it by eye #349

New issue

Closed

opened 2026-10-04 03:55:54 +00:00 by Mark · 0 comments

Mark commented

2026-10-04 03:55:54 +00:00

Owner

Finding

grep -rn 'threadNumber\|threadCode' src/components/editor/ returns 0. The editor has no thread number input.

A user wanting to match a specific thread code:

"I have Robison-Anton 9012 in my hand"
Wants to set the path's color to that
Has to scroll the catalog and find "9012" by visual
No exact-match by number

The fix is a number search in the color picker.

Where

Color picker: src/components/editor/EditorRightPanel.tsx
No number input: grep -rn 'threadNumber' src/components/editor/ returns 0

Suggested fix shape

UI: above the color picker grid, a small text input:

<input
  type="text"
  value={colorNumber}
  onChange={(e) => setColorNumber(e.target.value)}
  placeholder="Thread number (e.g., 9012)"
  className="..."
/>

Behavior: as the user types, the catalog is filtered to show only matching colors:

const filteredCatalog = colorNumber
  ? catalog.filter((c) => c.name.toLowerCase().includes(colorNumber.toLowerCase()))
  : catalog;

Use cases:

"I have Robison-Anton 9012"
"Match Pantone 18-1664"
"Use the same red as the previous design (color #FF0000)"

Combined with the existing name search (per #256): the search filters by name OR number OR hex.

Severity

Low. The user can scroll. Power users with specific thread codes notice.

Discovered by

Gap analysis (2026-10-02) of editor color picker.

#256 (open) — Thread color search. The search is the umbrella.
#341 (open) — Color distance. The visual is the alternative.
The catalog has the names/numbers; the picker is the surface.

## Finding `grep -rn 'threadNumber\|threadCode' src/components/editor/` returns 0. The editor has no thread number input. A user wanting to match a specific thread code: - "I have Robison-Anton 9012 in my hand" - Wants to set the path's color to that - Has to scroll the catalog and find "9012" by visual - No exact-match by number The fix is a number search in the color picker. ## Where - Color picker: `src/components/editor/EditorRightPanel.tsx` - No number input: `grep -rn 'threadNumber' src/components/editor/` returns 0 ## Suggested fix shape 1. **UI**: above the color picker grid, a small text input: ```tsx <input type="text" value={colorNumber} onChange={(e) => setColorNumber(e.target.value)} placeholder="Thread number (e.g., 9012)" className="..." /> ``` 2. **Behavior**: as the user types, the catalog is filtered to show only matching colors: ```ts const filteredCatalog = colorNumber ? catalog.filter((c) => c.name.toLowerCase().includes(colorNumber.toLowerCase())) : catalog; ``` 3. **Use cases**: - "I have Robison-Anton 9012" - "Match Pantone 18-1664" - "Use the same red as the previous design (color #FF0000)" 4. **Combined with the existing name search** (per #256): the search filters by name OR number OR hex. ## Severity Low. The user can scroll. Power users with specific thread codes notice. ## Discovered by Gap analysis (2026-10-02) of editor color picker. ## Related - #256 (open) — Thread color search. The search is the umbrella. - #341 (open) — Color distance. The visual is the alternative. - The catalog has the names/numbers; the picker is the surface.