@defra/interactive-map 0.0.17-alpha → 0.0.18-alpha

package/src/utils/patternUtils.test.js

@@ -0,0 +1,160 @@
+import {
+  hashString,
+  injectColors,
+  hasPattern,
+  getPatternInnerContent,
+  getPatternImageId,
+  getKeyPatternPaths,
+  KEY_BORDER_PATH
+} from './patternUtils.js'
+
+const mockRegistry = {
+  get: (id) => id === 'dot' ? { id: 'dot', svgContent: '<path d="M4 4" fill="{{foregroundColor}}"/>' } : undefined
+}
+
+describe('hashString', () => {
+  test('returns a non-empty string', () => {
+    expect(typeof hashString('hello')).toBe('string')
+    expect(hashString('hello').length).toBeGreaterThan(0)
+  })
+
+  test('is deterministic', () => {
+    expect(hashString('hello')).toBe(hashString('hello'))
+  })
+
+  test('produces different values for different inputs', () => {
+    expect(hashString('a')).not.toBe(hashString('b'))
+  })
+})
+
+describe('injectColors', () => {
+  test('replaces {{foregroundColor}} and {{backgroundColor}} tokens', () => {
+    const result = injectColors('fill="{{foregroundColor}}" bg="{{backgroundColor}}"', 'red', 'blue')
+    expect(result).toBe('fill="red" bg="blue"')
+  })
+
+  test('replaces all occurrences', () => {
+    const result = injectColors('{{foregroundColor}} {{foregroundColor}}', 'red', 'blue')
+    expect(result).toBe('red red')
+  })
+
+  test('uses fallback "black" when foregroundColor is falsy', () => {
+    expect(injectColors('{{foregroundColor}}', '', 'blue')).toBe('black')
+  })
+
+  test('uses fallback "transparent" when backgroundColor is falsy', () => {
+    expect(injectColors('{{backgroundColor}}', 'red', '')).toBe('transparent')
+  })
+})
+
+describe('hasPattern', () => {
+  test('returns true when fillPattern is set', () => {
+    expect(hasPattern({ fillPattern: 'dot' })).toBe(true)
+  })
+
+  test('returns true when fillPatternSvgContent is set', () => {
+    expect(hasPattern({ fillPatternSvgContent: '<path/>' })).toBe(true)
+  })
+
+  test('returns false when neither is set', () => {
+    expect(hasPattern({})).toBe(false)
+    expect(hasPattern({ fill: 'red' })).toBe(false)
+  })
+})
+
+describe('getPatternInnerContent', () => {
+  test('returns fillPatternSvgContent when set (inline SVG takes precedence)', () => {
+    const dataset = { fillPatternSvgContent: '<path d="custom"/>', fillPattern: 'dot' }
+    expect(getPatternInnerContent(dataset, mockRegistry)).toBe('<path d="custom"/>')
+  })
+
+  test('returns svgContent from registry for a named fillPattern', () => {
+    const dataset = { fillPattern: 'dot' }
+    expect(getPatternInnerContent(dataset, mockRegistry)).toBe('<path d="M4 4" fill="{{foregroundColor}}"/>')
+  })
+
+  test('returns null for an unregistered fillPattern name', () => {
+    const dataset = { fillPattern: 'unknown-pattern' }
+    expect(getPatternInnerContent(dataset, mockRegistry)).toBeNull()
+  })
+
+  test('returns null when no pattern is configured', () => {
+    expect(getPatternInnerContent({}, mockRegistry)).toBeNull()
+  })
+})
+
+describe('getPatternImageId', () => {
+  test('returns a deterministic string id', () => {
+    const dataset = { fillPattern: 'dot', fillPatternForegroundColor: 'red', fillPatternBackgroundColor: 'blue' }
+    const id = getPatternImageId(dataset, 'style-a', mockRegistry)
+    expect(typeof id).toBe('string')
+    expect(id).toMatch(/^pattern-/)
+    expect(id).toBe(getPatternImageId(dataset, 'style-a', mockRegistry))
+  })
+
+  test('returns null when no pattern content is found', () => {
+    expect(getPatternImageId({ fillPattern: 'unknown' }, 'style-a', mockRegistry)).toBeNull()
+  })
+
+  test('produces different ids for different colours', () => {
+    const base = { fillPattern: 'dot' }
+    const idA = getPatternImageId({ ...base, fillPatternForegroundColor: 'red' }, 'style-a', mockRegistry)
+    const idB = getPatternImageId({ ...base, fillPatternForegroundColor: 'blue' }, 'style-a', mockRegistry)
+    expect(idA).not.toBe(idB)
+  })
+
+  test('falls back to "black" foreground and "transparent" background when colours are absent', () => {
+    const id = getPatternImageId({ fillPattern: 'dot' }, 'style-a', mockRegistry)
+    const idExplicit = getPatternImageId(
+      { fillPattern: 'dot', fillPatternForegroundColor: 'black', fillPatternBackgroundColor: 'transparent' },
+      'style-a',
+      mockRegistry
+    )
+    expect(id).toBe(idExplicit)
+  })
+})
+
+describe('getKeyPatternPaths', () => {
+  test('returns border and content strings with colours injected', () => {
+    const dataset = {
+      fillPattern: 'dot',
+      fillPatternForegroundColor: 'red',
+      fillPatternBackgroundColor: 'white',
+      stroke: 'black'
+    }
+    const result = getKeyPatternPaths(dataset, 'style-a', mockRegistry)
+    expect(result).not.toBeNull()
+    expect(result.border).toContain('black') // stroke colour
+    expect(result.border).toContain('white') // background colour
+    expect(result.content).toContain('red') // foreground colour
+    expect(result.border).not.toContain('{{foregroundColor}}')
+    expect(result.content).not.toContain('{{foregroundColor}}')
+  })
+
+  test('returns null when no pattern content is found', () => {
+    expect(getKeyPatternPaths({ fillPattern: 'unknown' }, 'style-a', mockRegistry)).toBeNull()
+  })
+
+  test('falls back to "black" fg and "transparent" bg when colour properties are absent', () => {
+    const result = getKeyPatternPaths({ fillPattern: 'dot' }, 'style-a', mockRegistry)
+    expect(result).not.toBeNull()
+    expect(result.content).toContain('black')
+    expect(result.border).toContain('transparent')
+  })
+
+  test('border stroke falls back to foreground colour when stroke is absent', () => {
+    const result = getKeyPatternPaths(
+      { fillPattern: 'dot', fillPatternForegroundColor: 'green' },
+      'style-a',
+      mockRegistry
+    )
+    expect(result).not.toBeNull()
+    // borderStroke falls back to fg ('green'), so the border uses green for both stroke and background
+    expect(result.border).toContain('green')
+  })
+
+  test('KEY_BORDER_PATH contains foregroundColor and backgroundColor tokens', () => {
+    expect(KEY_BORDER_PATH).toContain('{{foregroundColor}}')
+    expect(KEY_BORDER_PATH).toContain('{{backgroundColor}}')
+  })
+})

