@m4l/gclick 0.3.0 → 0.3.1-beta.0

package/components/maps/components/GpsMap/hooks/useAutoFocus/index.js

@@ -17,7 +17,7 @@ function useAutoFocus() {
       return false;
     }).map((layerId) => ({
       layerId,
-      features: (function() {
+      features: function() {
         if (state.hashLayers[layerId].geoJsonObject?.object.type === "FeatureCollection") {
           const layer = state.hashLayers[layerId].geoJsonObject?.object;
           return layer.features.filter((feature) => feature.layerData !== void 0).map((feature) => ({ featureId: feature.id, layerData: feature.layerData }));
@@ -28,10 +28,11 @@ function useAutoFocus() {
           }
         }
         return [];
-      })()
+      }()
     }));
     return result;
   }, deepShallow);
+  console.log("layerWithAutoFocus", layerWithAutoFocus);
   useEffect(() => {
     const proccesLayerWithAutoFocus = (layersFoucus) => {
       const layersToFitBounds = [];

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/GridDebugVisualization.d.ts

@@ -0,0 +1,9 @@
+import { GridCell } from './types';
+interface GridDebugVisualizationProps {
+    cells: GridCell[];
+}
+/**
+ * Componente temporal para visualizar la grilla de muestreo (solo para debug)
+ */
+export declare function GridDebugVisualization({ cells }: GridDebugVisualizationProps): null;
+export {};

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/constants.d.ts

@@ -0,0 +1,5 @@
+import { ZoomBasedFilterConfig } from './types';
+import { PixelPathFilterConfig } from './createPixelPathDecimationFilter/types';
+export declare const DEFAULT_CONFIG: Required<ZoomBasedFilterConfig>;
+export declare const PIXEL_PATH_DEFAULT_CONFIG: Required<PixelPathFilterConfig>;
+export declare const USE_FILTER_DECIMATION_DEFAULT_DEBOUNCE_MS = 150;

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/constants.js

@@ -0,0 +1,12 @@
+const PIXEL_PATH_DEFAULT_CONFIG = {
+  enabled: true,
+  viewportOffsetFactor: 1.2,
+  minPixelDistance: 40,
+  alwaysShowFirstAndLast: true,
+  maxMarkers: 500
+};
+const USE_FILTER_DECIMATION_DEFAULT_DEBOUNCE_MS = 150;
+export {
+  PIXEL_PATH_DEFAULT_CONFIG as P,
+  USE_FILTER_DECIMATION_DEFAULT_DEBOUNCE_MS as U
+};

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/createPixelPathDecimationFilter/helpers/decimateByConcentrationGrid.d.ts

@@ -0,0 +1,13 @@
+import { FeatureWithCoords } from '../types';
+/**
+ * Decima un conjunto de IDs cuando superan `maxMarkers`, usando una grilla espacial sobre
+ * el bbox (minLng, minLat, maxLng, maxLat).
+ *
+ * Divide el área en una grilla de aproximadamente sqrt(maxMarkers) × sqrt(maxMarkers) celdas
+ * y mantiene como máximo una marca por celda. Preserva el orden original y, si se pasa
+ * `firstAndLast`, prioriza siempre el primer y último punto del path.
+ */
+export declare function decimateByConcentrationGrid(orderedIds: (string | number)[], idToPoint: Map<string | number, FeatureWithCoords>, minLng: number, minLat: number, maxLng: number, maxLat: number, maxMarkers: number, firstAndLast?: {
+    firstId: string | number;
+    lastId: string | number;
+}): (string | number)[];

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/createPixelPathDecimationFilter/helpers/decimateByConcentrationGrid.js

@@ -0,0 +1,57 @@
+function decimateByConcentrationGrid(orderedIds, idToPoint, minLng, minLat, maxLng, maxLat, maxMarkers, firstAndLast) {
+  if (orderedIds.length <= maxMarkers) {
+    return orderedIds;
+  }
+  const spanLng = maxLng - minLng;
+  const spanLat = maxLat - minLat;
+  if (spanLng <= 0 || spanLat <= 0) {
+    return orderedIds.slice(0, maxMarkers);
+  }
+  const g = Math.max(1, Math.floor(Math.sqrt(maxMarkers)));
+  const filledCells = /* @__PURE__ */ new Set();
+  const added = /* @__PURE__ */ new Set();
+  const result = [];
+  function cellKey(lat, lng) {
+    const col = Math.min(g - 1, Math.max(0, Math.floor((lng - minLng) / spanLng * g)));
+    const row = Math.min(g - 1, Math.max(0, Math.floor((lat - minLat) / spanLat * g)));
+    return row * g + col;
+  }
+  if (firstAndLast) {
+    const { firstId, lastId } = firstAndLast;
+    for (const id of [firstId, lastId]) {
+      if (id === void 0 || added.has(id)) {
+        continue;
+      }
+      const p = idToPoint.get(id);
+      if (p === void 0) {
+        continue;
+      }
+      added.add(id);
+      result.push(id);
+      filledCells.add(cellKey(p.lat, p.lng));
+    }
+  }
+  for (const id of orderedIds) {
+    if (added.has(id)) {
+      continue;
+    }
+    if (result.length >= maxMarkers) {
+      break;
+    }
+    const p = idToPoint.get(id);
+    if (p === void 0) {
+      continue;
+    }
+    const key = cellKey(p.lat, p.lng);
+    if (filledCells.has(key)) {
+      continue;
+    }
+    filledCells.add(key);
+    added.add(id);
+    result.push(id);
+  }
+  return result.sort((a, b) => orderedIds.indexOf(a) - orderedIds.indexOf(b));
+}
+export {
+  decimateByConcentrationGrid as d
+};

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/createPixelPathDecimationFilter/helpers/decimateByPixelDistanceAlongPath.d.ts

@@ -0,0 +1,14 @@
+import { Map as LeafletMap } from 'leaflet';
+import { FeatureWithCoords } from '../types';
+/**
+ * Decima una secuencia ordenada de puntos manteniendo solo aquellos que distan al menos
+ * `minPixelDistance` píxeles del anterior en el path (en coordenadas de pantalla).
+ *
+ * Recorre `indicesInRouteOrder` (orden del recorrido), proyecta cada punto a píxeles con
+ * map.latLngToLayerPoint, y añade al resultado solo si la distancia euclídea al último
+ * punto seleccionado supera el umbral. Usa distancia al cuadrado para evitar Math.sqrt.
+ *
+ * Si `alwaysShowFirstAndLast` es true, garantiza que el primer y último punto del path
+ * estén en el resultado aunque no cumplan la distancia mínima.
+ */
+export declare function decimateByPixelDistanceAlongPath(map: LeafletMap, indicesInRouteOrder: number[], points: FeatureWithCoords[], minPixelDistance: number, alwaysShowFirstAndLast: boolean): (string | number)[];

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/createPixelPathDecimationFilter/helpers/decimateByPixelDistanceAlongPath.js

@@ -0,0 +1,24 @@
+function decimateByPixelDistanceAlongPath(map, indicesInRouteOrder, points, minPixelDistance, alwaysShowFirstAndLast) {
+  const selected = [];
+  let lastPx = null;
+  const minPixelDistanceSq = minPixelDistance * minPixelDistance;
+  for (const idx of indicesInRouteOrder) {
+    const p = points[idx];
+    const px = map.latLngToLayerPoint([p.lat, p.lng]);
+    if (lastPx === null) {
+      selected.push(p.id);
+      lastPx = { x: px.x, y: px.y };
+      continue;
+    }
+    const dx = px.x - lastPx.x;
+    const dy = px.y - lastPx.y;
+    if (dx * dx + dy * dy >= minPixelDistanceSq) {
+      selected.push(p.id);
+      lastPx = { x: px.x, y: px.y };
+    }
+  }
+  return selected;
+}
+export {
+  decimateByPixelDistanceAlongPath as d
+};

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/createPixelPathDecimationFilter/helpers/index.d.ts

@@ -0,0 +1,2 @@
+export { decimateByConcentrationGrid } from './decimateByConcentrationGrid';
+export { decimateByPixelDistanceAlongPath } from './decimateByPixelDistanceAlongPath';

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/createPixelPathDecimationFilter/helpers/index.js

@@ -0,0 +1 @@
+

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/createPixelPathDecimationFilter/index.d.ts

@@ -0,0 +1,64 @@
+import { DecimationFilter, PixelPathFilterConfig } from './types';
+/**
+ * Factory que crea una función de decimación para reducir marcadores en capas de mapa
+ * con secuencias ordenadas de puntos (p. ej. historial GPS, rutas, waypoints).
+ *
+ * ## Propósito
+ *
+ * Cuando una capa tiene miles de puntos (p. ej. un recorrido GPS de muchas horas),
+ * renderizar todos degrada el rendimiento. Esta función retorna un filtro que reduce
+ * los puntos visibles manteniendo la forma visual del path y priorizando los que
+ * están en el viewport actual.
+ *
+ * ## Algoritmo (en orden)
+ *
+ * 1. **Índice espacial (KDBush)**: Construye un índice para consultas de rango O(log n).
+ * Se cachea mientras featureIds/featuresWithCoords no cambien.
+ *
+ * 2. **Orden del path**: Ordena los puntos según el orden de featureIds (orden temporal
+ * del recorrido, no espacial).
+ *
+ * 3. **Decimación por distancia en píxeles**: Recorre el path en orden y mantiene solo
+ * puntos que distan al menos `minPixelDistance` píxeles del anterior. Evita
+ * saturar zonas con muchos puntos cercanos.
+ *
+ * 4. **Filtro por viewport**: Usa KDBush.range() para quedarse solo con puntos dentro
+ * del bounds visible (ampliado por viewportOffsetFactor). Los que están fuera no
+ * se renderizan.
+ *
+ * 5. **Primero y último del path**: Si `alwaysShowFirstAndLast`, añade el primer y
+ * último punto del recorrido solo si están en viewport, aunque no cumplan la distancia
+ * mínima, para no cortar visualmente el inicio/fin.
+ *
+ * 6. **Límite por concentración (opcional)**: Si tras lo anterior hay más de `maxMarkers`,
+ * aplica una grilla espacial para distribuir las marcas y no saturar zonas densas.
+ *
+ * ## Uso típico
+ *
+ * ```ts
+ * addLayer({
+ * layerId: 'points',
+ * renderFeature: HistoryMarkerRender,
+ * decimationConfig: {
+ * decimationFilter: createPixelPathDecimationFilter({
+ * minPixelDistance: 80,
+ * maxMarkers: 500,
+ * }),
+ * },
+ * });
+ * ```
+ *
+ * ## Cache
+ *
+ * Si el hook pasa `params.cache`, se reutilizan:
+ * - El índice KDBush y los mapas auxiliares entre llamadas (zoom/pan).
+ * - El resultado de decimateByPixelDistanceAlongPath **por nivel de zoom**: al volver
+ * a un zoom ya visitado, se devuelve el resultado cacheado sin recalcular.
+ *
+ * La cache se invalida cuando cambian featureIds o featuresWithCoords.
+ * @param config - Opciones de decimación (minPixelDistance, viewportOffsetFactor, etc.).
+ *                 Si no se pasa, se usan los valores por defecto.
+ * @returns Una DecimationFilter que recibe viewport, zoom, featureIds, etc. y devuelve
+ *          los featureIds que deben renderizarse.
+ */
+export declare function createPixelPathDecimationFilter(config?: PixelPathFilterConfig): DecimationFilter;

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/createPixelPathDecimationFilter/index.js

@@ -0,0 +1,117 @@
+import { K as KDBush } from "../../../../../../../not_recognized/index.js";
+import { P as PIXEL_PATH_DEFAULT_CONFIG } from "../constants.js";
+import { d as decimateByPixelDistanceAlongPath } from "./helpers/decimateByPixelDistanceAlongPath.js";
+import { d as decimateByConcentrationGrid } from "./helpers/decimateByConcentrationGrid.js";
+function createPixelPathDecimationFilter(config) {
+  const mergedConfig = { ...PIXEL_PATH_DEFAULT_CONFIG, ...config };
+  return (params) => {
+    const { featureIds, bounds, map, featuresWithCoords, cache, zoom } = params;
+    if (featureIds.length === 0) {
+      return [];
+    }
+    if (featuresWithCoords.length === 0) {
+      return [...featureIds];
+    }
+    const points = featuresWithCoords;
+    const factor = mergedConfig.viewportOffsetFactor ?? 1;
+    const latHalf = (bounds.getNorth() - bounds.getSouth()) / 2;
+    const lngHalf = (bounds.getEast() - bounds.getWest()) / 2;
+    const minLng = (bounds.getWest() + bounds.getEast()) / 2 - lngHalf * factor;
+    const minLat = (bounds.getSouth() + bounds.getNorth()) / 2 - latHalf * factor;
+    const maxLng = (bounds.getWest() + bounds.getEast()) / 2 + lngHalf * factor;
+    const maxLat = (bounds.getSouth() + bounds.getNorth()) / 2 + latHalf * factor;
+    const inBounds = (lat, lng) => lat >= minLat && lat <= maxLat && lng >= minLng && lng <= maxLng;
+    const computePrecomputed = () => {
+      const idToRouteIndexMap = /* @__PURE__ */ new Map();
+      for (let i = 0; i < featureIds.length; i++) {
+        idToRouteIndexMap.set(featureIds[i], i);
+      }
+      const allIndices = Array.from({ length: points.length }, (_, i) => i).sort(
+        (a, b) => (idToRouteIndexMap.get(points[a].id) ?? -1) - (idToRouteIndexMap.get(points[b].id) ?? -1)
+      );
+      const idToPointMap = new Map(
+        points.map((p) => [p.id, p])
+      );
+      const sortedPoints = [...points].sort((a, b) => {
+        if (a.lat !== b.lat) {
+          return a.lat - b.lat;
+        }
+        if (a.lng !== b.lng) {
+          return a.lng - b.lng;
+        }
+        return String(a.id).localeCompare(String(b.id));
+      });
+      const kdbushIndex = new KDBush(sortedPoints.length, 9);
+      sortedPoints.forEach((p) => kdbushIndex.add(p.lng, p.lat));
+      kdbushIndex.finish();
+      return {
+        idToRouteIndex: idToRouteIndexMap,
+        allIndicesInRouteOrder: allIndices,
+        idToPoint: idToPointMap,
+        spatialIndex: { index: kdbushIndex, points: sortedPoints }
+      };
+    };
+    const {
+      idToRouteIndex,
+      allIndicesInRouteOrder,
+      idToPoint,
+      spatialIndex
+    } = cache ? cache.get("pixelPathDecimation", computePrecomputed) : computePrecomputed();
+    const minPixelDistance = mergedConfig.minPixelDistance ?? 40;
+    const alwaysShowFirstAndLast = mergedConfig.alwaysShowFirstAndLast ?? true;
+    const computeDecimatedByZoom = () => decimateByPixelDistanceAlongPath(
+      map,
+      allIndicesInRouteOrder,
+      points,
+      minPixelDistance
+    );
+    const decimatedIds = cache !== void 0 && cache !== null ? cache.get(`pixelPathDecimation_decimated_zoom_${zoom}`, computeDecimatedByZoom) : computeDecimatedByZoom();
+    const indicesInViewport = spatialIndex.index.range(
+      minLng,
+      minLat,
+      maxLng,
+      maxLat
+    );
+    const idsInViewport = new Set(
+      indicesInViewport.map((i) => spatialIndex.points[i].id)
+    );
+    const inViewDecimated = decimatedIds.filter((id) => idsInViewport.has(id));
+    let result = inViewDecimated;
+    if (alwaysShowFirstAndLast && allIndicesInRouteOrder.length > 0) {
+      const firstPoint = points[allIndicesInRouteOrder[0]];
+      const lastPoint = points[allIndicesInRouteOrder[allIndicesInRouteOrder.length - 1]];
+      const firstId = firstPoint.id;
+      const lastId = lastPoint.id;
+      const set = new Set(result);
+      const toPrepend = [];
+      const toAppend = [];
+      if (inBounds(firstPoint.lat, firstPoint.lng) && !set.has(firstId)) {
+        toPrepend.push(firstId);
+      }
+      if (lastId !== firstId && inBounds(lastPoint.lat, lastPoint.lng) && !set.has(lastId)) {
+        toAppend.push(lastId);
+      }
+      result = [...toPrepend, ...result, ...toAppend];
+    }
+    let ordered = [...result].sort(
+      (a, b) => (idToRouteIndex.get(a) ?? -1) - (idToRouteIndex.get(b) ?? -1)
+    );
+    const maxMarkers = mergedConfig.maxMarkers;
+    if (maxMarkers !== void 0 && maxMarkers !== null && maxMarkers > 0 && ordered.length > maxMarkers) {
+      ordered = decimateByConcentrationGrid(
+        ordered,
+        idToPoint,
+        minLng,
+        minLat,
+        maxLng,
+        maxLat,
+        maxMarkers,
+        alwaysShowFirstAndLast && ordered.length > 0 ? { firstId: ordered[0], lastId: ordered[ordered.length - 1] } : void 0
+      );
+    }
+    return ordered;
+  };
+}
+export {
+  createPixelPathDecimationFilter as c
+};

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/createPixelPathDecimationFilter/types.d.ts

@@ -0,0 +1,41 @@
+export type { DecimationFilter, DecimationFilterParams, FeatureWithCoords, } from '../../../contexts/MapContext/types';
+/**
+ * Configuración para el filtro de decimación basado en distancia en píxeles a lo largo del path.
+ *
+ * Usado por `createPixelPathDecimationFilter` para reducir marcadores en capas con secuencias
+ * ordenadas de puntos (recorridos GPS, rutas). El filtro se recalcula en zoom/pan (con debounce);
+ * respeta la distancia mínima entre marcas consecutivas y opcionalmente aplica un tope máximo
+ * mediante grilla espacial.
+ */
+export interface PixelPathFilterConfig {
+    /**
+     * Si es false, el filtro no se aplica y se devuelven todos los featureIds sin filtrar.
+     * Por defecto true (filtrado activo).
+     */
+    enabled?: boolean;
+    /**
+     * Factor de expansión del viewport para el bbox de consulta espacial.
+     * 1 = solo área visible; 1.2 = 20% más en cada dirección (evita marcas que aparecen/desaparecen
+     * en el borde al hacer pan).
+     */
+    viewportOffsetFactor?: number;
+    /**
+     * Distancia mínima en píxeles entre marcas consecutivas a lo largo del path (orden featureIds).
+     * Puntos más cercanos se descartan para evitar saturación visual. Valores típicos: 40–100.
+     */
+    minPixelDistance?: number;
+    /**
+     * Si true, siempre incluye el primer y último punto del path aunque no cumplan minPixelDistance,
+     * para no cortar visualmente el inicio/fin del recorrido.
+     *
+     * Solo se añaden cuando están dentro del viewport visible (ampliado por viewportOffsetFactor).
+     * Si están fuera del área visible, no se renderizan.
+     */
+    alwaysShowFirstAndLast?: boolean;
+    /**
+     * Límite máximo de marcas a mostrar. Si tras la decimación por path y viewport hay más, se aplica
+     * decimación por concentración (grilla espacial: como máximo una marca por celda).
+     * Opcional; si no se define, no se aplica tope.
+     */
+    maxMarkers?: number;
+}

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/kdbush.d.ts

@@ -0,0 +1,15 @@
+declare module 'kdbush' {
+  /**
+   *
+   */
+  export default class KDBush {
+    constructor(numItems: number, nodeSize?: number, ArrayType?: typeof Float64Array);
+    add(x: number, y: number): number;
+    finish(): this;
+    range(minX: number, minY: number, maxX: number, maxY: number): number[];
+    within(x: number, y: number, radius: number): number[];
+    readonly numItems: number;
+    readonly nodeSize: number;
+    static from(data: ArrayBuffer): KDBush;
+  }
+}

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/rbush.d.ts

@@ -0,0 +1,19 @@
+declare module 'rbush' {
+  interface BBox {
+    minX: number;
+    minY: number;
+    maxX: number;
+    maxY: number;
+  }
+
+  /**
+   *
+   */
+  class RBush<T extends BBox = BBox> {
+    load(items: T[]): this;
+    search(bbox: BBox): T[];
+    clear(): this;
+  }
+
+  export default RBush;
+}

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/types.d.ts

@@ -0,0 +1,83 @@
+/**
+ * Configuración para el filtrado de marcas basado en zoom y viewport (RBush)
+ */
+export interface ZoomBasedFilterConfig {
+    /**
+     * Nivel de zoom mínimo donde se muestran todas las marcas en viewport
+     * Por debajo de este zoom, se aplica el filtrado
+     */
+    minZoomForAllMarkers?: number;
+    /**
+     * Límite máximo de marcas a mostrar cuando el zoom está alejado
+     */
+    maxMarkersAtMinZoom?: number;
+    /**
+     * Si es true, usa muestreo espacial (grid) cuando hay más marcas que el límite
+     */
+    useSpatialSampling?: boolean;
+    /**
+     * Si es true, retorna información de la grilla para visualización (solo para debug)
+     */
+    showGridDebug?: boolean;
+    /**
+     * Factor de expansión del viewport para el bounding box (1 = solo visible, 1.2 = 20% más en cada lado)
+     */
+    viewportOffsetFactor?: number;
+    /**
+     * Milisegundos de debounce para moveend/zoomend (evita saturar el pintado en movimientos intensos)
+     */
+    debounceMs?: number;
+    /**
+     * Si es true, usa decimación por distancia (geokdbush): mínima distancia entre marcas según zoom.
+     * Más fluido que grilla: a mayor zoom menos distancia mínima = más marcas.
+     */
+    useDistanceDecimation?: boolean;
+    /**
+     * Distancia mínima entre marcas (m) cuando el zoom está bajo. A mayor zoom la distancia se reduce.
+     * Solo aplica si useDistanceDecimation es true.
+     */
+    minDistanceMetersAtLowZoom?: number;
+    /**
+     * Distancia mínima entre marcas (m) cuando el zoom está alto.
+     * Solo aplica si useDistanceDecimation es true.
+     */
+    minDistanceMetersAtHighZoom?: number;
+    /**
+     * Nivel de zoom considerado "bajo" para minDistanceMetersAtLowZoom.
+     */
+    lowZoomLevel?: number;
+    /**
+     * Nivel de zoom considerado "alto" para minDistanceMetersAtHighZoom.
+     */
+    highZoomLevel?: number;
+    /**
+     * Si es true, al decimar se distribuyen los puntos a lo largo de la distancia total del recorrido
+     * (orden de featureIds), no se toman solo los primeros. Evita que queden "pegados" al inicio.
+     */
+    distributeByPathDistance?: boolean;
+}
+/**
+ * Configuración transversal del hook useFilterDecimation.
+ * Afecta cómo se programa la recomputación ante zoom/pan, no a la lógica de decimación.
+ */
+export interface UseFilterDecimationConfig {
+    /**
+     * Debounce en ms antes de recalcular tras zoomend/moveend.
+     * Si hay zoom o movimiento continuo, se cancela el cálculo pendiente y se programa uno nuevo.
+     * 0 = sin debounce (ejecución inmediata). Por defecto 150.
+     */
+    debounceMs?: number;
+}
+/**
+ * Información de una celda de la grilla para visualización
+ */
+export interface GridCell {
+    bounds: {
+        north: number;
+        south: number;
+        east: number;
+        west: number;
+    };
+    featureCount: number;
+    selected: boolean;
+}

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/useFilterDecimation.d.ts

@@ -0,0 +1,11 @@
+import { DecimationFilter } from '../../contexts/MapContext/types';
+import { UseFilterDecimationConfig } from './types';
+/**
+ * Hook que filtra featureIds según la función decimationFilter de la capa.
+ * Si decimationFilter está definida: la invoca con viewport, zoom, featureIds, etc.
+ * en cada zoom/pan y retorna los ids filtrados.
+ * Si no está definida: retorna todos los featureIds sin filtrar.
+ *
+ * config: configuración transversal (debounce en zoom/pan), no afecta la lógica de decimación.
+ */
+export declare function useFilterDecimation(featureIds: (string | number)[], layerId: string, decimationFilter?: DecimationFilter, config?: UseFilterDecimationConfig): (string | number)[];

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/useFilterDecimation.js

@@ -0,0 +1,112 @@
+import { useState, useTransition, useRef, useEffect } from "react";
+import debounce from "lodash-es/debounce";
+import { useMap } from "react-leaflet";
+import { u as useMapStore } from "../useMapStore/index.js";
+import { deepShallow } from "@m4l/components";
+import { U as USE_FILTER_DECIMATION_DEFAULT_DEBOUNCE_MS } from "./constants.js";
+function useFilterDecimation(featureIds, layerId, decimationFilter, config) {
+  const map = useMap();
+  const debounceMs = config?.debounceMs ?? USE_FILTER_DECIMATION_DEFAULT_DEBOUNCE_MS;
+  const [filteredIds, setFilteredIds] = useState(() => featureIds);
+  const [, startTransition] = useTransition();
+  const isMountedRef = useRef(true);
+  const featureIdsRef = useRef(featureIds);
+  featureIdsRef.current = featureIds;
+  const featuresWithCoords = useMapStore(
+    (state) => {
+      const geoJsonObject = state.hashLayers[layerId]?.geoJsonObject;
+      if (!geoJsonObject || geoJsonObject.object.type !== "FeatureCollection") {
+        return [];
+      }
+      const idSet = new Set(featureIds);
+      return geoJsonObject.object.features.filter((f) => idSet.has(f.id)).map((f) => {
+        if (f.geometry.type === "Point") {
+          const [lng, lat] = f.geometry.coordinates;
+          return { id: f.id, lat, lng };
+        }
+        return null;
+      }).filter((f) => f !== null);
+    },
+    deepShallow
+  );
+  useEffect(() => {
+    isMountedRef.current = true;
+    return () => {
+      isMountedRef.current = false;
+    };
+  }, []);
+  const cacheRef = useRef(/* @__PURE__ */ new Map());
+  useEffect(() => {
+    cacheRef.current.clear();
+    if (!decimationFilter) {
+      startTransition(() => setFilteredIds([...featureIds]));
+      return;
+    }
+    if (featureIds.length === 0) {
+      startTransition(() => setFilteredIds([]));
+      return;
+    }
+    if (!map) {
+      return;
+    }
+    const cache = {
+      /**
+       * Obtiene un valor cacheado o lo computa con factory y lo cachea.
+       */
+      get(key, factory) {
+        if (!cacheRef.current.has(key)) {
+          cacheRef.current.set(key, factory());
+        }
+        return cacheRef.current.get(key);
+      }
+    };
+    const computeFiltered = () => {
+      const currentFeatureIds = featureIdsRef.current;
+      if (currentFeatureIds.length === 0) {
+        if (isMountedRef.current) {
+          startTransition(() => setFilteredIds([]));
+        }
+        return;
+      }
+      const bounds = map.getBounds();
+      const zoom = map.getZoom();
+      const filtered = decimationFilter({
+        featureIds: currentFeatureIds,
+        layerId,
+        bounds,
+        zoom,
+        map,
+        featuresWithCoords,
+        cache
+      });
+      if (isMountedRef.current) {
+        startTransition(() => setFilteredIds(filtered));
+      }
+    };
+    const scheduleCompute = debounceMs <= 0 ? computeFiltered : debounce(computeFiltered, debounceMs);
+    computeFiltered();
+    map.on("zoomend", scheduleCompute);
+    map.on("moveend", scheduleCompute);
+    return () => {
+      const debouncedFn = scheduleCompute;
+      debouncedFn.cancel?.();
+      map.off("zoomend", scheduleCompute);
+      map.off("moveend", scheduleCompute);
+    };
+  }, [
+    decimationFilter,
+    debounceMs,
+    featureIds,
+    featuresWithCoords,
+    layerId,
+    map,
+    startTransition
+  ]);
+  if (!decimationFilter) {
+    return featureIds;
+  }
+  return filteredIds;
+}
+export {
+  useFilterDecimation as u
+};

package/components/maps/components/GpsMap/hooks/useZoomBasedMarkerFilter/useGridDebug.d.ts

@@ -0,0 +1,5 @@
+import { ZoomBasedFilterConfig, GridCell } from './types';
+/**
+ * Hook que retorna información de la grilla para visualización (solo para debug)
+ */
+export declare function useGridDebug(featureIds: (string | number)[], layerId: string, config?: ZoomBasedFilterConfig): GridCell[];