@defra/interactive-map 0.0.40-alpha → 0.0.41-alpha

package/plugins/draw/src/adapters/maplibre/utils/snapHelpers.test.js

@@ -10,7 +10,8 @@ import {
   getSnapRadius,
   isSnapEnabled,
   createSnappedEvent,
-  createSnappedClickEvent
+  createSnappedClickEvent,
+  setAutoSnapSuspended
 } from './snapHelpers.js'
 import { TOLERANCES } from '../../../defaults.js'
 
@@ -87,7 +88,10 @@ describe('triggerSnapAtPoint', () => {
 
     expect(triggerSnapAtPoint(snap, map, point)).toBe(true)
     expect(map.unproject).toHaveBeenCalledWith(point)
-    expect(snap.snapToClosestPoint).toHaveBeenCalledWith({ point, lngLat })
+    // _explicit: true is what lets this call through snap/prototypePatches.js's suspend gate
+    // (see setAutoSnapSuspended) even while an edit mode's own offset-aware drag has silenced
+    // the snap library's own uncontrolled mousemove-driven auto-query.
+    expect(snap.snapToClosestPoint).toHaveBeenCalledWith({ point, lngLat, _explicit: true })
   })
 
   test('returns false when snap is missing', () => {
@@ -112,7 +116,7 @@ describe('triggerSnapAtCenter', () => {
 
     expect(triggerSnapAtCenter(snap, map)).toBe(true)
     expect(map.project).toHaveBeenCalledWith(center)
-    expect(snap.snapToClosestPoint).toHaveBeenCalledWith({ point, lngLat: center })
+    expect(snap.snapToClosestPoint).toHaveBeenCalledWith({ point, lngLat: center, _explicit: true })
   })
 
   test('returns false when snap is missing', () => {
@@ -196,6 +200,20 @@ describe('clearSnapState', () => {
   })
 })
 
+describe('setAutoSnapSuspended', () => {
+  test('sets the flag on the snap instance', () => {
+    const snap = {}
+    setAutoSnapSuspended(snap, true)
+    expect(snap._autoSnapSuspended).toBe(true)
+    setAutoSnapSuspended(snap, false)
+    expect(snap._autoSnapSuspended).toBe(false)
+  })
+
+  test('is a no-op when snap is nullish', () => {
+    expect(() => setAutoSnapSuspended(null, true)).not.toThrow()
+  })
+})
+
 describe('getSnapRadius', () => {
   test('returns the configured radius', () => {
     expect(getSnapRadius({ options: { radius: 25 } })).toBe(25)

package/plugins/draw/src/adapters/maplibre/utils/snapMovement.js

@@ -0,0 +1,59 @@
+import { KEYBOARD } from '../defaults.js'
+import {
+  getSnapInstance, isSnapActive, isSnapEnabled, getSnapLngLat,
+  getSnapRadius, triggerSnapAtPoint, clearSnapIndicator
+} from './snapHelpers.js'
+import { ARROW_OFFSETS } from './keyboardShortcuts.js'
+
+// Shared by editPointMode/pointOperations.js and editVertexMode/vertexOperations.js — a
+// keyboard/D-pad nudge resolves to the same pixel-offset-then-project-back coordinate math
+// and the same snap/break-out-of-snap rule for both a single-coordinate Point and a ring
+// vertex; only what happens to that resolved coordinate afterwards (moveVertex's ring
+// splice vs movePoint's direct updateCoordinate) differs, so that part stays local to
+// each mode's own operations file.
+export const sharedSnapMovement = {
+  getOffset (coord, e) {
+    const pt = this.map.project(coord)
+    const offset = e?.shiftKey ? KEYBOARD.nudgeAmount : KEYBOARD.stepAmount
+    const [dx, dy] = e ? ARROW_OFFSETS[e.key].map(v => v * offset) : [0, 0]
+    return this.map.unproject({ x: pt.x + dx, y: pt.y + dy })
+  },
+
+  // Explicit-delta counterpart to getOffset, driven by a unit direction vector and
+  // MoveControls' own Precision toggle rather than a KeyboardEvent — used by
+  // nudgeVertexByDelta/nudgePointByDelta.
+  getOffsetByDelta (coord, dx, dy, isLargeStep) {
+    const pt = this.map.project(coord)
+    const amount = isLargeStep ? KEYBOARD.stepAmount : KEYBOARD.nudgeAmount
+    return this.map.unproject({ x: pt.x + dx * amount, y: pt.y + dy * amount })
+  },
+
+  // Resolves the destination coordinate for a nudge by (dx, dy) unit direction, applying
+  // snap or breaking out of an already-active one — shared by the keyboard arrow-key path
+  // and MoveControls' explicit-delta path so both snap identically. dx/dy are only needed
+  // for the snap-escape offset; getCandidate computes the raw, un-snapped destination the
+  // caller would otherwise have used.
+  resolveSnapTarget (state, dx, dy, currentCoord, getCandidate) {
+    const snap = getSnapInstance(this.map)
+
+    // Break out of an active snap by moving beyond the snap radius
+    if (isSnapEnabled(state) && state._isSnapped && snap) {
+      const offset = getSnapRadius(snap) + 1
+      const pt = this.map.project(currentCoord)
+      state._isSnapped = false
+      clearSnapIndicator(snap, this.map)
+      return this.map.unproject({ x: pt.x + dx * offset, y: pt.y + dy * offset })
+    }
+
+    const newCoord = getCandidate()
+    if (isSnapEnabled(state) && snap) {
+      triggerSnapAtPoint(snap, this.map, this.map.project(newCoord))
+      if (isSnapActive(snap)) {
+        state._isSnapped = true
+        return getSnapLngLat(snap)
+      }
+    }
+    state._isSnapped = false
+    return newCoord
+  }
+}

package/plugins/draw/src/adapters/maplibre/utils/snapMovement.test.js

@@ -0,0 +1,73 @@
+import { sharedSnapMovement } from './snapMovement.js'
+
+// Deterministic projection: lngLat <-> pixel is a x10 scale (same convention as the mode
+// test harnesses this logic was extracted from).
+const project = (p) => {
+  const [lng, lat] = Array.isArray(p) ? p : [p.lng, p.lat]
+  return { x: lng * 10, y: lat * 10 }
+}
+const unproject = ({ x, y }) => ({ lng: x / 10, lat: y / 10 })
+
+const makeCtx = (snapOverrides) => ({
+  ...sharedSnapMovement,
+  map: {
+    project: jest.fn(project),
+    unproject: jest.fn(unproject),
+    getLayer: jest.fn(() => null),
+    setLayoutProperty: jest.fn(),
+    _snapInstance: snapOverrides
+  }
+})
+
+describe('getOffset', () => {
+  test('applies step/nudge amounts and returns the coord unchanged without an event', () => {
+    const ctx = makeCtx()
+    const stepped = ctx.getOffset([5, 5], { key: 'ArrowRight', shiftKey: false })
+    const nudged = ctx.getOffset([5, 5], { key: 'ArrowRight', shiftKey: true })
+    expect(stepped.lng).not.toBe(5)
+    expect(Math.abs(nudged.lng - 5)).toBeLessThan(Math.abs(stepped.lng - 5))
+    expect(ctx.getOffset([5, 5], null)).toEqual({ lng: 5, lat: 5 })
+  })
+})
+
+describe('getOffsetByDelta', () => {
+  test('applies step/nudge amounts along an explicit direction, mirroring getOffset\'s shiftKey polarity', () => {
+    const ctx = makeCtx()
+    const large = ctx.getOffsetByDelta([5, 5], 1, 0, true)
+    const small = ctx.getOffsetByDelta([5, 5], 1, 0, false)
+    expect(large.lng).not.toBe(5)
+    expect(Math.abs(small.lng - 5)).toBeLessThan(Math.abs(large.lng - 5))
+    expect(ctx.getOffsetByDelta([5, 5], 0, 0, true)).toEqual({ lng: 5, lat: 5 })
+  })
+})
+
+describe('resolveSnapTarget', () => {
+  test('is a no-op passthrough to the candidate coordinate when snap is disabled', () => {
+    const ctx = makeCtx()
+    const state = { getSnapEnabled: () => false }
+    const candidate = { lng: 3, lat: 4 }
+    expect(ctx.resolveSnapTarget(state, 1, 0, [0, 0], () => candidate)).toEqual(candidate)
+  })
+
+  test('snaps to a nearby target and breaks out of an active snap on the next call', () => {
+    const ctx = makeCtx({ status: true, snapStatus: true, snapCoords: [7, 8], snapToClosestPoint: jest.fn() })
+    const state = { getSnapEnabled: () => true }
+
+    const snapped = ctx.resolveSnapTarget(state, 0, -1, [5, 5], () => ({ lng: 5, lat: 4 }))
+    expect(state._isSnapped).toBe(true)
+    expect(snapped).toEqual({ lng: 7, lat: 8 })
+
+    // Already snapped → next call breaks out of the snap radius instead of re-snapping
+    const escaped = ctx.resolveSnapTarget(state, -1, 0, [7, 8], () => ({ lng: 6, lat: 8 }))
+    expect(state._isSnapped).toBe(false)
+    expect(escaped.lng).toBeLessThan(7)
+  })
+
+  test('falls back to the raw candidate when snap is enabled but inactive', () => {
+    const ctx = makeCtx({ status: true, snapStatus: false, snapCoords: null, snapToClosestPoint: jest.fn() })
+    const state = { getSnapEnabled: () => true }
+    const candidate = { lng: 6, lat: 6 }
+    expect(ctx.resolveSnapTarget(state, 1, 0, [5, 5], () => candidate)).toEqual(candidate)
+    expect(state._isSnapped).toBe(false)
+  })
+})

package/plugins/draw/src/adapters/maplibre/utils/touchDragMath.js

@@ -0,0 +1,33 @@
+import { getSnapInstance, isSnapEnabled, triggerSnapAtPoint, getSnapLngLat } from './snapHelpers.js'
+
+// Shared by editPointMode/touchHandlers.js and editVertexMode/touchHandlers.js — the offset-
+// drag math (touch position → target/coordinate deltas, then delta → snapped map coordinate)
+// is identical for both, since it's already single-coordinate, not ring-specific. Only what's
+// dragged (state.touchPointTarget/movePoint vs state.touchVertexTarget/moveVertex) differs,
+// which stays local to each mode's own touchHandlers.
+
+export const getTouchPoint = (e) => ({ x: e.touches[0].clientX, y: e.touches[0].clientY })
+
+// touchstart-time anchoring: the fixed offset between the finger and both the visible touch
+// target and the underlying map coordinate, so onTouchmove can re-derive each from the
+// finger's current position without drifting off its grab point.
+export const computeTouchDragAnchors = (map, targetEl, touch, coord, scale) => {
+  const style = window.getComputedStyle(targetEl)
+  const deltaTarget = { x: touch.x - Number.parseFloat(style.left), y: touch.y - Number.parseFloat(style.top) }
+  const coordPt = map.project(coord)
+  const deltaVertex = { x: (touch.x / scale) - coordPt.x, y: (touch.y / scale) - coordPt.y }
+  return { deltaTarget, deltaVertex }
+}
+
+// Resolves the current touch position (given the deltas computed above) to a map coordinate,
+// honouring snap — the mid-drag counterpart to computeTouchDragAnchors' touchstart-time setup.
+export const resolveTouchDragCoord = (map, state, touch) => {
+  const screenPt = { x: (touch.x / state.scale) - state.deltaVertex.x, y: (touch.y / state.scale) - state.deltaVertex.y }
+  let finalCoord = map.unproject(screenPt)
+  if (isSnapEnabled(state)) {
+    const snap = getSnapInstance(map)
+    triggerSnapAtPoint(snap, map, screenPt)
+    finalCoord = getSnapLngLat(snap) || finalCoord
+  }
+  return finalCoord
+}

package/plugins/draw/src/adapters/maplibre/utils/touchDragMath.test.js

@@ -0,0 +1,70 @@
+import { getTouchPoint, computeTouchDragAnchors, resolveTouchDragCoord } from './touchDragMath.js'
+
+// Deterministic projection: lngLat <-> pixel is a x10 scale (same convention as the mode
+// test harnesses this logic was extracted from).
+const project = (p) => {
+  const [lng, lat] = Array.isArray(p) ? p : [p.lng, p.lat]
+  return { x: lng * 10, y: lat * 10 }
+}
+const unproject = ({ x, y }) => ({ lng: x / 10, lat: y / 10 })
+
+afterEach(() => {
+  document.body.innerHTML = ''
+})
+
+describe('getTouchPoint', () => {
+  test('reads clientX/clientY off the first touch', () => {
+    expect(getTouchPoint({ touches: [{ clientX: 12, clientY: 34 }] })).toEqual({ x: 12, y: 34 })
+  })
+})
+
+describe('computeTouchDragAnchors', () => {
+  test('anchors both the visible target and the map coordinate to the touchstart position', () => {
+    const map = { project: jest.fn(project) }
+    const targetEl = document.createElement('div')
+    document.body.appendChild(targetEl)
+    targetEl.style.left = '15px'
+    targetEl.style.top = '25px'
+
+    const { deltaTarget, deltaVertex } = computeTouchDragAnchors(map, targetEl, { x: 20, y: 40 }, [5, 5], 1)
+
+    expect(deltaTarget).toEqual({ x: 5, y: 15 }) // touch position minus the target's current CSS position
+    expect(deltaVertex).toEqual({ x: -30, y: -10 }) // touch/scale minus the projected coord
+    expect(map.project).toHaveBeenCalledWith([5, 5])
+  })
+
+  test('divides the touch position by scale before anchoring the coordinate delta', () => {
+    const map = { project: jest.fn(project) }
+    const targetEl = document.createElement('div')
+    document.body.appendChild(targetEl)
+
+    const { deltaVertex } = computeTouchDragAnchors(map, targetEl, { x: 100, y: 100 }, [5, 5], 2)
+    expect(deltaVertex).toEqual({ x: 0, y: 0 }) // (100 / 2) - (5 * 10)
+  })
+})
+
+describe('resolveTouchDragCoord', () => {
+  test('unprojects the delta-adjusted touch position when snap is disabled', () => {
+    const map = { unproject: jest.fn(unproject) }
+    const state = { scale: 1, deltaVertex: { x: 10, y: 10 }, getSnapEnabled: () => false }
+    expect(resolveTouchDragCoord(map, state, { x: 30, y: 40 })).toEqual({ lng: 2, lat: 3 })
+  })
+
+  test('snaps to a nearby target when active', () => {
+    const map = {
+      unproject: jest.fn(unproject),
+      _snapInstance: { status: true, snapStatus: true, snapCoords: [7, 8], snapToClosestPoint: jest.fn() }
+    }
+    const state = { scale: 1, deltaVertex: { x: 0, y: 0 }, getSnapEnabled: () => true }
+    expect(resolveTouchDragCoord(map, state, { x: 10, y: 10 })).toEqual({ lng: 7, lat: 8 })
+  })
+
+  test('falls back to the raw coordinate when snap is enabled but inactive', () => {
+    const map = {
+      unproject: jest.fn(unproject),
+      _snapInstance: { status: true, snapStatus: false, snapCoords: null, snapToClosestPoint: jest.fn() }
+    }
+    const state = { scale: 1, deltaVertex: { x: 0, y: 0 }, getSnapEnabled: () => true }
+    expect(resolveTouchDragCoord(map, state, { x: 10, y: 10 })).toEqual({ lng: 1, lat: 1 })
+  })
+})

package/plugins/draw/src/adapters/openlayers/OLDrawAdapter.js

@@ -1,4 +1,5 @@
 import { createOLDraw } from './olDraw.js'
+import { resolvePointSymbol, hasSymbolStyle } from './point/pointSymbolImages.js'
 
 // split.js passes this literal — MapLibre's own always-present "already-drawn
 // shapes" style layer id — as a snapLayers entry so the split line snaps to the
@@ -25,7 +26,7 @@ const DRAW_OUTLINE_STYLE_LAYER = 'stroke-inactive.cold'
  *   setInterfaceType(type)
  *   done() / cancel() / undo() / deleteVertex()
  *   nudgeSelectedVertex(dx, dy, isLargeStep)
- *   get(id) / add(feature) / delete(id) / deleteAll()
+ *   get(id) / add(feature) / setStyle(id, properties) / delete(id) / deleteAll()
  *   setSnapEnabled(bool) / setSnapLayers(layers) / isSnapEnabled()
  *   setFeatureProperty(id, property, value) / setDrawingPreviewProperty(property, value)
  *   on(event, handler) / off(event, handler)
@@ -89,7 +90,31 @@ export class OLDrawAdapter {
   setInvalid (invalid) { this._manager.setInvalid(invalid) }
 
   get (id) { return this._manager.get(id) }
-  add (feature) { return this._manager.add(feature) }
+
+  // A directly-added Point (e.g. api/addFeature.js) skips draw_point's own icon-resolving
+  // drawend handler, so it must be resolved here instead — mirrors MaplibreDrawAdapter.js.
+  add (feature) {
+    const olFeature = this._manager.add(feature)
+    if (feature.geometry?.type === 'Point' && hasSymbolStyle(feature.properties)) {
+      resolvePointSymbol({ manager: this._manager, mapProvider: this._mapProvider, olFeature })
+    }
+    return olFeature
+  }
+
+  // Patches an existing feature's style properties (stroke/fill/strokeWidth or symbol-family
+  // keys) and re-renders — setProperties() must not be called silently, since VectorSource
+  // only redraws in response to the propertychange event that triggers.
+  setStyle (id, properties) {
+    const olFeature = this._manager.store.getOL(id)
+    if (!olFeature) {
+      return
+    }
+    olFeature.setProperties(properties)
+    if (olFeature.getGeometry()?.getType() === 'Point' && hasSymbolStyle(olFeature.getProperties())) {
+      resolvePointSymbol({ manager: this._manager, mapProvider: this._mapProvider, olFeature })
+    }
+  }
+
   delete (id) { return this._manager.delete(id) }
   deleteAll () { return this._manager.deleteAll() }
 

package/plugins/draw/src/adapters/openlayers/OLDrawAdapter.test.js

@@ -1,5 +1,6 @@
 import { OLDrawAdapter } from './OLDrawAdapter.js'
 import { createOLDraw } from './olDraw.js'
+import { resolvePointSymbol, hasSymbolStyle } from './point/pointSymbolImages.js'
 
 // The literal split.js passes — see OLDrawAdapter.js's DRAW_OUTLINE_STYLE_LAYER comment.
 const DRAW_OUTLINE_STYLE_LAYER = 'stroke-inactive.cold'
@@ -20,6 +21,7 @@ const fakeManager = () => ({
   setDrawingPreviewProperty: jest.fn(),
   get: jest.fn(() => 'feature'),
   add: jest.fn(),
+  store: { getOL: jest.fn() },
   delete: jest.fn(),
   deleteAll: jest.fn(),
   on: jest.fn(),
@@ -31,6 +33,10 @@ const fakeManager = () => ({
 jest.mock('./olDraw.js', () => ({
   createOLDraw: jest.fn(({ mapProvider }) => ({ manager: mapProvider._testManager, remove: jest.fn() }))
 }))
+jest.mock('./point/pointSymbolImages.js', () => ({
+  resolvePointSymbol: jest.fn(),
+  hasSymbolStyle: jest.fn()
+}))
 
 const setup = () => {
   const manager = fakeManager()
@@ -132,6 +138,93 @@ test('remaining calls delegate straight through; setFeatureProperty is a deliber
   expect(manager.nudgeSelectedVertex).toHaveBeenCalledWith(1, 0, true)
 })
 
+// A directly-added Point skips draw_point's own icon-resolving drawend handler.
+describe('add() and point symbol resolution', () => {
+  test('resolves the symbol for a Point feature with symbol properties', () => {
+    const { manager, mapProvider, adapter } = setup()
+    const olFeature = {}
+    manager.add.mockReturnValue(olFeature)
+    hasSymbolStyle.mockReturnValue(true)
+    const feature = { geometry: { type: 'Point', coordinates: [0, 0] }, properties: { symbol: 'pin' } }
+
+    const result = adapter.add(feature)
+
+    expect(manager.add).toHaveBeenCalledWith(feature)
+    expect(hasSymbolStyle).toHaveBeenCalledWith({ symbol: 'pin' })
+    expect(resolvePointSymbol).toHaveBeenCalledWith({ manager, mapProvider, olFeature })
+    expect(result).toBe(olFeature)
+  })
+
+  test('does not attempt resolution for a Point with no symbol properties', () => {
+    const { manager, adapter } = setup()
+    manager.add.mockReturnValue({})
+    hasSymbolStyle.mockReturnValue(false)
+    adapter.add({ geometry: { type: 'Point', coordinates: [0, 0] }, properties: {} })
+    expect(resolvePointSymbol).not.toHaveBeenCalled()
+  })
+
+  test('does not attempt resolution for a non-Point geometry', () => {
+    const { manager, adapter } = setup()
+    manager.add.mockReturnValue({})
+    adapter.add({ geometry: { type: 'Polygon', coordinates: [[]] }, properties: { symbol: 'pin' } })
+    expect(hasSymbolStyle).not.toHaveBeenCalled()
+    expect(resolvePointSymbol).not.toHaveBeenCalled()
+  })
+
+  test('does not attempt resolution for a feature with no geometry', () => {
+    const { manager, adapter } = setup()
+    manager.add.mockReturnValue({})
+    adapter.add({ id: 'b' })
+    expect(resolvePointSymbol).not.toHaveBeenCalled()
+  })
+})
+
+describe('setStyle()', () => {
+  const fakeOLFeature = (geometryType) => ({
+    setProperties: jest.fn(),
+    getGeometry: jest.fn(() => ({ getType: () => geometryType })),
+    getProperties: jest.fn(() => ({}))
+  })
+
+  test('patches the feature\'s properties (not silently, so VectorSource still redraws)', () => {
+    const { manager, adapter } = setup()
+    const olFeature = fakeOLFeature('Polygon')
+    manager.store.getOL.mockReturnValue(olFeature)
+
+    adapter.setStyle('a', { stroke: 'blue' })
+
+    expect(manager.store.getOL).toHaveBeenCalledWith('a')
+    expect(olFeature.setProperties).toHaveBeenCalledWith({ stroke: 'blue' })
+  })
+
+  // setStyle re-resolves a Point's icon the same way add() does for a directly-added one.
+  test('re-resolves the icon for a Point patched with symbol properties', () => {
+    const { manager, mapProvider, adapter } = setup()
+    const olFeature = fakeOLFeature('Point')
+    manager.store.getOL.mockReturnValue(olFeature)
+    hasSymbolStyle.mockReturnValue(true)
+
+    adapter.setStyle('p1', { symbolBackgroundColor: '#ca3535' })
+
+    expect(resolvePointSymbol).toHaveBeenCalledWith({ manager, mapProvider, olFeature })
+  })
+
+  test('does not attempt resolution for a non-Point geometry', () => {
+    const { manager, adapter } = setup()
+    const olFeature = fakeOLFeature('Polygon')
+    manager.store.getOL.mockReturnValue(olFeature)
+    adapter.setStyle('a', { stroke: 'blue' })
+    expect(resolvePointSymbol).not.toHaveBeenCalled()
+  })
+
+  test('does nothing for an id with no existing feature', () => {
+    const { manager, adapter } = setup()
+    manager.store.getOL.mockReturnValue(null)
+    expect(() => adapter.setStyle('missing', { stroke: 'blue' })).not.toThrow()
+    expect(resolvePointSymbol).not.toHaveBeenCalled()
+  })
+})
+
 test('setGeometryValid records validity on the manager for finish gating', () => {
   const { adapter, manager } = setup()
   adapter.setGeometryValid(false)

package/plugins/draw/src/adapters/openlayers/__helpers__/harness.js

@@ -1,6 +1,7 @@
 import Feature from 'ol/Feature.js'
 import Polygon from 'ol/geom/Polygon.js'
 import LineString from 'ol/geom/LineString.js'
+import Point from 'ol/geom/Point.js'
 import Style from 'ol/style/Style.js'
 import { createUndoStack } from '../../../utils/undoStack.js'
 
@@ -41,6 +42,7 @@ export const createFakeMap = ({ center = [50, 50] } = {}) => {
     getCoordinateFromPixel: (p) => [p[0], p[1]],
     getEventPixel: (e) => [e.clientX, e.clientY],
     getView: () => view,
+    forEachFeatureAtPixel: jest.fn(() => undefined),
     render: jest.fn()
   }
 }
@@ -60,6 +62,7 @@ export const createFakeManager = () => {
       midpointStyle: new Style({}),
       selectedVertexStyle: new Style({}),
       selectedMidpointStyle: new Style({}),
+      selectedPointStyleFor: jest.fn(() => new Style({})),
       createSketchStyle: jest.fn(() => () => [])
     },
     colors: { editVertex: 'rgba(29,112,184,1)' },
@@ -79,6 +82,12 @@ export const lineFeature = (coords, id = 'f1') => {
   return feature
 }
 
+export const pointFeature = (coord, id = 'f1') => {
+  const feature = new Feature(new Point(coord))
+  feature.setId(id)
+  return feature
+}
+
 export const createContainer = () => {
   const container = document.createElement('div')
   container.tabIndex = 0

package/plugins/draw/src/adapters/openlayers/core/OLDrawManager.js

@@ -6,6 +6,9 @@ import { resolveColors } from '../../../utils/resolveColors.js'
 import { createSnapManager } from '../snap/snapManager.js'
 import { createDrawMode } from '../draw/DrawMode.js'
 import { createEditMode } from '../edit/EditMode.js'
+import { createEditPointMode } from '../point/editPointMode.js'
+import { createDrawPointMode } from '../point/drawPointMode.js'
+import { resolvePointSymbol } from '../point/pointSymbolImages.js'
 import { TOLERANCES } from '../defaults.js'
 import { ADAPTER_EVENTS } from '../../../adapterEvents.js'
 import { STYLES_CHANGED_EVENT } from './internalEvents.js'
@@ -31,6 +34,11 @@ export class OLDrawManager {
     this.store = createFeatureStore()
     this.undoStack = createUndoStack((length) => this.emit(ADAPTER_EVENTS.UNDO_CHANGE, length))
 
+    // Tracked (not just derived into colors/styles) so point/pointSymbolImages.js has
+    // something to pass to symbolRegistry.rasteriseSymbolImage() when resolving a point's
+    // icon on demand, independent of whatever triggered the resolve.
+    this.mapStyle = null
+
     this.colors = resolveColors(null, pluginConfig)
     this.styles = createStyles(this.colors)
     this.snap = createSnapManager(map, pluginConfig.snapLayers ?? null, this.colors, pluginConfig.snapRadius ?? TOLERANCES.snapRadius)
@@ -47,6 +55,7 @@ export class OLDrawManager {
   // --- Color / style updates ---
 
   setMapStyle (mapStyle) {
+    this.mapStyle = mapStyle
     this.colors = resolveColors(mapStyle, this._pluginConfig)
     this.styles = createStyles(this.colors)
     this._layer.setStyle(this.styles.createFeatureStyle())
@@ -84,15 +93,24 @@ export class OLDrawManager {
     this._modeInstance = null
     this._mode = modeName
 
-    const isDrawMode = modeName === 'draw_polygon' || modeName === 'draw_line' || modeName === 'edit_vertex'
+    const isDrawMode = modeName === 'draw_polygon' || modeName === 'draw_line' || modeName === 'draw_point' || modeName === 'edit_vertex' || modeName === 'edit_point'
     this.snap?.setIndicatorActive(isDrawMode)
 
     const modeOptions = { ...options, snap: this.snap }
 
     if (modeName === 'draw_polygon' || modeName === 'draw_line') {
       this._modeInstance = createDrawMode({ map: this._map, manager: this, options: modeOptions })
+    } else if (modeName === 'draw_point') {
+      // Injected here (rather than imported directly by drawPointMode.js) so the mode only
+      // ever calls options.resolvePointSymbol(...) and stays free of a direct dependency on
+      // symbolRegistry/mapProvider — mirrors the ML adapter's own state.resolvePointSymbol
+      // convention (see MaplibreDrawAdapter.js's changeMode).
+      const pointOptions = { ...modeOptions, resolvePointSymbol: (olFeature) => resolvePointSymbol({ manager: this, mapProvider: options.mapProvider, olFeature }) }
+      this._modeInstance = createDrawPointMode({ map: this._map, manager: this, options: pointOptions })
     } else if (modeName === 'edit_vertex') {
       this._modeInstance = createEditMode({ map: this._map, manager: this, options: modeOptions })
+    } else if (modeName === 'edit_point') {
+      this._modeInstance = createEditPointMode({ map: this._map, manager: this, options: modeOptions })
     } else {
       // disabled — no mode instance needed
     }

package/plugins/draw/src/adapters/openlayers/core/OLDrawManager.test.js

@@ -2,6 +2,9 @@ import { OLDrawManager } from './OLDrawManager.js'
 import { STYLES_CHANGED_EVENT } from './internalEvents.js'
 import { createDrawMode } from '../draw/DrawMode.js'
 import { createEditMode } from '../edit/EditMode.js'
+import { createEditPointMode } from '../point/editPointMode.js'
+import { createDrawPointMode } from '../point/drawPointMode.js'
+import { resolvePointSymbol } from '../point/pointSymbolImages.js'
 import { createSnapManager } from '../snap/snapManager.js'
 import { ADAPTER_EVENTS } from '../../../adapterEvents.js'
 import { createFakeMap } from '../__helpers__/harness.js'
@@ -13,6 +16,15 @@ jest.mock('../draw/DrawMode.js', () => ({
 jest.mock('../edit/EditMode.js', () => ({
   createEditMode: jest.fn(() => ({ destroy: jest.fn(), done: jest.fn(), cancel: jest.fn(), undo: jest.fn(), deleteVertex: jest.fn(), nudgeSelectedVertex: jest.fn(), setInterfaceType: jest.fn(), setInvalid: jest.fn() }))
 }))
+jest.mock('../point/editPointMode.js', () => ({
+  createEditPointMode: jest.fn(() => ({ destroy: jest.fn(), done: jest.fn(), cancel: jest.fn(), undo: jest.fn(), deleteVertex: jest.fn(), nudgeSelectedVertex: jest.fn(), setInterfaceType: jest.fn(), setInvalid: jest.fn() }))
+}))
+jest.mock('../point/drawPointMode.js', () => ({
+  createDrawPointMode: jest.fn(() => ({ destroy: jest.fn(), done: jest.fn(), cancel: jest.fn(), undo: jest.fn(), setInterfaceType: jest.fn() }))
+}))
+jest.mock('../point/pointSymbolImages.js', () => ({
+  resolvePointSymbol: jest.fn()
+}))
 jest.mock('../snap/snapManager.js', () => ({
   createSnapManager: jest.fn(() => ({ setIndicatorActive: jest.fn(), reattach: jest.fn(), updateColors: jest.fn(), destroy: jest.fn() }))
 }))
@@ -52,7 +64,8 @@ describe('mode machine', () => {
   test.each([
     ['draw_polygon', createDrawMode],
     ['draw_line', createDrawMode],
-    ['edit_vertex', createEditMode]
+    ['edit_vertex', createEditMode],
+    ['edit_point', createEditPointMode]
   ])('%s creates its mode with snap injected, activates the indicator and reattaches snap last', async (name, factory) => {
     const { map, manager } = setup()
     await manager.changeMode(name, { featureId: 'f1' })
@@ -62,6 +75,26 @@ describe('mode machine', () => {
     expect(manager.snap.reattach).toHaveBeenCalled()
   })
 
+  // draw_point gets an extra options key (resolvePointSymbol) the other modes don't — see
+  // OLDrawManager.js's changeMode comment — so it's asserted separately rather than folded
+  // into the table above.
+  test('draw_point creates its mode with snap and resolvePointSymbol injected, activates the indicator and reattaches snap last', async () => {
+    const { map, manager } = setup()
+    const mapProvider = { drawScale: 2 }
+    await manager.changeMode('draw_point', { featureId: 'f1', mapProvider })
+    expect(manager.getMode()).toBe('draw_point')
+    expect(createDrawPointMode).toHaveBeenCalledWith({ map, manager, options: { featureId: 'f1', mapProvider, snap: manager.snap, resolvePointSymbol: expect.any(Function) } })
+    expect(manager.snap.setIndicatorActive).toHaveBeenCalledWith(true)
+    expect(manager.snap.reattach).toHaveBeenCalled()
+
+    // The injected hook delegates to point/pointSymbolImages.js's resolvePointSymbol with
+    // this manager and the mapProvider changeMode was called with.
+    const injected = createDrawPointMode.mock.calls.at(-1)[0].options.resolvePointSymbol
+    const olFeature = { id: 'point-1' }
+    injected(olFeature)
+    expect(resolvePointSymbol).toHaveBeenCalledWith({ manager, mapProvider, olFeature })
+  })
+
   test('disabled destroys the previous mode and deactivates the indicator', async () => {
     const { manager } = setup()
     await manager.changeMode('draw_polygon')