package/src/utils/symbolUtils.js

@@ -0,0 +1,85 @@
+// Symbol style props in dataset style that carry token values.
+// These use the 'symbol' prefix to distinguish them from fill/stroke props at the same level.
+// The prefix is stripped before passing tokens to the registry (e.g. symbolBackgroundColor → backgroundColor).
+const SYMBOL_STYLE_PROPS = new Set([
+  'symbolBackgroundColor', 'symbolForegroundColor',
+  'symbolHaloWidth', 'symbolGraphic'
+])
+
+/**
+ * Returns true if this dataset should be rendered as a symbol (point) layer.
+ * @param {Object} dataset
+ * @returns {boolean}
+ */
+export const hasSymbol = (dataset) => !!(dataset.symbol || dataset.symbolSvgContent)
+
+/**
+ * Resolves the symbolDef for a dataset's symbol config.
+ *
+ * dataset.symbol is a string symbol ID (e.g. 'pin').
+ * dataset.symbolSvgContent is inline SVG content for a custom symbol.
+ *
+ * @param {Object} dataset
+ * @param {Object} symbolRegistry
+ * @returns {Object|undefined}
+ */
+export const getSymbolDef = (dataset, symbolRegistry) => {
+  if (dataset.symbolSvgContent) {
+    return { svg: dataset.symbolSvgContent }
+  }
+  if (dataset.symbol) {
+    return symbolRegistry.get(dataset.symbol)
+  }
+  return undefined
+}
+
+/**
+ * Extracts token overrides from a dataset's flat symbol style props.
+ * Strips the 'symbol' prefix to produce internal token names (e.g. symbolBackgroundColor → backgroundColor).
+ * Returns an empty object when no symbol is configured.
+ *
+ * @param {Object} dataset
+ * @returns {Object}
+ */
+export const getSymbolStyleColors = (dataset) => {
+  if (!hasSymbol(dataset)) { return {} }
+  const tokens = {}
+  SYMBOL_STYLE_PROPS.forEach(key => {
+    if (dataset[key] != null) {
+      // Strip 'symbol' prefix: symbolBackgroundColor → backgroundColor
+      const tokenKey = key.charAt(6).toLowerCase() + key.slice(7) // NOSONAR
+      tokens[tokenKey] = dataset[key]
+    }
+  })
+  return tokens
+}
+
+/**
+ * Returns the viewBox string for a dataset's symbol.
+ * Precedence: dataset.symbolViewBox → symbolDef viewBox → default.
+ *
+ * @param {Object} dataset
+ * @param {Object|undefined} symbolDef
+ * @returns {string}
+ */
+export const getSymbolViewBox = (dataset, symbolDef) => {
+  if (dataset.symbolViewBox) {
+    return dataset.symbolViewBox
+  }
+  return symbolDef?.viewBox ?? '0 0 38 38'
+}
+
+/**
+ * Returns the anchor for a dataset's symbol as [x, y] in 0–1 space.
+ * Precedence: dataset.symbolAnchor → symbolDef anchor → [0.5, 0.5].
+ *
+ * @param {Object} dataset
+ * @param {Object|undefined} symbolDef
+ * @returns {number[]}
+ */
+export const getSymbolAnchor = (dataset, symbolDef) => {
+  if (dataset.symbolAnchor) {
+    return dataset.symbolAnchor
+  }
+  return symbolDef?.anchor ?? [0.5, 0.5]
+}

