import type { ColorToken } from './map.types';

/**
 * The six base maps.
 *
 * `satellite` and `terrain` come straight from `mapTypeId`. `grayscale`,
 * `high-contrast` and `night` need a styled map, which on modern Maps means
 * Cloud Styling behind a Map ID — so each takes an optional `mapId`, and falls
 * back to a CSS filter over the tile pane when none is configured. That
 * fallback is what every surveyed application already does by hand.
 *
 * `high-contrast` is also the accessibility route for the map itself, not just
 * a stylistic option.
 */
export type MapBasemap =
  'roads' | 'grayscale' | 'high-contrast' | 'night' | 'satellite' | 'terrain' | 'none';

export interface MapBasemapStyle {
  /** Cloud-styled Map ID. The faithful route — no CSS filter involved. */
  mapId?: string;
  /** Native map type, for `satellite` and `terrain`. */
  mapTypeId?: string;
  /** Accepted degradation when no `mapId` is configured. */
  filter?: string;
}

export type MapBasemapStyles = Partial<Record<MapBasemap, MapBasemapStyle>>;

/**
 * Built-in fallbacks. Filters are applied to the tile pane only, never to the
 * markers and overlays drawn above it — inverting a marker's color would break
 * the token contract the rest of the library upholds.
 */
export const DEFAULT_BASEMAP_STYLES: MapBasemapStyles = {
  roads: {},
  satellite: { mapTypeId: 'satellite' },
  terrain: { mapTypeId: 'terrain' },
  grayscale: { filter: 'grayscale(1)' },
  'high-contrast': { filter: 'grayscale(1) contrast(1.45) brightness(1.05)' },
  night: { filter: 'invert(0.92) hue-rotate(185deg) brightness(0.92) contrast(0.92)' },
};

export function resolveBasemapStyle(
  basemap: MapBasemap | undefined,
  overrides: MapBasemapStyles | undefined
): MapBasemapStyle {
  if (!basemap || basemap === 'none') return {};
  return { ...DEFAULT_BASEMAP_STYLES[basemap], ...overrides?.[basemap] };
}

/** Human-readable labels for `MapBasemapControl`, in English per library convention. */
export const BASEMAP_LABELS: Record<Exclude<MapBasemap, 'none'>, string> = {
  roads: 'Roads',
  grayscale: 'Grayscale',
  'high-contrast': 'High contrast',
  night: 'Night',
  satellite: 'Satellite',
  terrain: 'Terrain',
};

/** Token used to tint the control's active state. */
export const BASEMAP_ACTIVE_TOKEN: ColorToken = '--primary';