@defra/interactive-map 0.0.37-alpha → 0.0.38-alpha

package/plugins/draw/src/events.test.js

@@ -0,0 +1,369 @@
+import { attachEvents } from './events.js'
+
+jest.useFakeTimers()
+
+const DRAW_EVENTS = ['create', 'editfinish', 'cancel', 'vertexselection', 'vertexchange', 'undochange', 'update', 'geometrychange', 'placementblocked', 'validitychange', 'canplacechange', 'interfacetypechange']
+
+const setup = (overrides = {}) => {
+  const draw = {
+    getMode: jest.fn(() => 'draw_polygon'),
+    done: jest.fn(),
+    cancel: jest.fn(),
+    add: jest.fn(),
+    get: jest.fn(() => ({ id: 'F' })),
+    undo: jest.fn(),
+    setGeometryValid: jest.fn(),
+    setInvalid: jest.fn(),
+    deleteVertex: jest.fn(),
+    nudgeSelectedVertex: jest.fn(),
+    setSnapEnabled: jest.fn(),
+    isSnapEnabled: jest.fn(() => false),
+    changeMode: jest.fn(),
+    on: jest.fn(),
+    off: jest.fn()
+  }
+  const dispatch = jest.fn()
+  const pluginState = { dispatch, feature: { id: 'F' }, tempFeature: { id: 'T' }, snap: false, ...overrides.pluginState }
+  const mapProvider = { draw }
+  const eventBus = { emit: jest.fn() }
+  const hints = { show: jest.fn() }
+  const buttonConfig = { drawDone: {}, drawCancel: {}, drawUndo: {}, drawDeletePoint: {}, drawSnap: {}, ...overrides.buttonConfig }
+  const appState = { layoutRefs: { viewportRef: { current: 'viewport' } }, interfaceType: 'mouse' }
+  const appConfig = { id: 'app' }
+  const mapState = { mapSize: 'medium' }
+
+  const detach = attachEvents({ appState, appConfig, mapState, pluginState, mapProvider, buttonConfig, eventBus, hints })
+  return { draw, dispatch, pluginState, mapProvider, eventBus, hints, buttonConfig, detach }
+}
+
+const drawHandler = (draw, event) => draw.on.mock.calls.find(([name]) => name === event)[1]
+
+beforeEach(() => jest.clearAllTimers())
+
+describe('attachEvents – wiring', () => {
+  test('assigns onClick to each configured button', () => {
+    const { buttonConfig } = setup()
+    expect(typeof buttonConfig.drawDone.onClick).toBe('function')
+    expect(typeof buttonConfig.drawCancel.onClick).toBe('function')
+    expect(typeof buttonConfig.drawUndo.onClick).toBe('function')
+    expect(typeof buttonConfig.drawDeletePoint.onClick).toBe('function')
+    expect(typeof buttonConfig.drawSnap.onClick).toBe('function')
+  })
+
+  test('subscribes to every draw event', () => {
+    const { draw } = setup()
+    DRAW_EVENTS.forEach((event) => {
+      expect(draw.on).toHaveBeenCalledWith(event, expect.any(Function))
+    })
+  })
+
+  test('tolerates missing optional buttons', () => {
+    const { buttonConfig, detach } = setup({ buttonConfig: { drawDeletePoint: undefined, drawSnap: undefined } })
+    expect(typeof buttonConfig.drawDone.onClick).toBe('function')
+    expect(() => detach()).not.toThrow()
+  })
+})
+
+describe('button handlers', () => {
+  test('done finishes without resetting snap', () => {
+    const { buttonConfig, draw, dispatch } = setup()
+    buttonConfig.drawDone.onClick()
+    expect(dispatch).not.toHaveBeenCalledWith({ type: 'SET_SNAP', payload: false })
+    expect(draw.setSnapEnabled).not.toHaveBeenCalledWith(false)
+    expect(draw.done).toHaveBeenCalled()
+  })
+
+  test('cancel re-adds the feature when cancelling a vertex edit, and releases activeMoveTarget', () => {
+    const { buttonConfig, draw, dispatch, eventBus, mapProvider } = setup()
+    draw.getMode.mockReturnValue('edit_vertex')
+    drawHandler(draw, 'vertexselection')({ index: 1 })
+
+    buttonConfig.drawCancel.onClick()
+
+    expect(draw.add).toHaveBeenCalledWith({ id: 'F' })
+    expect(draw.cancel).toHaveBeenCalled()
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_MODE', payload: null })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_FEATURE', payload: { feature: null, tempFeature: null } })
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:cancelled', { id: 'F' })
+    expect(mapProvider.activeMoveTarget).toBeNull()
+  })
+
+  test('cancel does not re-add outside a vertex edit', () => {
+    const { buttonConfig, draw } = setup()
+    draw.getMode.mockReturnValue('draw_polygon')
+    buttonConfig.drawCancel.onClick()
+    expect(draw.add).not.toHaveBeenCalled()
+  })
+
+  test('cancel does not re-add a vertex edit without a temp feature', () => {
+    const { buttonConfig, draw } = setup({ pluginState: { tempFeature: null } })
+    draw.getMode.mockReturnValue('edit_vertex')
+    buttonConfig.drawCancel.onClick()
+    expect(draw.add).not.toHaveBeenCalled()
+  })
+
+  test('undo and delete-vertex delegate to the adapter', () => {
+    const { buttonConfig, draw } = setup()
+    buttonConfig.drawUndo.onClick()
+    buttonConfig.drawDeletePoint.onClick()
+    expect(draw.undo).toHaveBeenCalled()
+    expect(draw.deleteVertex).toHaveBeenCalled()
+  })
+
+  test('snap toggles state and syncs the adapter', () => {
+    const { buttonConfig, draw, dispatch } = setup({ pluginState: { snap: false } })
+    buttonConfig.drawSnap.onClick()
+    expect(dispatch).toHaveBeenCalledWith({ type: 'TOGGLE_SNAP' })
+    expect(draw.setSnapEnabled).toHaveBeenCalledWith(true)
+  })
+})
+
+describe('draw event handlers', () => {
+  test('create resets state, preserves snap, disables mode asynchronously and emits', () => {
+    const { draw, dispatch, eventBus } = setup()
+    drawHandler(draw, 'create')({ id: 'new' })
+
+    expect(dispatch).not.toHaveBeenCalledWith({ type: 'SET_SNAP', payload: false })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_MODE', payload: null })
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:created', { id: 'new' })
+
+    jest.runAllTimers()
+    expect(draw.changeMode).toHaveBeenCalledWith('disabled')
+  })
+
+  test('editfinish resets state and emits draw:edited', () => {
+    const { draw, eventBus } = setup()
+    drawHandler(draw, 'editfinish')({ id: 'edited' })
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:edited', { id: 'edited' })
+    jest.runAllTimers()
+    expect(draw.changeMode).toHaveBeenCalledWith('disabled')
+  })
+
+  test('re-opens an invalid finished shape in edit mode instead of creating it', () => {
+    const { draw, eventBus, hints } = setup()
+    const bowtie = { id: 'bad', type: 'Feature', geometry: { type: 'Polygon', coordinates: [[[0, 0], [1, 1], [1, 0], [0, 1], [0, 0]]] } }
+    drawHandler(draw, 'create')(bowtie)
+    expect(eventBus.emit).not.toHaveBeenCalledWith('draw:created', bowtie)
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:geometryinvalid', expect.objectContaining({ reason: expect.stringMatching(/intersect/i) }))
+    expect(hints.show).toHaveBeenCalledWith(expect.stringMatching(/intersect/i))
+    jest.runAllTimers()
+    const editCall = draw.changeMode.mock.calls.find(([mode]) => mode === 'edit_vertex')
+    expect(editCall[1]).toEqual(expect.objectContaining({ featureId: 'bad' }))
+    // the wired getSnapEnabled option delegates to the adapter
+    editCall[1].getSnapEnabled()
+    expect(draw.isSnapEnabled).toHaveBeenCalled()
+  })
+
+  test('edit finish of a drawn-then-fixed shape reports as a creation', () => {
+    const { draw, eventBus } = setup()
+    // An invalid finished shape is re-opened for fixing (marks it as a pending creation)…
+    const bowtie = { id: 'bad', type: 'Feature', geometry: { type: 'Polygon', coordinates: [[[0, 0], [1, 1], [1, 0], [0, 1], [0, 0]]] } }
+    drawHandler(draw, 'create')(bowtie)
+    jest.runAllTimers()
+    // …so when its edit finishes, it reports as a creation, exactly once.
+    drawHandler(draw, 'editfinish')({ id: 'bad' })
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:created', { id: 'bad' })
+    drawHandler(draw, 'editfinish')({ id: 'bad' })
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:edited', { id: 'bad' })
+  })
+
+  test('cancel handler is a no-op', () => {
+    const { draw } = setup()
+    expect(() => drawHandler(draw, 'cancel')()).not.toThrow()
+  })
+
+  test('vertexselection dispatches, emits, and claims mapProvider.activeMoveTarget for MoveControl', () => {
+    const { draw, dispatch, eventBus, mapProvider } = setup()
+    drawHandler(draw, 'vertexselection')({ index: 2 })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_SELECTED_VERTEX_INDEX', payload: { index: 2 } })
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:vertexselection', { index: 2 })
+    expect(mapProvider.activeMoveTarget).toMatchObject({ label: 'vertex' })
+
+    mapProvider.activeMoveTarget.move(1, 0, true)
+    expect(draw.nudgeSelectedVertex).toHaveBeenCalledWith(1, 0, true)
+  })
+
+  test('vertexselection releases activeMoveTarget when the index is deselected', () => {
+    const { draw, mapProvider } = setup()
+    drawHandler(draw, 'vertexselection')({ index: 2 })
+    drawHandler(draw, 'vertexselection')({ index: -1 })
+    expect(mapProvider.activeMoveTarget).toBeNull()
+  })
+
+  test('vertexchange resets the selected index with the new count and releases activeMoveTarget', () => {
+    const { draw, dispatch, mapProvider } = setup()
+    drawHandler(draw, 'vertexselection')({ index: 2 })
+    drawHandler(draw, 'vertexchange')({ numVertices: 5 })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_SELECTED_VERTEX_INDEX', payload: { index: -1, numVertices: 5 } })
+    expect(mapProvider.activeMoveTarget).toBeNull()
+  })
+
+  test('undochange dispatches the stack length', () => {
+    const { draw, dispatch } = setup()
+    drawHandler(draw, 'undochange')(4)
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_UNDO_STACK_LENGTH', payload: 4 })
+  })
+
+  test('update emits draw:updated', () => {
+    const { draw, eventBus } = setup()
+    drawHandler(draw, 'update')({ id: 'u' })
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:updated', { id: 'u' })
+  })
+})
+
+describe('geometrychange validation', () => {
+  const squareFeature = {
+    type: 'Feature',
+    geometry: { type: 'Polygon', coordinates: [[[0, 0], [0, 1], [1, 1], [1, 0], [0, 0]]] }
+  }
+  const bowtieFeature = {
+    type: 'Feature',
+    geometry: { type: 'Polygon', coordinates: [[[0, 0], [1, 1], [1, 0], [0, 1], [0, 0]]] }
+  }
+  const collinearFeature = {
+    type: 'Feature',
+    geometry: { type: 'Polygon', coordinates: [[[0, 0], [1, 0], [2, 0], [0, 0]]] }
+  }
+  const partDrawnFeature = {
+    type: 'Feature',
+    geometry: { type: 'Polygon', coordinates: [[[0, 0], [1, 0], [0, 0]]] }
+  }
+
+  test('ignores preview payloads that carry no phase', () => {
+    const { draw, dispatch } = setup()
+    drawHandler(draw, 'geometrychange')({ coordinates: [[0, 0], [1, 1]] })
+    expect(dispatch).not.toHaveBeenCalledWith({ type: 'SET_GEOMETRY_VALID', payload: expect.anything() })
+  })
+
+  test('opens the gate for a valid geometry', () => {
+    const { draw, dispatch } = setup()
+    drawHandler(draw, 'geometrychange')({ feature: squareFeature, phase: 'commit-add', vertexIndex: 3 })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_GEOMETRY_VALID', payload: true })
+  })
+
+  test('gates a self-intersecting shape while drawing', () => {
+    const { draw, dispatch, eventBus, hints } = setup()
+    drawHandler(draw, 'geometrychange')({ feature: bowtieFeature, phase: 'commit-add', vertexIndex: 3 })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_GEOMETRY_VALID', payload: false })
+    expect(draw.setGeometryValid).toHaveBeenCalledWith(false)
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:geometryinvalid', expect.objectContaining({ reason: expect.stringMatching(/intersect/i) }))
+    expect(hints.show).toHaveBeenCalledWith(expect.stringMatching(/intersect/i))
+  })
+
+  test('gates a part-drawn shape below the minimum vertex count, but skips the hint — an incomplete shape is expected, not a mistake', () => {
+    const { draw, dispatch, eventBus, hints } = setup()
+    drawHandler(draw, 'geometrychange')({ feature: partDrawnFeature, phase: 'commit-add', vertexIndex: 1 })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_GEOMETRY_VALID', payload: false })
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:geometryinvalid', expect.objectContaining({ reason: expect.stringMatching(/at least 3 points/) }))
+    expect(hints.show).not.toHaveBeenCalled()
+  })
+
+  test('gates a zero-area shape while drawing', () => {
+    const { draw, dispatch } = setup()
+    drawHandler(draw, 'geometrychange')({ feature: collinearFeature, phase: 'commit-add', vertexIndex: 2 })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_GEOMETRY_VALID', payload: false })
+  })
+
+  test('gates a self-intersecting move in edit mode (never reverts)', () => {
+    const { draw, dispatch, eventBus } = setup()
+    draw.getMode.mockReturnValue('edit_vertex')
+    drawHandler(draw, 'geometrychange')({ feature: bowtieFeature, phase: 'commit-move', vertexIndex: 2 })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_GEOMETRY_VALID', payload: false })
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:geometryinvalid', expect.objectContaining({ reason: expect.stringMatching(/intersect/i) }))
+  })
+
+  test('keeps a valid edit move (gate open)', () => {
+    const { draw, dispatch } = setup()
+    draw.getMode.mockReturnValue('edit_vertex')
+    drawHandler(draw, 'geometrychange')({ feature: squareFeature, phase: 'commit-move', vertexIndex: 1 })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_GEOMETRY_VALID', payload: true })
+  })
+
+  test('applies the per-session user validator as a gate', () => {
+    const { draw, dispatch, eventBus, hints } = setup()
+    draw._geometryValidator = () => ({ valid: false, reason: 'too big' })
+    drawHandler(draw, 'geometrychange')({ feature: squareFeature, phase: 'commit-add', vertexIndex: 3 })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_GEOMETRY_VALID', payload: false })
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:geometryinvalid', expect.objectContaining({ reason: 'too big' }))
+    expect(hints.show).toHaveBeenCalledWith('too big')
+  })
+
+  test('a user validator that vetoes with no reason (plain `false`) still emits, but skips the hint', () => {
+    const { draw, dispatch, eventBus, hints } = setup()
+    draw._geometryValidator = () => false
+    drawHandler(draw, 'geometrychange')({ feature: squareFeature, phase: 'commit-add', vertexIndex: 3 })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_GEOMETRY_VALID', payload: false })
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:geometryinvalid', expect.objectContaining({ reason: null }))
+    expect(hints.show).not.toHaveBeenCalled()
+  })
+
+  test('drives the invalid stroke from committed validity in edit mode only', () => {
+    const { draw } = setup()
+    draw.getMode.mockReturnValue('draw_polygon')
+    drawHandler(draw, 'geometrychange')({ feature: bowtieFeature, phase: 'commit-add', vertexIndex: 3 })
+    expect(draw.setInvalid).not.toHaveBeenCalled() // draw mode: the adapter's live check owns the stroke
+
+    draw.getMode.mockReturnValue('edit_vertex')
+    drawHandler(draw, 'geometrychange')({ feature: bowtieFeature, phase: 'commit-move', vertexIndex: 2 })
+    expect(draw.setInvalid).toHaveBeenCalledWith(true)
+  })
+
+  test('a live validity flip (edit drag) drives the Done gate', () => {
+    const { draw, dispatch } = setup()
+    drawHandler(draw, 'validitychange')({ valid: false, reason: 'Shape must not intersect itself' })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_GEOMETRY_VALID', payload: false })
+    expect(draw.setGeometryValid).toHaveBeenCalledWith(false)
+
+    drawHandler(draw, 'validitychange')({ valid: true, reason: null })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_GEOMETRY_VALID', payload: true })
+  })
+
+  test('a live placement-veto flip drives the Add point gate', () => {
+    const { draw, dispatch } = setup()
+    drawHandler(draw, 'canplacechange')({ canPlace: false, reason: 'outside region' })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_CAN_ADD_POINT', payload: false })
+
+    drawHandler(draw, 'canplacechange')({ canPlace: true, reason: null })
+    expect(dispatch).toHaveBeenCalledWith({ type: 'SET_CAN_ADD_POINT', payload: true })
+  })
+
+  test('relays an interface-type change to the public bus', () => {
+    const { draw, eventBus } = setup()
+    drawHandler(draw, 'interfacetypechange')({ interfaceType: 'keyboard' })
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:interfacetypechange', { interfaceType: 'keyboard' })
+  })
+
+  test('relays a blocked placement to the public bus as draw:geometryinvalid, and as a hint', () => {
+    const { draw, eventBus, hints } = setup()
+    const blocked = { phase: 'place', mode: 'draw_polygon', vertexIndex: 2, reason: 'outside region', feature: { type: 'Feature' } }
+    drawHandler(draw, 'placementblocked')(blocked)
+    expect(eventBus.emit).toHaveBeenCalledWith('draw:geometryinvalid', blocked)
+    expect(hints.show).toHaveBeenCalledWith('outside region')
+  })
+
+  test('passes the current mode into the validation context', () => {
+    const { draw } = setup()
+    draw.getMode.mockReturnValue('draw_polygon')
+    const validator = jest.fn(() => true)
+    draw._geometryValidator = validator
+    drawHandler(draw, 'geometrychange')({ feature: squareFeature, phase: 'commit-add', vertexIndex: 3 })
+    expect(validator).toHaveBeenCalledWith({ feature: squareFeature, phase: 'commit-add', vertexIndex: 3, mode: 'draw_polygon' })
+  })
+})
+
+describe('detach', () => {
+  test('clears button handlers and unsubscribes from draw events', () => {
+    const { detach, buttonConfig, draw } = setup()
+
+    detach()
+
+    expect(buttonConfig.drawDone.onClick).toBeNull()
+    expect(buttonConfig.drawCancel.onClick).toBeNull()
+    expect(buttonConfig.drawUndo.onClick).toBeNull()
+    expect(buttonConfig.drawDeletePoint.onClick).toBeNull()
+    expect(buttonConfig.drawSnap.onClick).toBeNull()
+    DRAW_EVENTS.forEach((event) => {
+      expect(draw.off).toHaveBeenCalledWith(event, expect.any(Function))
+    })
+  })
+})

