@defra/interactive-map 0.0.3-alpha → 0.0.5-alpha

package/plugins/interact/src/reducer.test.js

@@ -0,0 +1,155 @@
+import { initialState, actions } from './reducer.js'
+
+describe('initialState', () => {
+  it('has correct defaults', () => {
+    expect(initialState).toEqual({
+      enabled: false,
+      dataLayers: [],
+      markerColor: null,
+      interactionMode: null,
+      multiSelect: false,
+      contiguous: false,
+      selectedFeatures: [],
+      selectionBounds: null,
+      closeOnAction: true
+    })
+  })
+})
+
+describe('ENABLE/DISABLE actions', () => {
+  it('ENABLE sets enabled and merges payload', () => {
+    const state = { ...initialState, enabled: false }
+    const payload = { dataLayers: [1], markerColor: 'red' }
+    const result = actions.ENABLE(state, payload)
+
+    expect(result.enabled).toBe(true)
+    expect(result.dataLayers).toEqual([1])
+    expect(result.markerColor).toBe('red')
+    expect(result).not.toBe(state)
+  })
+
+  it('DISABLE sets enabled to false, clears selection, and preserves other state', () => {
+    const state = { ...initialState, enabled: true, dataLayers: [1], markerColor: 'red', selectedFeatures: [{ featureId: 'f1' }], selectionBounds: [0, 0, 1, 1] }
+    const result = actions.DISABLE(state)
+
+    expect(result.enabled).toBe(false)
+    expect(result.dataLayers).toEqual([1])
+    expect(result.markerColor).toBe('red')
+    expect(result.selectedFeatures).toEqual([])
+    expect(result.selectionBounds).toBeNull()
+    expect(result).not.toBe(state)
+  })
+})
+
+
+describe('TOGGLE_SELECTED_FEATURES action', () => {
+  const createFeature = (id, layerId = 'layer1') => ({
+    featureId: id,
+    layerId,
+    idProperty: 'id',
+    properties: { name: `Feature ${id}` },
+    geometry: { type: 'Point', coordinates: [0, 0] }
+  })
+
+  it('handles single-select, multi-select, add/remove, and replaceAll', () => {
+    let state = { ...initialState, selectionBounds: { sw: [0, 0], ne: [1, 1] } }
+
+    // Single-select: add
+    state = actions.TOGGLE_SELECTED_FEATURES(state, createFeature('f1'))
+    expect(state.selectedFeatures).toHaveLength(1)
+
+    // Single-select: replace
+    state = actions.TOGGLE_SELECTED_FEATURES(state, createFeature('f2'))
+    expect(state.selectedFeatures[0].featureId).toBe('f2')
+
+    // Toggle off same - clears bounds
+    state = actions.TOGGLE_SELECTED_FEATURES(state, createFeature('f2'))
+    expect(state.selectedFeatures).toHaveLength(0)
+    expect(state.selectionBounds).toBeNull()
+
+    // Multi-select: add multiple
+    state = { ...state, selectionBounds: { sw: [0, 0], ne: [1, 1] } }
+    state = actions.TOGGLE_SELECTED_FEATURES(state, { ...createFeature('f1'), multiSelect: true })
+    state = actions.TOGGLE_SELECTED_FEATURES(state, { ...createFeature('f2'), multiSelect: true })
+    expect(state.selectedFeatures.map(f => f.featureId)).toEqual(['f1', 'f2'])
+
+    // Multi-select: remove (not last) - clears bounds for recalculation
+    state = actions.TOGGLE_SELECTED_FEATURES(state, { ...createFeature('f1'), multiSelect: true })
+    expect(state.selectedFeatures.map(f => f.featureId)).toEqual(['f2'])
+    expect(state.selectionBounds).toBeNull()
+
+    // Multi-select: remove last - clears bounds
+    state = actions.TOGGLE_SELECTED_FEATURES(state, { ...createFeature('f2'), multiSelect: true })
+    expect(state.selectedFeatures).toHaveLength(0)
+    expect(state.selectionBounds).toBeNull()
+
+    // addToExisting false removes feature - clears bounds when empty
+    state = { ...state, selectionBounds: { sw: [0, 0], ne: [1, 1] } }
+    state = actions.TOGGLE_SELECTED_FEATURES(state, { ...createFeature('f2'), multiSelect: true })
+    state = actions.TOGGLE_SELECTED_FEATURES(state, { ...createFeature('f2'), addToExisting: false })
+    expect(state.selectedFeatures).toHaveLength(0)
+    expect(state.selectionBounds).toBeNull()
+
+    // replaceAll replaces everything
+    state = actions.TOGGLE_SELECTED_FEATURES(state, { ...createFeature('f3'), replaceAll: true })
+    expect(state.selectedFeatures).toHaveLength(1)
+    expect(state.selectedFeatures[0].featureId).toBe('f3')
+  })
+
+  it('handles null or empty selectedFeatures gracefully', () => {
+    let state = { ...initialState, selectedFeatures: null }
+    state = actions.TOGGLE_SELECTED_FEATURES(state, createFeature('f1'))
+    expect(state.selectedFeatures).toHaveLength(1)
+
+    state = { ...initialState, selectedFeatures: [] }
+    state = actions.TOGGLE_SELECTED_FEATURES(state, { ...createFeature('f2'), addToExisting: false })
+    expect(state.selectedFeatures).toEqual([])
+  })
+
+  it('matches by both featureId and layerId', () => {
+    const state = { ...initialState, selectedFeatures: [createFeature('f1', 'layer1')] }
+    const payload = createFeature('f1', 'layer2')
+    const result = actions.TOGGLE_SELECTED_FEATURES(state, payload)
+    expect(result.selectedFeatures[0].layerId).toBe('layer2')
+  })
+})
+
+describe('UPDATE_SELECTED_BOUNDS action', () => {
+  it('updates selectionBounds correctly', () => {
+    const state = { ...initialState, selectionBounds: { sw: [0, 0], ne: [1, 1] } }
+    const newBounds = { sw: [0, 0], ne: [2, 2] }
+    const result = actions.UPDATE_SELECTED_BOUNDS(state, newBounds)
+    expect(result.selectionBounds).toEqual(newBounds)
+
+    // unchanged bounds returns same state
+    const result2 = actions.UPDATE_SELECTED_BOUNDS(state, { sw: [0, 0], ne: [1, 1] })
+    expect(result2).toBe(state)
+  })
+})
+
+describe('CLEAR_SELECTED_FEATURES action', () => {
+  it('resets selection and bounds', () => {
+    const state = {
+      ...initialState,
+      selectedFeatures: [1],
+      selectionBounds: { sw: [0, 0], ne: [1, 1] }
+    }
+    const result = actions.CLEAR_SELECTED_FEATURES(state)
+    expect(result.selectedFeatures).toEqual([])
+    expect(result.selectionBounds).toBeNull()
+    expect(result).not.toBe(state)
+  })
+})
+
+describe('actions object', () => {
+  it('exports all action handlers as functions', () => {
+    expect(Object.keys(actions)).toEqual([
+      'ENABLE',
+      'DISABLE',
+      'TOGGLE_SELECTED_FEATURES',
+      'UPDATE_SELECTED_BOUNDS',
+      'CLEAR_SELECTED_FEATURES'
+    ])
+    Object.values(actions).forEach(fn => expect(typeof fn).toBe('function'))
+  })
+})

