From 39f4c84241f989b78006cfe2bf8d9d6cfe8541cd Mon Sep 17 00:00:00 2001 From: Tanish Manku Date: Fri, 1 May 2026 01:49:11 -0700 Subject: [PATCH] PageScene: record color changes via HistoryManager MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Color picker is the third interactive surface (after gizmo drag and outliner toggles) that mutates an object. Wire it the same way: record in the onChange handler (input type="color" fires once per committed pick, so one undo entry per user choice). Object Panel transform inputs (position/rotation/scale text fields) are still on the legacy diff path. Wiring them is one more pass — they need a coalescer because each keystroke flushes to the engine. Tracking that as a follow-up. --- .../ControlPanelSceneObject.tsx | 16 +++++++++++----- 1 file changed, 11 insertions(+), 5 deletions(-) diff --git a/frontend/apps/artcraft/app/src/pages/PageScene/comps/ControlPanelSceneObject/ControlPanelSceneObject.tsx b/frontend/apps/artcraft/app/src/pages/PageScene/comps/ControlPanelSceneObject/ControlPanelSceneObject.tsx index 8dbf2b2823..3012273686 100644 --- a/frontend/apps/artcraft/app/src/pages/PageScene/comps/ControlPanelSceneObject/ControlPanelSceneObject.tsx +++ b/frontend/apps/artcraft/app/src/pages/PageScene/comps/ControlPanelSceneObject/ControlPanelSceneObject.tsx @@ -220,11 +220,17 @@ export const ControlPanelSceneObject = () => { className="h-0 w-0 cursor-pointer opacity-0" id={colorInputId} onChange={(e: ChangeEvent) => { - editorEngine?.activeScene.setColor( - editorEngine?.selected?.uuid || "", - e.target.value, - ); - setColor(e.target.value); + // fires onChange once per committed + // pick (when the picker closes), so recording here gives + // exactly one undo entry per user-visible color change. + const uuid = editorEngine?.selected?.uuid; + const before = color; + const after = e.target.value; + editorEngine?.activeScene.setColor(uuid || "", after); + if (uuid) { + editorEngine?.history.recordSetColor(uuid, before, after); + } + setColor(after); }} type="color" value={color}