package/plugins/draw/src/index.js

@@ -0,0 +1,10 @@
+export default function createPlugin (options = {}) {
+  return {
+    ...options,
+    id: 'draw',
+    load: async () => {
+      const module = (await import(/* webpackChunkName: "im-draw-plugin" */ './manifest.js')).manifest
+      return module
+    }
+  }
+}

package/plugins/draw/src/index.test.js

@@ -0,0 +1,24 @@
+import createPlugin from './index.js'
+import { manifest } from './manifest.js'
+
+jest.mock('./manifest.js', () => ({ manifest: { id: 'draw-manifest' } }))
+
+describe('createPlugin', () => {
+  test('returns a plugin descriptor with a fixed id and passes options through', () => {
+    const plugin = createPlugin({ foo: 'bar' })
+    expect(plugin).toMatchObject({ id: 'draw', foo: 'bar' })
+    expect(typeof plugin.load).toBe('function')
+  })
+
+  test('the fixed id cannot be overridden by options', () => {
+    expect(createPlugin({ id: 'other' }).id).toBe('draw')
+  })
+
+  test('defaults options to an empty object', () => {
+    expect(() => createPlugin()).not.toThrow()
+  })
+
+  test('load dynamically imports the manifest', async () => {
+    await expect(createPlugin().load()).resolves.toBe(manifest)
+  })
+})