package/src/utils/symbolUtils.test.js

@@ -0,0 +1,156 @@
+import {
+  hasSymbol,
+  getSymbolDef,
+  getSymbolStyleColors,
+  getSymbolViewBox,
+  getSymbolAnchor
+} from './symbolUtils.js'
+
+const mockRegistry = (defs = {}) => ({
+  get: jest.fn((id) => defs[id])
+})
+
+// ─── hasSymbol ────────────────────────────────────────────────────────────────
+
+describe('hasSymbol', () => {
+  it('returns true when dataset has a symbol string', () => {
+    expect(hasSymbol({ symbol: 'pin' })).toBe(true)
+  })
+
+  it('returns true when dataset has symbolSvgContent', () => {
+    expect(hasSymbol({ symbolSvgContent: '<circle/>' })).toBe(true)
+  })
+
+  it('returns false when symbol is absent', () => {
+    expect(hasSymbol({})).toBe(false)
+  })
+
+  it('returns false when symbol is null', () => {
+    expect(hasSymbol({ symbol: null })).toBe(false)
+  })
+})
+
+// ─── getSymbolDef ─────────────────────────────────────────────────────────────
+
+describe('getSymbolDef', () => {
+  it('returns undefined when dataset has no symbol', () => {
+    expect(getSymbolDef({}, mockRegistry())).toBeUndefined()
+  })
+
+  it('looks up string symbol id in the registry', () => {
+    const pinDef = { id: 'pin', svg: '<g/>' }
+    const registry = mockRegistry({ pin: pinDef })
+    expect(getSymbolDef({ symbol: 'pin' }, registry)).toBe(pinDef)
+  })
+
+  it('returns undefined for an unregistered string symbol', () => {
+    expect(getSymbolDef({ symbol: 'missing' }, mockRegistry())).toBeUndefined()
+  })
+
+  it('returns inline def from symbolSvgContent with svg key', () => {
+    const dataset = { symbolSvgContent: '<circle/>', symbolViewBox: '0 0 10 10' }
+    const result = getSymbolDef(dataset, mockRegistry())
+    expect(result.svg).toBe('<circle/>')
+  })
+
+  it('symbolSvgContent takes precedence over symbol id', () => {
+    const pinDef = { id: 'pin', svg: '<g/>' }
+    const registry = mockRegistry({ pin: pinDef })
+    const result = getSymbolDef({ symbol: 'pin', symbolSvgContent: '<circle/>' }, registry)
+    expect(result.svg).toBe('<circle/>')
+  })
+})
+
+// ─── getSymbolStyleColors ─────────────────────────────────────────────────────
+
+describe('getSymbolStyleColors', () => {
+  it('returns empty object when dataset has no symbol', () => {
+    expect(getSymbolStyleColors({})).toEqual({})
+  })
+
+  it('returns empty object for string symbol with no token props', () => {
+    expect(getSymbolStyleColors({ symbol: 'pin' })).toEqual({})
+  })
+
+  it('strips symbol prefix from token props', () => {
+    const dataset = {
+      symbol: 'pin',
+      symbolBackgroundColor: '#ff0000',
+      symbolForegroundColor: '#ffffff',
+      symbolHaloWidth: '2',
+      symbolGraphic: 'cross'
+    }
+    expect(getSymbolStyleColors(dataset)).toEqual({
+      backgroundColor: '#ff0000',
+      foregroundColor: '#ffffff',
+      haloWidth: '2',
+      graphic: 'cross'
+    })
+  })
+
+  it('works with symbolSvgContent instead of symbol id', () => {
+    const dataset = { symbolSvgContent: '<circle/>', symbolBackgroundColor: '#0000ff' }
+    expect(getSymbolStyleColors(dataset)).toEqual({ backgroundColor: '#0000ff' })
+  })
+
+  it('omits token props that are null or undefined', () => {
+    const dataset = { symbol: 'pin', symbolBackgroundColor: '#ff0000', symbolForegroundColor: null }
+    const result = getSymbolStyleColors(dataset)
+    expect(result).toEqual({ backgroundColor: '#ff0000' })
+    expect(result).not.toHaveProperty('foregroundColor')
+  })
+
+  it('supports style-keyed colour objects', () => {
+    const dataset = {
+      symbol: 'pin',
+      symbolBackgroundColor: { outdoor: '#1d70b8', dark: '#5694ca' }
+    }
+    expect(getSymbolStyleColors(dataset)).toEqual({
+      backgroundColor: { outdoor: '#1d70b8', dark: '#5694ca' }
+    })
+  })
+})
+
+// ─── getSymbolViewBox ─────────────────────────────────────────────────────────
+
+describe('getSymbolViewBox', () => {
+  it('returns symbolViewBox from dataset', () => {
+    const dataset = { symbol: 'custom', symbolViewBox: '0 0 24 24' }
+    expect(getSymbolViewBox(dataset, undefined)).toBe('0 0 24 24')
+  })
+
+  it('falls back to symbolDef viewBox', () => {
+    const symbolDef = { id: 'pin', viewBox: '0 0 38 38' }
+    expect(getSymbolViewBox({ symbol: 'pin' }, symbolDef)).toBe('0 0 38 38')
+  })
+
+  it('returns default viewBox when neither source has one', () => {
+    expect(getSymbolViewBox({ symbol: 'pin' }, {})).toBe('0 0 38 38')
+  })
+
+  it('returns default viewBox when symbolDef is undefined', () => {
+    expect(getSymbolViewBox({ symbol: 'pin' }, undefined)).toBe('0 0 38 38')
+  })
+})
+
+// ─── getSymbolAnchor ──────────────────────────────────────────────────────────
+
+describe('getSymbolAnchor', () => {
+  it('returns symbolAnchor from dataset', () => {
+    const dataset = { symbol: 'custom', symbolAnchor: [0.5, 0.9] }
+    expect(getSymbolAnchor(dataset, undefined)).toEqual([0.5, 0.9])
+  })
+
+  it('falls back to symbolDef anchor', () => {
+    const symbolDef = { id: 'pin', anchor: [0.5, 0.9] }
+    expect(getSymbolAnchor({ symbol: 'pin' }, symbolDef)).toEqual([0.5, 0.9])
+  })
+
+  it('returns default [0.5, 0.5] when neither source has an anchor', () => {
+    expect(getSymbolAnchor({ symbol: 'pin' }, {})).toEqual([0.5, 0.5])
+  })
+
+  it('returns default [0.5, 0.5] when symbolDef is undefined', () => {
+    expect(getSymbolAnchor({ symbol: 'pin' }, undefined)).toEqual([0.5, 0.5])
+  })
+})

