The tab headers are one TabHeader, the node board and the tile board pan and zoom through one helper, reordering tile pictures and tilemap layers goes through one moveItem, and a tilemap cell is one named type (#85)

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

src/editor/debugHook.ts

@@ -29,7 +29,7 @@ import { currentFontPicker } from './font/FontPicker';
 import { currentNodePalette } from './graph/NodePalette';
 import { currentSoundPicker } from './sound/SoundPicker';
 import { currentImagePicker } from './texture/ImagePicker';
-import { currentTilemapSection } from './panels/TilemapPanel';
+import { currentTilemapWidgets } from './panels/TilemapPanel';
 import type { EditorState, TilemapTool } from './state';
 
 /**
@@ -571,33 +571,33 @@ export function installDebugHook(app: Application, state: EditorState, editor: E
       },
       /** Where the widgets of the painting panel sit: their texts are on screen elsewhere too. */
       toolAt: (tool: string) => {
-        const button = currentTilemapSection()?.tools.get(tool as TilemapTool);
+        const button = currentTilemapWidgets()?.tools.get(tool as TilemapTool);
         return button ? centreOf(button) : null;
       },
       tileButtonAt: (assetId: string) =>
-        currentTilemapSection()?.palette?.swatchGlobal(assetId)?.centre ?? null,
+        currentTilemapWidgets()?.palette?.swatchGlobal(assetId)?.centre ?? null,
       /** A tile's box in the palette: its centre, where its picture sits and the palette's columns (#139). */
       tileSwatch: (assetId: string) => {
-        const palette = currentTilemapSection()?.palette;
+        const palette = currentTilemapWidgets()?.palette;
         const swatch = palette?.swatchGlobal(assetId);
         return palette && swatch ? { ...swatch, columns: palette.columns } : null;
       },
       addLayerAt: () => {
-        const button = currentTilemapSection()?.addLayer;
+        const button = currentTilemapWidgets()?.addLayer;
         return button ? centreOf(button) : null;
       },
       /** The name field of the painted layer and the Show dropdown, with what they hold (#138). */
       layerNameAt: () => {
-        const field = currentTilemapSection()?.layerName;
+        const field = currentTilemapWidgets()?.layerName;
         return field ? { ...centreOf(field), value: field.value } : null;
       },
       focusAt: () => {
-        const button = currentTilemapSection()?.focus;
+        const button = currentTilemapWidgets()?.focus;
         return button ? { ...centreOf(button), label: button.text } : null;
       },
       /** One row of the layer list, top-down as drawn: the layer, its switch and its buttons. */
       layerRowAt: (index: number) => {
-        const row = currentTilemapSection()?.layers[index];
+        const row = currentTilemapWidgets()?.layers[index];
         return row
           ? {
               id: row.id,