package/plugins/draw/src/manifest.js

@@ -0,0 +1,170 @@
+import { initialState, actions } from './reducer.js'
+import { DrawInit } from './DrawInit.jsx'
+import { newPolygon } from './api/newPolygon.js'
+import { newLine } from './api/newLine.js'
+import { editFeature } from './api/editFeature.js'
+import { addFeature } from './api/addFeature.js'
+import { deleteFeature } from './api/deleteFeature.js'
+import { split } from './api/split.js'
+import { merge } from './api/merge.js'
+import { isMac } from '../../../src/utils/isMac.js'
+
+const DRAW_ACTIONS_SLOT = 'top-middle'
+
+// Show the platform-appropriate undo modifier (⌘ on macOS, Ctrl elsewhere).
+const undoCommand = isMac() ? '<kbd>Command</kbd> + <kbd>Z</kbd>' : '<kbd>Ctrl</kbd> + <kbd>Z</kbd>'
+
+const createButtonSlots = (showLabel) => ({
+  mobile: { slot: 'actions', showLabel },
+  tablet: { slot: 'actions', showLabel },
+  desktop: { slot: 'actions', showLabel }
+})
+
+export const manifest = {
+  reducer: {
+    initialState,
+    actions
+  },
+
+  InitComponent: DrawInit,
+
+  buttons: [
+    {
+      id: 'drawCancel',
+      label: 'Cancel',
+      variant: 'tertiary',
+      exclusiveSlot: true,
+      hiddenWhen: ({ pluginState }) => !pluginState.mode,
+      ...createButtonSlots(true)
+    },
+    {
+      id: 'drawAddPoint',
+      label: 'Add point',
+      variant: 'primary',
+      exclusiveSlot: true,
+      hiddenWhen: ({ appState, pluginState }) =>
+        !['draw_polygon', 'draw_line'].includes(pluginState.mode) || appState.interfaceType !== 'touch',
+      // Disabled while placing at the crosshair would be vetoed (validatePlacement) —
+      // driven live so the button never looks active when a tap would do nothing.
+      enableWhen: ({ pluginState }) => pluginState.canAddPoint,
+      ...createButtonSlots(true)
+    },
+    {
+      id: 'drawDone',
+      label: 'Done',
+      variant: 'primary',
+      exclusiveSlot: true,
+      hiddenWhen: ({ pluginState }) => !['draw_polygon', 'draw_line', 'edit_vertex'].includes(pluginState.mode),
+      enableWhen: ({ pluginState }) => {
+        const { mode, geometryValid } = pluginState
+        // Min-vertices, area and self-intersection are all enforced by the validation
+        // rules via geometryValid, so the gate is simply "is the geometry valid now".
+        return ['draw_polygon', 'draw_line', 'edit_vertex'].includes(mode) && geometryValid
+      },
+      ...createButtonSlots(true)
+    },
+    {
+      id: 'drawMenu',
+      label: ({ pluginState }) => pluginState.mode === 'edit_vertex' ? 'Edit actions' : 'Draw actions',
+      iconId: 'menu',
+      exclusiveSlot: true,
+      hiddenWhen: ({ pluginState }) => !['draw_polygon', 'draw_line', 'edit_vertex'].includes(pluginState.mode),
+      menuItems: [
+        {
+          id: 'drawUndo',
+          label: 'Undo',
+          iconId: 'undo',
+          hiddenWhen: ({ pluginState }) => !['draw_polygon', 'draw_line', 'edit_vertex'].includes(pluginState.mode),
+          enableWhen: ({ pluginState }) => {
+            if (['draw_polygon', 'draw_line'].includes(pluginState.mode)) {
+              return pluginState.numVertices > 0
+            }
+            return pluginState.undoStackLength > 0
+          }
+        },
+        {
+          id: 'drawSnap',
+          label: 'Snap to feature',
+          iconId: 'magnet',
+          hiddenWhen: ({ pluginState }) => !pluginState.mode || !pluginState.hasSnapLayers,
+          pressedWhen: ({ pluginState }) => !!pluginState.snap
+        },
+        {
+          id: 'drawDeletePoint',
+          label: 'Delete point',
+          iconId: 'trash',
+          enableWhen: ({ pluginState }) => {
+            if (pluginState.selectedVertexIndex < 0) { return false }
+            const isPolygon = pluginState.feature?.geometry?.type === 'Polygon'
+            return isPolygon ? pluginState.numVertices > 3 : pluginState.numVertices > 2 // NOSONAR
+          },
+          hiddenWhen: ({ pluginState }) => pluginState.mode !== 'edit_vertex'
+        }
+      ],
+      mobile: { slot: DRAW_ACTIONS_SLOT },
+      tablet: { slot: DRAW_ACTIONS_SLOT },
+      desktop: { slot: DRAW_ACTIONS_SLOT }
+    }
+  ],
+
+  keyboardShortcuts: [{
+    id: 'drawAddPoint',
+    group: 'Drawing',
+    title: 'Add point (draw)',
+    command: '<kbd>Enter</kbd>'
+  }, {
+    id: 'drawSelectPoint',
+    group: 'Drawing',
+    title: 'Select nearest point (edit)',
+    command: '<kbd>Spacebar</kbd>'
+  }, {
+    id: 'drawSelectAdjacentPoint',
+    group: 'Drawing',
+    title: 'Select adjacent point (edit)',
+    command: '<kbd>Alt</kbd> + <kbd>↑</kbd> <kbd>↓</kbd> <kbd>←</kbd> or <kbd>→</kbd>'
+  }, {
+    id: 'drawMovePoint',
+    group: 'Drawing',
+    title: 'Move point (edit)',
+    command: '<kbd>↑</kbd> <kbd>↓</kbd> <kbd>←</kbd> or <kbd>→</kbd>'
+  }, {
+    id: 'drawNudgePoint',
+    group: 'Drawing',
+    title: 'Nudge point (edit)',
+    command: '<kbd>Shift</kbd> + <kbd>↑</kbd> <kbd>↓</kbd> <kbd>←</kbd> or <kbd>→</kbd>'
+  }, {
+    id: 'drawDeletePoint',
+    group: 'Drawing',
+    title: 'Delete point (edit)',
+    command: '<kbd>Delete</kbd>'
+  }, {
+    id: 'drawUndo',
+    group: 'Drawing',
+    title: 'Undo',
+    command: undoCommand
+  }],
+
+  icons: [{
+    id: 'menu',
+    svgContent: '<path d="m6 9 6 6 6-6"/>'
+  }, {
+    id: 'undo',
+    svgContent: '<path d="M9 14 4 9l5-5"/><path d="M4 9h10.5a5.5 5.5 0 0 1 5.5 5.5a5.5 5.5 0 0 1-5.5 5.5H11"/>'
+  }, {
+    id: 'magnet',
+    svgContent: '<path d="m12 15 4 4"/><path d="M2.352 10.648a1.205 1.205 0 0 0 0 1.704l2.296 2.296a1.205 1.205 0 0 0 1.704 0l6.029-6.029a1 1 0 1 1 3 3l-6.029 6.029a1.205 1.205 0 0 0 0 1.704l2.296 2.296a1.205 1.205 0 0 0 1.704 0l6.365-6.367A1 1 0 0 0 8.716 4.282z"/><path d="m5 8 4 4"/>'
+  }, {
+    id: 'trash',
+    svgContent: '<path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/>'
+  }],
+
+  api: {
+    newPolygon,
+    newLine,
+    editFeature,
+    addFeature,
+    deleteFeature,
+    split,
+    merge
+  }
+}