package/plugins/interact/src/utils/buildStylesMap.test.js

@@ -0,0 +1,57 @@
+import { buildStylesMap } from './buildStylesMap.js'
+import { DEFAULTS } from '../defaults.js'
+import { getValueForStyle } from '../../../../src/utils/getValueForStyle.js'
+
+jest.mock('../../../../src/utils/getValueForStyle.js', () => ({
+  getValueForStyle: jest.fn((value) => value)
+}))
+
+describe('buildStylesMap', () => {
+  beforeEach(() => {
+    jest.clearAllMocks()
+  })
+
+  it('returns empty object when mapStyle is falsy or dataLayers empty', () => {
+    expect(buildStylesMap([{ layerId: 'test' }], null)).toEqual({})
+    expect(buildStylesMap([{ layerId: 'test' }], undefined)).toEqual({})
+    expect(buildStylesMap([], { id: 'default' })).toEqual({})
+  })
+
+  it('builds correct stylesMap with defaults and layer overrides', () => {
+    const dataLayers = [
+      { layerId: 'custom1', selectedStroke: 'red', selectedFill: 'blue', selectedStrokeWidth: 5 },
+      { layerId: 'custom2' } // uses defaults
+    ]
+    const mapStyle = { id: 'default-style' }
+
+    const result = buildStylesMap(dataLayers, mapStyle)
+
+    // Layer-specific values
+    expect(result.custom1).toEqual({
+      stroke: 'red',
+      fill: 'blue',
+      strokeWidth: 5
+    })
+
+    // Default fallback values
+    expect(result.custom2.stroke).toBe(DEFAULTS.selectedStroke)
+    expect(result.custom2.fill).toBe(DEFAULTS.selectedFill)
+    expect(result.custom2.strokeWidth).toBe(DEFAULTS.selectedStrokeWidth)
+  })
+
+  it('calls getValueForStyle for stroke and fill with mapStyle.id', () => {
+    const dataLayers = [
+      { layerId: 'layer1', selectedStroke: 'strokeVal', selectedFill: 'fillVal' }
+    ]
+    const mapStyle = { id: 'mapStyleId' }
+
+    buildStylesMap(dataLayers, mapStyle)
+
+    expect(getValueForStyle).toHaveBeenCalledWith('strokeVal', 'mapStyleId')
+    expect(getValueForStyle).toHaveBeenCalledWith('fillVal', 'mapStyleId')
+
+    // Ensure strokeWidth is not passed to getValueForStyle
+    const numberCalls = getValueForStyle.mock.calls.filter(call => typeof call[0] === 'number')
+    expect(numberCalls).toHaveLength(0)
+  })
+})