package/plugins/beta/datasets/src/adapters/maplibre/patternRegistry.js

@@ -1,48 +0,0 @@
-import { hasPattern, getPatternImageId, rasterisePattern } from '../../styles/patterns.js'
-import { mergeSublayer } from '../../utils/mergeSublayer.js'
-
-/**
- * Collect all style configs that require a pattern image: top-level datasets
- * and any sublayers whose merged style has a pattern.
- * @param {Object[]} datasets
- * @returns {Object[]}
- */
-const getPatternConfigs = (datasets) =>
-  datasets.flatMap(dataset => {
-    const configs = hasPattern(dataset) ? [dataset] : []
-    if (dataset.sublayers?.length) {
-      dataset.sublayers.forEach(sublayer => {
-        const merged = mergeSublayer(dataset, sublayer)
-        if (hasPattern(merged)) {
-          configs.push(merged)
-        }
-      })
-    }
-    return configs
-  })
-
-/**
- * Register all required pattern images with the map.
- * Skips images that are already registered (safe to call on style change).
- * @param {Object} map - MapLibre map instance
- * @param {Object[]} datasets
- * @param {string} mapStyleId
- * @returns {Promise<void>}
- */
-export const registerPatterns = async (map, datasets, mapStyleId) => {
-  const patternConfigs = getPatternConfigs(datasets)
-  if (!patternConfigs.length) {
-    return
-  }
-
-  await Promise.all(patternConfigs.map(async (config) => {
-    const imageId = getPatternImageId(config, mapStyleId)
-    if (!imageId || map.hasImage(imageId)) {
-      return
-    }
-    const result = await rasterisePattern(config, mapStyleId)
-    if (result) {
-      map.addImage(result.imageId, result.imageData, { pixelRatio: 2 })
-    }
-  }))
-}

package/plugins/beta/datasets/src/styles/patterns.js

@@ -1,157 +0,0 @@
-import { getValueForStyle } from '../../../../../src/utils/getValueForStyle.js'
-
-// ─── Built-in pattern library ────────────────────────────────────────────────
-// Each value is the inner SVG content (paths only, no wrapper).
-// Paths are authored in a 16×16 coordinate space (power-of-two, tiles seamlessly).
-// Use {{foreground}} and {{background}} tokens for colours.
-
-const BUILT_IN_PATTERNS = {
-  'cross-hatch': '<path d="M0 4.486V3.485h3.5V.001h1v3.484h7.002V.001h1v3.484h3.5v1.001h-3.5v7h3.5v.999h-3.5v3.516h-1v-3.516H4.499v3.516h-1v-3.516H0v-.999h3.5v-7H0zm11.501 0H4.499v7h7.002v-7z" fill="{{foreground}}"/>',
-  'diagonal-cross-hatch': '<path d="M0 8.707V7.293L7.293 0h1.414L16 7.293v1.414L8.707 16H7.293L0 8.707zM.707 8L8 15.293 15.293 8 8 .707.707 8z" fill="{{foreground}}"/>',
-  'forward-diagonal-hatch': '<path d="M16 8.707V7.293L7.293 16h1.414L16 8.707zm-16 0L8.707 0H7.293L0 7.293v1.414z" fill="{{foreground}}"/>',
-  'backward-diagonal-hatch': '<path d="M0 8.707V7.293L8.707 16H7.293L0 8.707zm16 0L7.293 0h1.414L16 7.293v1.414z" fill="{{foreground}}"/>',
-  'horizontal-hatch': '<path d="M0 4.5V3.499h15.999V4.5H0zm0 7h15.999V12.5H0v-1.001z" fill="{{foreground}}"/>',
-  'vertical-hatch': '<path d="M3.501 16.001V0h1v16.001h-1zm7.998 0V0h1v16.001h-1z" fill="{{foreground}}"/>',
-  dot: '<path d="M3.999 2A2 2 0 0 1 6 3.999C6 5.103 5.103 6 3.999 6a2 2 0 0 1-1.999-2.001A2 2 0 0 1 3.999 2zm0 7.999C5.103 10 6 10.897 6 12.001A2 2 0 0 1 3.999 14a2 2 0 0 1-1.999-1.999A2 2 0 0 1 3.999 10zM11.999 2A2 2 0 0 1 14 3.999C14 5.103 13.103 6 11.999 6S10 5.103 10 3.999A2 2 0 0 1 11.999 2zm0 7.999c1.104 0 2.001.897 2.001 2.001A2 2 0 0 1 11.999 14 2 2 0 0 1 10 12.001c0-1.104.897-2.001 1.999-2.001z" fill="{{foreground}}"/>',
-  diamond: '<path d="M4 .465L7.535 4 4 7.535.465 4 4 .465zm0 7.999l3.535 3.535L4 15.535.465 11.999 4 8.464zm8-8l3.535 3.535-3.536 3.536L8.464 4 12 .464zm0 8.001L15.536 12 12 15.536 8.465 12 12 8.465z" fill="{{foreground}}"/>'
-}
-
-// Plugin-controlled border path used in the key symbol (20×20 coordinate space).
-// This is always rendered as the first element, before the user-supplied content.
-const KEY_BORDER_PATH = '<path d="M19 2.862v14.275c0 1.028-.835 1.862-1.862 1.862H2.863c-1.028 0-1.862-.835-1.862-1.862V2.862C1.001 1.834 1.836 1 2.863 1h14.275C18.166 1 19 1.835 19 2.862z" fill="{{background}}" stroke="{{foreground}}" stroke-width="2"/>'
-
-// ─── Helpers ─────────────────────────────────────────────────────────────────
-
-export const hashString = (str) => {
-  let hash = 0
-  for (const ch of str) {
-    hash = ((hash << 5) - hash) + ch.codePointAt(0)
-    hash = hash & hash
-  }
-  return Math.abs(hash).toString(36) // NOSONAR: base36 encoding for compact alphanumeric hash string
-}
-
-export const injectColors = (content, foreground, background) =>
-  content
-    .replace(/\{\{foreground\}\}/g, foreground || 'black')
-    .replace(/\{\{background\}\}/g, background || 'transparent')
-
-// ─── Public API ───────────────────────────────────────────────────────────────
-
-/**
- * Returns true if a dataset has a fill pattern configured.
- * @param {Object} dataset
- * @returns {boolean}
- */
-export const hasPattern = (dataset) => !!(dataset.fillPattern || dataset.fillPatternSvgContent)
-
-/**
- * Returns the raw (un-coloured) inner SVG content for a dataset's pattern.
- * Custom fillPatternSvgContent takes precedence over built-in fillPattern ids.
- * @param {Object} dataset
- * @returns {string|null}
- */
-export const getPatternInnerContent = (dataset) => {
-  if (dataset.fillPatternSvgContent) {
-    return dataset.fillPatternSvgContent
-  }
-  if (dataset.fillPattern && BUILT_IN_PATTERNS[dataset.fillPattern]) {
-    return BUILT_IN_PATTERNS[dataset.fillPattern]
-  }
-  return null
-}
-
-/**
- * Returns a deterministic image ID for a pattern + resolved colour combination.
- * @param {Object} dataset
- * @param {string} mapStyleId
- * @returns {string|null}
- */
-export const getPatternImageId = (dataset, mapStyleId) => {
-  const innerContent = getPatternInnerContent(dataset)
-  if (!innerContent) {
-    return null
-  }
-  const fg = getValueForStyle(dataset.fillPatternForegroundColor, mapStyleId) || 'black'
-  const bg = getValueForStyle(dataset.fillPatternBackgroundColor, mapStyleId) || 'transparent'
-  return `pattern-${hashString(innerContent + fg + bg)}`
-}
-
-/**
- * Returns colour-injected inner SVG path content for use in the Key symbol.
- * The caller is responsible for wrapping this in the SVG element and border path.
- * @param {Object} dataset
- * @param {string} mapStyleId
- * @returns {{ border: string, content: string }|null}
- */
-export const getKeyPatternPaths = (dataset, mapStyleId) => {
-  const innerContent = getPatternInnerContent(dataset)
-  if (!innerContent) {
-    return null
-  }
-  const fg = getValueForStyle(dataset.fillPatternForegroundColor, mapStyleId) || 'black'
-  const bg = getValueForStyle(dataset.fillPatternBackgroundColor, mapStyleId) || 'transparent'
-  const borderStroke = getValueForStyle(dataset.stroke, mapStyleId) || fg
-  return {
-    border: injectColors(KEY_BORDER_PATH, borderStroke, bg),
-    content: injectColors(innerContent, fg, bg)
-  }
-}
-
-// ─── Rasterisation ────────────────────────────────────────────────────────────
-
-// Module-level cache: imageId → ImageData. Avoids re-rasterising identical patterns.
-const imageDataCache = new Map()
-
-const rasteriseToImageData = (svgString, width, height) =>
-  new Promise((resolve, reject) => {
-    const blob = new Blob([svgString], { type: 'image/svg+xml' })
-    const url = URL.createObjectURL(blob)
-    const img = new Image(width, height)
-    img.onload = () => {
-      const canvas = document.createElement('canvas')
-      canvas.width = width
-      canvas.height = height
-      const ctx = canvas.getContext('2d')
-      ctx.drawImage(img, 0, 0, width, height)
-      URL.revokeObjectURL(url)
-      resolve(ctx.getImageData(0, 0, width, height))
-    }
-    img.onerror = () => {
-      URL.revokeObjectURL(url)
-      reject(new Error(`Failed to rasterise pattern SVG: ${svgString.slice(0, 80)}`))
-    }
-    img.src = url
-  })
-
-/**
- * Rasterises a dataset's pattern SVG to ImageData, using an in-memory cache
- * to avoid re-rasterising identical patterns. Framework-agnostic — callers
- * are responsible for registering the result with their map framework.
- *
- * @param {Object} dataset
- * @param {string} mapStyleId
- * @returns {Promise<{ imageId: string, imageData: ImageData }|null>}
- */
-export const rasterisePattern = async (dataset, mapStyleId) => {
-  const innerContent = getPatternInnerContent(dataset)
-  if (!innerContent) {
-    return null
-  }
-
-  const fg = getValueForStyle(dataset.fillPatternForegroundColor, mapStyleId) || 'black'
-  const bg = getValueForStyle(dataset.fillPatternBackgroundColor, mapStyleId) || 'transparent'
-  const imageId = `pattern-${hashString(innerContent + fg + bg)}`
-
-  let imageData = imageDataCache.get(imageId)
-  if (!imageData) {
-    const colored = injectColors(innerContent, fg, bg)
-    const bgRect = `<rect width="16" height="16" fill="${bg}"/>`
-    // pixelRatio: 2 means the map treats this as an 8×8 logical tile — crisp on retina screens.
-    const svgString = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">${bgRect}${colored}</svg>`
-    imageData = await rasteriseToImageData(svgString, 16, 16)
-    imageDataCache.set(imageId, imageData)
-  }
-
-  return { imageId, imageData }
-}