package/plugins/interact/src/utils/featureQueries.js

@@ -6,9 +6,9 @@ export const buildLayerConfigMap = dataLayers => {
   return map
 }
 
-export const getFeaturesAtPoint = (mapProvider, point) => {
+export const getFeaturesAtPoint = (mapProvider, point, options) => {
   try {
-    return mapProvider?.getFeaturesAtPoint(point) || []
+    return mapProvider?.getFeaturesAtPoint(point, options) || []
   } catch (err) {
     console.warn('Feature query failed:', err)
     return []

package/plugins/interact/src/utils/featureQueries.test.js

@@ -0,0 +1,56 @@
+import { buildLayerConfigMap, getFeaturesAtPoint, findMatchingFeature } from './featureQueries.js'
+
+describe('buildLayerConfigMap', () => {
+  it('builds map keyed by layerId, handles empty array', () => {
+    const dataLayers = [
+      { layerId: 'a', value: 1 },
+      { layerId: 'b', value: 2 }
+    ]
+
+    const result = buildLayerConfigMap(dataLayers)
+    expect(result).toEqual({
+      a: { layerId: 'a', value: 1 },
+      b: { layerId: 'b', value: 2 }
+    })
+
+    expect(buildLayerConfigMap([])).toEqual({})
+  })
+})
+
+describe('getFeaturesAtPoint', () => {
+  it('returns features or empty array, handles errors', () => {
+    const features = [{ id: 'f1' }]
+    const mockProvider = {
+      getFeaturesAtPoint: jest.fn(() => features)
+    }
+
+    expect(getFeaturesAtPoint(mockProvider, { x: 0, y: 0 })).toBe(features)
+    expect(getFeaturesAtPoint(null, { x: 0, y: 0 })).toEqual([])
+    expect(getFeaturesAtPoint(undefined, { x: 0, y: 0 })).toEqual([])
+
+    // error handling
+    const consoleSpy = jest.spyOn(console, 'warn').mockImplementation(() => {})
+    const errorProvider = { getFeaturesAtPoint: jest.fn(() => { throw new Error('fail') }) }
+    expect(getFeaturesAtPoint(errorProvider, { x: 0, y: 0 })).toEqual([])
+    expect(consoleSpy).toHaveBeenCalledWith('Feature query failed:', expect.any(Error))
+    consoleSpy.mockRestore()
+  })
+})
+
+describe('findMatchingFeature', () => {
+  const layerConfigMap = { layer1: { layerId: 'layer1' } }
+
+  it('returns first feature matching config, null otherwise', () => {
+    const features = [
+      { id: 'f1', layer: { id: 'unknown' } },
+      { id: 'f2', layer: { id: 'layer1' } }
+    ]
+    const result = findMatchingFeature(features, layerConfigMap)
+    expect(result).toEqual({ feature: features[1], config: layerConfigMap.layer1 })
+
+    expect(findMatchingFeature([], layerConfigMap)).toBeNull()
+    expect(findMatchingFeature([{ id: 'f3', layer: {} }], layerConfigMap)).toBeNull()
+    expect(findMatchingFeature([{ id: 'f4' }], layerConfigMap)).toBeNull()
+    expect(findMatchingFeature([{ id: 'f5', layer: { id: 'other' } }], {})).toBeNull()
+  })
+})

package/plugins/interact/src/utils/spatial.js

@@ -0,0 +1,95 @@
+import { polygon, multiPolygon, lineString, multiLineString, point, multiPoint } from '@turf/helpers'
+import booleanDisjoint from '@turf/boolean-disjoint'
+
+/**
+ * Convert a GeoJSON Feature or geometry-like object into a Turf geometry.
+ *
+ * @param {Object} featureOrGeom - Either a Feature with a `.geometry` property or a raw GeoJSON geometry object.
+ * @returns {Object} Turf geometry (Polygon, LineString, Point, etc.)
+ *
+ * @throws Will throw if the geometry type is not supported.
+ */
+function toTurfGeometry(featureOrGeom) {
+  const geom = featureOrGeom.geometry || featureOrGeom
+
+  switch (geom.type) {
+    case 'Polygon':
+      return polygon(geom.coordinates);
+    case 'MultiPolygon':
+      return multiPolygon(geom.coordinates);
+    case 'LineString':
+      return lineString(geom.coordinates);
+    case 'MultiLineString':
+      return multiLineString(geom.coordinates);
+    case 'Point':
+      return point(geom.coordinates);
+    case 'MultiPoint':
+      return multiPoint(geom.coordinates);
+    default:
+      throw new Error(`Unsupported geometry type: ${geom.type}`)
+  }
+}
+
+/**
+ * Check if a feature is contiguous (touches or overlaps) with any feature in an array.
+ *
+ * @param {Object} feature - The feature to test
+ * @param {Array} features - Array of features to test against
+ * @returns {boolean} True if the feature is contiguous with at least one feature in the array
+ */
+function isContiguousWithAny(feature, features) {
+  return features.some(f => !booleanDisjoint(toTurfGeometry(f), toTurfGeometry(feature)))
+}
+
+/**
+ * Check if a single polygon/multipolygon feature can be split.
+ *
+ * @param {Array} features - Array of features
+ * @returns {boolean} True if exactly one polygon or multipolygon feature
+ */
+function canSplitFeatures(features) {
+  if (features.length !== 1) {
+    return false
+  }
+  const type = features[0].geometry?.type
+  return type === 'Polygon' || type === 'MultiPolygon'
+}
+
+/**
+ * Check if all features form a single contiguous group (can be merged).
+ * Uses flood-fill to find connected components.
+ *
+ * @param {Array} features - Array of features to test
+ * @returns {boolean} True if 2+ features and all are contiguous
+ */
+function areAllContiguous(features) {
+  if (features.length < 2) {
+    return false
+  }
+
+  const connected = new Set([0])
+  let changed = true
+
+  while (changed) {
+    changed = false
+    for (let i = 1; i < features.length; i++) {
+      if (connected.has(i)) {
+        continue
+      }
+      const connectedFeatures = [...connected].map(idx => features[idx])
+      if (isContiguousWithAny(features[i], connectedFeatures)) {
+        connected.add(i)
+        changed = true
+      }
+    }
+  }
+
+  return connected.size === features.length
+}
+
+export {
+  toTurfGeometry,
+  isContiguousWithAny,
+  canSplitFeatures,
+  areAllContiguous
+}

package/plugins/interact/src/utils/spatial.test.js

@@ -0,0 +1,93 @@
+import { toTurfGeometry, isContiguousWithAny, canSplitFeatures, areAllContiguous } from './spatial.js'
+import { polygon, multiPolygon, lineString, multiLineString, point, multiPoint } from '@turf/helpers'
+
+describe('toTurfGeometry', () => {
+  const geomTypes = [
+    { type: 'Polygon', coords: [[[0,0],[1,0],[1,1],[0,0]]], fn: polygon },
+    { type: 'MultiPolygon', coords: [[[[0,0],[1,0],[1,1],[0,0]]]], fn: multiPolygon },
+    { type: 'LineString', coords: [[0,0],[1,1]], fn: lineString },
+    { type: 'MultiLineString', coords: [[[0,0],[1,1]]], fn: multiLineString },
+    { type: 'Point', coords: [0,0], fn: point },
+    { type: 'MultiPoint', coords: [[0,0],[1,1]], fn: multiPoint }
+  ]
+
+  geomTypes.forEach(({ type, coords, fn }) => {
+    it(`converts ${type} Feature`, () => {
+      const feature = { type: 'Feature', geometry: { type, coordinates: coords } }
+      expect(toTurfGeometry(feature)).toEqual(fn(coords))
+    })
+
+    it(`converts raw ${type} geometry`, () => {
+      const geom = { type, coordinates: coords }
+      expect(toTurfGeometry(geom)).toEqual(fn(coords))
+    })
+  })
+
+  it('throws on unsupported geometry', () => {
+    expect(() => toTurfGeometry({ type: 'Feature', geometry: { type: 'Circle', coordinates: [] } }))
+      .toThrow('Unsupported geometry type: Circle')
+  })
+})
+
+describe('isContiguousWithAny', () => {
+  const makePolygonFeature = (coords) => ({
+    type: 'Feature',
+    geometry: { type: 'Polygon', coordinates: [coords] }
+  })
+
+  const featureA = makePolygonFeature([[0,0],[2,0],[2,2],[0,2],[0,0]])
+  const featureB = makePolygonFeature([[2,0],[4,0],[4,2],[2,2],[2,0]]) // shares edge with A
+  const featureC = makePolygonFeature([[5,5],[7,5],[7,7],[5,7],[5,5]]) // disjoint from A and B
+
+  it('returns true when feature overlaps with one in the array', () => {
+    const overlapping = makePolygonFeature([[1,0],[3,0],[3,2],[1,2],[1,0]]) // overlaps A
+    expect(isContiguousWithAny(overlapping, [featureA])).toBe(true)
+  })
+
+  it('returns true when feature shares an edge with one in the array', () => {
+    expect(isContiguousWithAny(featureB, [featureA])).toBe(true)
+  })
+
+  it('returns true when feature is contiguous with at least one in the array', () => {
+    expect(isContiguousWithAny(featureB, [featureC, featureA])).toBe(true)
+  })
+
+  it('returns false when feature is disjoint from all features', () => {
+    expect(isContiguousWithAny(featureC, [featureA, featureB])).toBe(false)
+  })
+
+  it('returns false when features array is empty', () => {
+    expect(isContiguousWithAny(featureA, [])).toBe(false)
+  })
+})
+
+describe('canSplitFeatures', () => {
+  it.each([
+    [[{ geometry: { type: 'Polygon' } }], true],
+    [[{ geometry: { type: 'MultiPolygon' } }], true],
+    [[{ geometry: { type: 'LineString' } }], false],
+    [[], false],
+    [[{ geometry: { type: 'Polygon' } }, { geometry: { type: 'Polygon' } }], false]
+  ])('returns expected result for %j', (features, expected) => {
+    expect(canSplitFeatures(features)).toBe(expected)
+  })
+})
+
+describe('areAllContiguous', () => {
+  const poly = (coords) => ({ geometry: { type: 'Polygon', coordinates: [coords] } })
+  const A = poly([[0,0],[2,0],[2,2],[0,2],[0,0]])
+  const B = poly([[2,0],[4,0],[4,2],[2,2],[2,0]]) // touches A
+  const C = poly([[4,0],[6,0],[6,2],[4,2],[4,0]]) // touches B
+  const D = poly([[10,10],[12,10],[12,12],[10,12],[10,10]]) // isolated
+
+  it.each([
+    [[], false],
+    [[A], false],
+    [[A, B], true],
+    [[A, B, C], true],
+    [[A, D], false],
+    [[A, B, D], false]
+  ])('returns expected result for %# features', (features, expected) => {
+    expect(areAllContiguous(features)).toBe(expected)
+  })
+})

package/plugins/search/dist/css/index.css

@@ -1 +1 @@
-.im-c-search-form{display:none;padding:0;min-height:auto;border-radius:0}.im-c-search-form:before{border-radius:0}.im-o-app--mobile .im-c-search-form{position:absolute;left:0;top:0;right:0;height:auto}.im-o-app--tablet .im-c-search-form,.im-o-app--desktop .im-c-search-form{border-radius:var(--button-border-radius)}.im-o-app--tablet .im-c-search-form:before,.im-o-app--desktop .im-c-search-form:before{border-radius:var(--button-border-radius)}.im-o-app--mobile .im-c-search-form--default-expanded{position:relative;margin:calc(-1*var(--primary-gap)) calc(-1*var(--primary-gap)) 0}.im-o-app--mobile .im-c-search-form--default-expanded .im-c-search-suggestions{position:absolute;top:100%;width:100%;left:0}.im-c-search-close-button:before{box-shadow:none}.im-c-search-close-button[data-focus-visible=true]{z-index:1}.im-c-search-suggestions{max-height:calc(100vh - 66px);overflow-y:auto;scroll-padding:0;margin:0;padding:0;background-color:var(--background-color);list-style:none}.im-c-search-suggestions__item{margin:0;padding:calc(var(--divider-gap) + 2px) var(--primary-gap);position:relative;color:var(--secondary-text-color);border-top:1px solid var(--button-hover-color);cursor:pointer}.im-c-search-suggestions__item mark{font-weight:bold;color:var(--foreground-color);background-color:rgba(0,0,0,0);pointer-events:none}@media(hover: hover)and (pointer: fine){.im-c-search-suggestions__item:hover:not([aria-selected=true]){background-color:var(--button-hover-color)}}.im-c-search-suggestions__item[aria-selected=true]{background-color:var(--button-hover-color)}.im-c-search-suggestions__item[aria-selected=true] mark{color:var(--fixed-foreground-color)}.im-c-search-suggestions__item:hover:not([aria-selected=true]) .im-c-search-suggestions__label{text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:2px;text-decoration-color:var(--foreground-color);text-decoration-skip-ink:none}.im-c-search-suggestions__item[aria-selected=true] .im-c-search-suggestions__label{outline:3px solid rgba(0,0,0,0);color:var(--focus-border-color);background-color:var(--focus-outline-color);box-shadow:0 -2px var(--focus-outline-color),0 4px var(--focus-border-color);text-decoration:none}.im-c-search-suggestions__label{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.im-o-app--mobile .im-c-search-form--default-expanded .im-c-search-suggestions{box-shadow:var(--panel-box-shadow);clip-path:inset(0px 0px -20px 0px)}.im-o-app--tablet .im-c-search-suggestions,.im-o-app--desktop .im-c-search-suggestions{border-bottom-left-radius:var(--button-border-radius);border-bottom-right-radius:var(--button-border-radius)}.im-o-app--tablet .im-c-search-suggestions__item,.im-o-app--desktop .im-c-search-suggestions__item{padding:var(--divider-gap) calc(var(--divider-gap) + 2px)}.im-c-search__input-container{display:flex;position:relative;flex:1 1 auto;min-height:auto;height:var(--button-size)}.im-c-search__input-container:before{content:"";z-index:1;position:absolute;inset:-1px;border-radius:var(--button-border-radius);border:2px solid var(--foreground-color);pointer-events:none}.im-c-search__input-container:after{position:absolute;content:"";pointer-events:none;z-index:99;top:-1px;right:-1px;bottom:-1px;left:-1px;border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--button-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-search__input-container:after{transition:opacity var(--duration) ease}}.im-c-search__input{width:100%;border:0;padding:var(--divider-gap) calc(var(--divider-gap) + 2px);color:var(--foreground-color);background-color:rgba(0,0,0,0);outline:0}.im-c-search__input::placeholder{color:var(--foreground-color)}.im-c-search__input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;display:none}.im-c-search__input::-moz-search-clear{display:none}.im-c-search__hint{display:none}.im-o-app--exclusive-control .im-o-app__top .im-c-button-wrapper,.im-o-app--exclusive-control .im-o-app__right .im-c-button-wrapper{opacity:0;z-index:-1}.im-o-app--exclusive-control .im-o-app__inset .im-c-panel{opacity:0;z-index:-1}.im-o-app--mobile .im-c-search__input-container{margin:var(--primary-gap)}.im-c-search__input-container--keyboard-focus-within:after{opacity:1}
+.im-c-search-form{display:none;padding:0;min-height:auto;border-radius:0}.im-c-search-form:before{border-radius:0}.im-o-app--mobile .im-c-search-form{position:absolute;left:0;top:0;right:0;height:auto}.im-o-app--tablet .im-c-search-form,.im-o-app--desktop .im-c-search-form{border-radius:var(--button-border-radius)}.im-o-app--tablet .im-c-search-form:before,.im-o-app--desktop .im-c-search-form:before{border-radius:var(--button-border-radius)}.im-o-app--mobile .im-c-search-form--default-expanded{position:relative;margin:calc(-1*var(--primary-gap)) calc(-1*var(--primary-gap)) 0}.im-o-app--mobile .im-c-search-form--default-expanded .im-c-search-suggestions{position:absolute;top:100%;width:100%;left:0}.im-c-search-close-button:before{box-shadow:none}.im-c-search-close-button[data-focus-visible=true]{z-index:1}.im-c-search-suggestions{max-height:calc(100vh - 66px);overflow-y:auto;scroll-padding:0;margin:0;padding:0;background-color:var(--background-color);list-style:none}.im-c-search-suggestions__item{margin:0;padding:calc(var(--divider-gap) + 2px) var(--primary-gap);position:relative;color:var(--secondary-text-color);border-top:1px solid var(--button-hover-color);cursor:pointer}.im-c-search-suggestions__item mark{font-weight:bold;color:var(--foreground-color);background-color:rgba(0,0,0,0);pointer-events:none}@media(hover: hover)and (pointer: fine){.im-c-search-suggestions__item:hover:not([aria-selected=true]){background-color:var(--button-hover-color)}}.im-c-search-suggestions__item[aria-selected=true]{background-color:var(--button-hover-color)}.im-c-search-suggestions__item[aria-selected=true] mark{color:var(--fixed-foreground-color)}.im-c-search-suggestions__item:hover:not([aria-selected=true]) .im-c-search-suggestions__label{text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:2px;text-decoration-color:var(--foreground-color);text-decoration-skip-ink:none}.im-c-search-suggestions__item[aria-selected=true] .im-c-search-suggestions__label{outline:3px solid rgba(0,0,0,0);color:var(--focus-border-color);background-color:var(--focus-outline-color);box-shadow:0 -2px var(--focus-outline-color),0 4px var(--focus-border-color);text-decoration:none}.im-c-search-suggestions__label{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.im-o-app--mobile .im-c-search-form--default-expanded .im-c-search-suggestions{box-shadow:var(--panel-box-shadow);clip-path:inset(0px 0px -20px 0px)}.im-o-app--tablet .im-c-search-suggestions,.im-o-app--desktop .im-c-search-suggestions{border-bottom-left-radius:var(--button-border-radius);border-bottom-right-radius:var(--button-border-radius)}.im-o-app--tablet .im-c-search-suggestions__item,.im-o-app--desktop .im-c-search-suggestions__item{padding:var(--divider-gap) calc(var(--divider-gap) + 2px)}.im-c-search__input-container{display:flex;position:relative;flex:1 1 auto;min-height:auto;height:var(--button-size)}.im-c-search__input-container:before{content:"";z-index:1;position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:var(--button-border-radius);border:2px solid var(--foreground-color);pointer-events:none}.im-c-search__input-container:after{position:absolute;content:"";pointer-events:none;z-index:99;top:-1px;right:-1px;bottom:-1px;left:-1px;border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--button-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-search__input-container:after{transition:opacity var(--duration) ease}}.im-c-search__input{width:100%;border:0;padding:var(--divider-gap) calc(var(--divider-gap) + 2px);color:var(--foreground-color);background-color:rgba(0,0,0,0);outline:0}.im-c-search__input::placeholder{color:var(--foreground-color)}.im-c-search__input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;display:none}.im-c-search__input::-moz-search-clear{display:none}.im-c-search__hint{display:none}.im-o-app--exclusive-control .im-o-app__top .im-c-button-wrapper,.im-o-app--exclusive-control .im-o-app__right .im-c-button-wrapper{opacity:0;z-index:-1}.im-o-app--exclusive-control .im-o-app__inset .im-c-panel{opacity:0;z-index:-1}.im-o-app--mobile .im-c-search__input-container{margin:var(--primary-gap)}.im-c-search__input-container--keyboard-focus-within:after{opacity:1}