@jjlmoya/utils-tools 1.1.0

package/src/tool/routes/i18n/es.ts

@@ -0,0 +1,157 @@
+import type { ToolLocaleContent } from '../../../types';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
+import type { RoutesUI } from '../ui';
+
+const faqData = [
+  {
+    question: '¿Cuál es el algoritmo de optimización que utiliza?',
+    answer: 'Utiliza una resolución avanzada del Problema del Viajante (TSP). El algoritmo analiza todas las paradas y determina el orden secuencial que minimiza la distancia total recorrida, ahorrando tiempo y combustible.',
+  },
+  {
+    question: '¿Es seguro compartir mi ubicación?',
+    answer: 'Sí. La herramienta procesa los datos geográficos de forma local en tu navegador. Nosotros no almacenamos tus rutas, paradas ni historial de ubicaciones en nuestros servidores.',
+  },
+  {
+    question: '¿Cuántas paradas puedo optimizar a la vez?',
+    answer: 'Nuestra versión gratuita permite optimizar hasta 10 paradas de forma instantánea. Para rutas profesionales más amplias, el sistema está optimizado para mantener un rendimiento alto sin bloqueos en el navegador.',
+  },
+  {
+    question: '¿Puedo usar la ruta directamente en Google Maps?',
+    answer: '¡Claro! Una vez optimizada la ruta, la herramienta genera un enlace de navegación compatible con Google Maps para que puedas iniciar el viaje directamente desde tu móvil.',
+  },
+];
+
+const howToData = [
+  {
+    name: 'Añadir punto de origen',
+    text: 'Escribe la dirección de inicio o pulsa en el mapa para fijar desde dónde comienza tu ruta.',
+  },
+  {
+    name: 'Introducir paradas de destino',
+    text: 'Añade todas las ubicaciones que necesitas visitar. No importa el orden, ya que el sistema las reordenará por ti.',
+  },
+  {
+    name: 'Optimizar la secuencia',
+    text: 'Pulsa el botón de optimizar. El algoritmo calculará en segundos el orden más eficiente para recorrer todas las paradas.',
+  },
+  {
+    name: 'Abrir en navegador',
+    text: 'Utiliza el botón de navegación para llevarte la ruta optimizada a tu aplicación de mapas favorita.',
+  },
+];
+
+const faqSchema: WithContext<FAQPage> = {
+  '@context': 'https://schema.org',
+  '@type': 'FAQPage',
+  mainEntity: faqData.map((item) => ({
+    '@type': 'Question',
+    name: item.question,
+    acceptedAnswer: { '@type': 'Answer', text: item.answer },
+  })),
+};
+
+const howToSchema: WithContext<HowTo> = {
+  '@context': 'https://schema.org',
+  '@type': 'HowTo',
+  name: 'Cómo optimizar una ruta con múltiples paradas',
+  step: howToData.map((s) => ({ '@type': 'HowToStep', name: s.name, text: s.text })),
+};
+
+const appSchema: WithContext<SoftwareApplication> = {
+  '@context': 'https://schema.org',
+  '@type': 'SoftwareApplication',
+  name: 'Calculadora de Rutas Óptimas',
+  applicationCategory: 'UtilitiesApplication',
+  operatingSystem: 'Web',
+  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
+  description: 'Optimiza tus rutas de reparto o viaje gratis. Reordena paradas automáticamente para encontrar el camino más corto y eficiente.',
+};
+
+const ui: RoutesUI = {
+  titleSidebar: 'Puntos de Ruta',
+  descriptionSidebar: 'Haz clic en el mapa para añadir paradas. El primer punto es el inicio.',
+  emptyState: 'Sin puntos añadidos',
+  btnOptimize: 'Calcular Ruta Óptima',
+  btnCalculating: 'Calculando...',
+  btnClear: 'Borrar Todo',
+  labelDistance: 'Distancia Total Estimada',
+  labelDeleteAria: 'Eliminar',
+  labelLoadingAddress: 'Cargando dirección...',
+  labelPoint: 'Punto',
+  errorMinPoints: 'Se necesitan al menos dos puntos para calcular una ruta.',
+  errorCalculate: 'Error al calcular la ruta.',
+  errorAddress: 'Error al obtener dirección',
+  errorAddressName: 'Punto desconocido',
+};
+
+export const content: ToolLocaleContent<RoutesUI> = {
+  slug: 'rutas-optimas',
+  title: 'Calculadora de Rutas Óptimas Gratis',
+  description: 'Optimiza tus rutas de reparto o viaje gratis. Nuestra herramienta reordena tus paradas automáticamente para encontrar el camino más corto y eficiente.',
+  ui,
+  faqTitle: 'Preguntas Frecuentes',
+  faq: faqData,
+  howTo: howToData,
+  bibliographyTitle: 'Tecnologías y Fuentes',
+  bibliography: [
+    { name: 'Leaflet — Librería de mapas interactivos de código abierto', url: 'https://leafletjs.com/' },
+    { name: 'OpenStreetMap — Datos cartográficos abiertos', url: 'https://www.openstreetmap.org/' },
+    { name: 'CARTO — Tiles de mapas Voyager', url: 'https://carto.com/basemaps/' },
+    { name: 'Nominatim — Servicio de geocodificación inversa (OpenStreetMap)', url: 'https://nominatim.org/' },
+    { name: 'OSRM — Open Source Routing Machine (optimización de rutas)', url: 'http://project-osrm.org/' },
+  ],
+  schemas: [faqSchema, howToSchema, appSchema],
+  seo: [
+    {
+      type: 'title',
+      text: 'Optimizador de Rutas Inteligente: TSP para Repartos y Viajes',
+      level: 2,
+    },
+    {
+      type: 'paragraph',
+      html: 'El <strong>optimizador de rutas online</strong> es una herramienta gratuita que resuelve el clásico <em>Problema del Viajante (TSP)</em>. Añade todas tus paradas sin importar el orden y el algoritmo calculará automáticamente la secuencia más eficiente para minimizar la distancia total recorrida.',
+    },
+    {
+      type: 'title',
+      text: '¿Cómo funciona el algoritmo de optimización de rutas?',
+      level: 2,
+    },
+    {
+      type: 'paragraph',
+      html: 'La herramienta utiliza la API de <strong>OSRM (Open Source Routing Machine)</strong>, un motor de enrutamiento de alto rendimiento basado en datos de OpenStreetMap. El proceso es: primero calcula la ruta circular óptima entre todos los puntos (algoritmo TSP), luego determina el mejor punto de corte para convertirla en un recorrido lineal de ida, y finalmente dibuja la ruta sobre el mapa con la distancia total estimada.',
+    },
+    {
+      type: 'title',
+      text: 'Casos de uso: repartos, comerciales y viajes',
+      level: 2,
+    },
+    {
+      type: 'paragraph',
+      html: 'El optimizador de rutas es ideal para <strong>repartidores autónomos</strong> que necesitan organizar múltiples entregas diarias, <strong>comerciales a puerta fría</strong> que visitan clientes en una zona, o <strong>viajeros</strong> que quieren conocer varias ciudades o monumentos en el orden más eficiente. La herramienta procesa toda la información en el navegador, sin compartir tus datos con ningún servidor propio.',
+    },
+    {
+      type: 'stats',
+      columns: 2,
+      items: [
+        { value: 'TSP', label: 'Algoritmo', icon: 'mdi:chart-line' },
+        { value: 'OSRM', label: 'Motor de rutas', icon: 'mdi:map-marker-path' },
+        { value: 'Local-First', label: 'Privacidad', icon: 'mdi:lock-check' },
+        { value: 'Gratuito', label: 'Coste', icon: 'mdi:currency-eur-off' },
+      ],
+    },
+    {
+      type: 'title',
+      text: 'Privacidad y procesamiento local',
+      level: 2,
+    },
+    {
+      type: 'paragraph',
+      html: 'Toda la lógica de la herramienta se ejecuta directamente en tu navegador. Las coordenadas de tus paradas solo se envían a las APIs públicas de OSRM y Nominatim para calcular rutas y obtener nombres de dirección, pero <strong>no se almacenan en ningún servidor propio</strong>. Puedes usar la herramienta con total seguridad para planificar rutas de negocio con información sensible.',
+    },
+    {
+      type: 'tip',
+      title: 'Consejo de uso',
+      html: '<strong>Para mejores resultados</strong>, añade las paradas haciendo clic directamente en el mapa en lugar de usar búsqueda de direcciones. Los marcadores son arrastrables, por lo que puedes ajustar la posición exacta de cada punto después de colocarlo.',
+    },
+  ],
+};

package/src/tool/routes/i18n/fr.ts

@@ -0,0 +1,157 @@
+import type { ToolLocaleContent } from '../../../types';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
+import type { RoutesUI } from '../ui';
+
+const faqData = [
+  {
+    question: "Quel algorithme d'optimisation utilise-t-il ?",
+    answer: "Il utilise une résolution avancée du Problème du Voyageur de Commerce (TSP). L'algorithme analyse tous les arrêts et détermine l'ordre séquentiel qui minimise la distance totale parcourue, économisant ainsi du temps et du carburant.",
+  },
+  {
+    question: 'Est-il sûr de partager ma localisation ?',
+    answer: "Oui. L'outil traite les données géographiques localement dans votre navigateur. Nous ne stockons pas vos itinéraires, arrêts ou historique de localisation sur nos serveurs.",
+  },
+  {
+    question: "Combien d'arrêts puis-je optimiser à la fois ?",
+    answer: "Notre version gratuite permet d'optimiser jusqu'à 10 arrêts instantanément. Pour des itinéraires professionnels plus étendus, le système est optimisé pour maintenir de hautes performances sans bloquer le navigateur.",
+  },
+  {
+    question: "Puis-je utiliser l'itinéraire directement dans Google Maps ?",
+    answer: "Bien sûr ! Une fois l'itinéraire optimisé, l'outil génère un lien de navigation compatible avec Google Maps pour que vous puissiez démarrer le voyage directement depuis votre téléphone.",
+  },
+];
+
+const howToData = [
+  {
+    name: 'Ajouter le point de départ',
+    text: "Saisissez l'adresse de départ ou cliquez sur la carte pour fixer le point de départ de votre itinéraire.",
+  },
+  {
+    name: 'Saisir les arrêts de destination',
+    text: "Ajoutez tous les lieux que vous devez visiter. L'ordre n'a pas d'importance, car le système les réordonnera pour vous.",
+  },
+  {
+    name: "Optimiser la séquence",
+    text: "Cliquez sur le bouton d'optimisation. L'algorithme calculera en quelques secondes l'ordre le plus efficace pour parcourir tous les arrêts.",
+  },
+  {
+    name: 'Ouvrir dans le navigateur',
+    text: "Utilisez le bouton de navigation pour transférer l'itinéraire optimisé vers votre application de cartographie préférée.",
+  },
+];
+
+const faqSchema: WithContext<FAQPage> = {
+  '@context': 'https://schema.org',
+  '@type': 'FAQPage',
+  mainEntity: faqData.map((item) => ({
+    '@type': 'Question',
+    name: item.question,
+    acceptedAnswer: { '@type': 'Answer', text: item.answer },
+  })),
+};
+
+const howToSchema: WithContext<HowTo> = {
+  '@context': 'https://schema.org',
+  '@type': 'HowTo',
+  name: 'Comment optimiser un itinéraire avec plusieurs arrêts',
+  step: howToData.map((s) => ({ '@type': 'HowToStep', name: s.name, text: s.text })),
+};
+
+const appSchema: WithContext<SoftwareApplication> = {
+  '@context': 'https://schema.org',
+  '@type': 'SoftwareApplication',
+  name: "Calculateur d'itinéraires optimaux",
+  applicationCategory: 'UtilitiesApplication',
+  operatingSystem: 'Web',
+  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
+  description: "Optimisez vos itinéraires de livraison ou de voyage gratuitement. Réorganisez automatiquement vos arrêts pour trouver le chemin le plus court et le plus efficace.",
+};
+
+const ui: RoutesUI = {
+  titleSidebar: "Points d'itinéraire",
+  descriptionSidebar: "Cliquez sur la carte pour ajouter des arrêts. Le premier point est le départ.",
+  emptyState: 'Aucun point ajouté',
+  btnOptimize: "Calculer l'itinéraire optimal",
+  btnCalculating: 'Calcul en cours...',
+  btnClear: 'Tout effacer',
+  labelDistance: 'Distance totale estimée',
+  labelDeleteAria: 'Supprimer',
+  labelLoadingAddress: 'Chargement de l\'adresse...',
+  labelPoint: 'Point',
+  errorMinPoints: 'Au moins deux points sont nécessaires pour calculer un itinéraire.',
+  errorCalculate: "Erreur lors du calcul de l'itinéraire.",
+  errorAddress: "Erreur lors de la récupération de l'adresse",
+  errorAddressName: 'Point inconnu',
+};
+
+export const content: ToolLocaleContent<RoutesUI> = {
+  slug: 'itineraires-optimaux',
+  title: "Calculateur d'itinéraires optimaux gratuit",
+  description: "Optimisez vos itinéraires de livraison ou de voyage gratuitement. Notre outil réorganise automatiquement vos arrêts pour trouver le chemin le plus court et le plus efficace.",
+  ui,
+  faqTitle: 'Questions fréquentes',
+  faq: faqData,
+  howTo: howToData,
+  bibliographyTitle: 'Technologies et sources',
+  bibliography: [
+    { name: 'Leaflet — Bibliothèque de cartes interactives open source', url: 'https://leafletjs.com/' },
+    { name: 'OpenStreetMap — Données cartographiques ouvertes', url: 'https://www.openstreetmap.org/' },
+    { name: 'CARTO — Tuiles de carte Voyager', url: 'https://carto.com/basemaps/' },
+    { name: 'Nominatim — Service de géocodage inverse (OpenStreetMap)', url: 'https://nominatim.org/' },
+    { name: "OSRM — Open Source Routing Machine (optimisation d'itinéraires)", url: 'http://project-osrm.org/' },
+  ],
+  schemas: [faqSchema, howToSchema, appSchema],
+  seo: [
+    {
+      type: 'title',
+      text: "Optimiseur d'itinéraires intelligent : TSP pour livraisons et voyages",
+      level: 2,
+    },
+    {
+      type: 'paragraph',
+      html: "L'<strong>optimiseur d'itinéraires en ligne</strong> est un outil gratuit qui résout le classique <em>Problème du Voyageur de Commerce (TSP)</em>. Ajoutez tous vos arrêts dans n'importe quel ordre et l'algorithme calculera automatiquement la séquence la plus efficace pour minimiser la distance totale parcourue.",
+    },
+    {
+      type: 'title',
+      text: "Comment fonctionne l'algorithme d'optimisation d'itinéraires ?",
+      level: 2,
+    },
+    {
+      type: 'paragraph',
+      html: "L'outil utilise l'API <strong>OSRM (Open Source Routing Machine)</strong>, un moteur de routage haute performance basé sur les données OpenStreetMap. Le processus : d'abord il calcule l'itinéraire circulaire optimal entre tous les points (algorithme TSP), puis détermine le meilleur point de coupe pour le convertir en trajet linéaire aller simple, et enfin trace l'itinéraire sur la carte avec la distance totale estimée.",
+    },
+    {
+      type: 'title',
+      text: "Cas d'usage : livraisons, commerciaux et voyages",
+      level: 2,
+    },
+    {
+      type: 'paragraph',
+      html: "L'optimiseur d'itinéraires est idéal pour les <strong>livreurs indépendants</strong> qui doivent organiser plusieurs livraisons quotidiennes, les <strong>commerciaux terrain</strong> visitant des clients dans une zone, ou les <strong>voyageurs</strong> souhaitant visiter plusieurs villes ou monuments dans l'ordre le plus efficace. L'outil traite toutes les informations dans le navigateur, sans partager vos données avec aucun serveur propriétaire.",
+    },
+    {
+      type: 'stats',
+      columns: 2,
+      items: [
+        { value: 'TSP', label: 'Algorithme', icon: 'mdi:chart-line' },
+        { value: 'OSRM', label: 'Moteur de routage', icon: 'mdi:map-marker-path' },
+        { value: 'Local-First', label: 'Confidentialité', icon: 'mdi:lock-check' },
+        { value: 'Gratuit', label: 'Coût', icon: 'mdi:currency-eur-off' },
+      ],
+    },
+    {
+      type: 'title',
+      text: 'Confidentialité et traitement local',
+      level: 2,
+    },
+    {
+      type: 'paragraph',
+      html: "Toute la logique de l'outil s'exécute directement dans votre navigateur. Les coordonnées de vos arrêts sont uniquement envoyées aux APIs publiques OSRM et Nominatim pour calculer les itinéraires et obtenir les noms d'adresse, mais <strong>ne sont stockées sur aucun serveur propriétaire</strong>. Vous pouvez utiliser l'outil en toute sécurité pour planifier des itinéraires professionnels avec des informations sensibles.",
+    },
+    {
+      type: 'tip',
+      title: "Conseil d'utilisation",
+      html: "<strong>Pour de meilleurs résultats</strong>, ajoutez les arrêts en cliquant directement sur la carte plutôt qu'en cherchant des adresses. Les marqueurs sont déplaçables, vous pouvez donc ajuster la position exacte de chaque point après l'avoir placé.",
+    },
+  ],
+};

package/src/tool/routes/index.ts

@@ -0,0 +1,22 @@
+import type { ToolDefinition, ToolsToolEntry } from '../../types';
+import type { RoutesUI } from './ui';
+import RoutesComponent from './component.astro';
+import RoutesSEO from './seo.astro';
+import RoutesBibliography from './bibliography.astro';
+
+export const routes: ToolsToolEntry<RoutesUI> = {
+  id: 'routes',
+  icons: { bg: 'mdi:map-marker-path', fg: 'mdi:map-search' },
+  i18n: {
+    es: () => import('./i18n/es').then((m) => m.content),
+    en: () => import('./i18n/en').then((m) => m.content),
+    fr: () => import('./i18n/fr').then((m) => m.content),
+  },
+};
+
+export const ROUTES_TOOL: ToolDefinition = {
+  entry: routes,
+  Component: RoutesComponent,
+  SEOComponent: RoutesSEO,
+  BibliographyComponent: RoutesBibliography,
+};

package/src/tool/routes/logic/GeocodingService.ts

@@ -0,0 +1,60 @@
+export interface GeocodingResult {
+  address: string;
+  name: string;
+}
+
+export interface GeocodingStrings {
+  addressUnknown: string;
+  errorAddress: string;
+  errorAddressName: string;
+}
+
+interface NominatimAddress {
+  road?: string;
+  house_number?: string;
+  suburb?: string;
+  city?: string;
+  town?: string;
+  village?: string;
+}
+
+interface NominatimResponse {
+  address?: NominatimAddress;
+  display_name: string;
+}
+
+function resolveCity(addr: NominatimAddress): string {
+  return addr.city ?? addr.town ?? addr.village ?? '';
+}
+
+function buildAddressString(addr: NominatimAddress, displayName: string): string {
+  const parts: string[] = [];
+  if (addr.road) parts.push(addr.road);
+  if (addr.house_number) parts.push(addr.house_number);
+  if (addr.suburb && !addr.road) parts.push(addr.suburb);
+  const city = resolveCity(addr);
+  if (city) parts.push(city);
+  return parts.join(', ') || (displayName.split(',')[0] ?? '');
+}
+
+export class GeocodingService {
+  private strings: GeocodingStrings;
+
+  constructor(strings: GeocodingStrings) {
+    this.strings = strings;
+  }
+
+  async getAddress(lat: number, lng: number): Promise<GeocodingResult> {
+    try {
+      const url = `https://nominatim.openstreetmap.org/reverse?format=json&lat=${lat}&lon=${lng}&zoom=18&addressdetails=1`;
+      const response = await fetch(url, { headers: { 'User-Agent': 'RutasApp/1.0' } });
+      const data = await response.json() as NominatimResponse;
+      const addressStr = data.address
+        ? buildAddressString(data.address, data.display_name)
+        : this.strings.addressUnknown;
+      return { address: addressStr, name: addressStr };
+    } catch {
+      return { address: this.strings.errorAddress, name: this.strings.errorAddressName };
+    }
+  }
+}

package/src/tool/routes/logic/RouteManager.ts

@@ -0,0 +1,192 @@
+import type * as LeafletNS from 'leaflet';
+import type { GeocodingService } from './GeocodingService';
+import type { RouteService, OsrmWaypoint, OsrmLeg, OsrmRoute } from './RouteService';
+
+declare const L: typeof LeafletNS;
+
+export interface RoutePoint {
+  id: number;
+  lat: number;
+  lng: number;
+  marker: L.Marker;
+  name: string;
+  address?: string;
+}
+
+export interface RouteManagerStrings {
+  labelLoadingAddress: string;
+  labelPoint: string;
+  labelDeleteAria: string;
+  errorMinPoints: string;
+  errorCalculate: string;
+}
+
+export class RouteManager extends EventTarget {
+  private map: L.Map | null = null;
+  private points: RoutePoint[] = [];
+  private routeLine: L.GeoJSON | null = null;
+  private geocoding: GeocodingService;
+  private routing: RouteService;
+  private strings: RouteManagerStrings;
+
+  constructor(geocoding: GeocodingService, routing: RouteService, strings: RouteManagerStrings) {
+    super();
+    this.geocoding = geocoding;
+    this.routing = routing;
+    this.strings = strings;
+  }
+
+  initMap(elementId: string) {
+    const el = document.getElementById(elementId);
+    if (!el) return;
+    this.map = L.map(elementId).setView([40.416775, -3.70379], 6);
+    L.tileLayer('https://{s}.basemaps.cartocdn.com/rastertiles/voyager/{z}/{x}/{y}{r}.png', {
+      attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors &copy; <a href="https://carto.com/attributions">CARTO</a>',
+      subdomains: 'abcd',
+      maxZoom: 20,
+    }).addTo(this.map);
+    this.map.on('click', (e: L.LeafletMouseEvent) => { this.addPoint(e.latlng.lat, e.latlng.lng); });
+    if ('geolocation' in navigator) {
+      navigator.geolocation.getCurrentPosition((pos) => {
+        this.map?.setView([pos.coords.latitude, pos.coords.longitude], 13);
+      });
+    }
+  }
+
+  private getNumberedIcon(number: number): L.DivIcon {
+    return L.divIcon({
+      className: 'rut-icon-container',
+      html: `<div class="rut-icon">${number}</div>`,
+      iconSize: [30, 30],
+      iconAnchor: [15, 36],
+      popupAnchor: [0, -36],
+    });
+  }
+
+  async addPoint(lat: number, lng: number) {
+    if (!this.map) return;
+    const id = Date.now();
+    const index = this.points.length + 1;
+    const marker = L.marker([lat, lng], { draggable: true, icon: this.getNumberedIcon(index) }).addTo(this.map);
+    const point: RoutePoint = { id, lat, lng, marker, name: `${this.strings.labelPoint} ${index}`, address: this.strings.labelLoadingAddress };
+    this.points.push(point);
+    this.notifyUpdate();
+    marker.on('dragend', () => {
+      const pos = marker.getLatLng();
+      point.lat = pos.lat;
+      point.lng = pos.lng;
+      this.clearRoute();
+      this.updateAddress(point);
+    });
+    await this.updateAddress(point);
+  }
+
+  private async updateAddress(point: RoutePoint) {
+    const result = await this.geocoding.getAddress(point.lat, point.lng);
+    point.address = result.address;
+    point.name = result.name;
+    this.bindMarkerPopup(point);
+    this.notifyUpdate();
+  }
+
+  private bindMarkerPopup(point: RoutePoint) {
+    const div = document.createElement('div');
+    div.className = 'rut-popup';
+    div.innerHTML = `<strong class="rut-popup-name">${point.name}</strong><p class="rut-popup-coords">Lat: ${point.lat.toFixed(4)}, Lng: ${point.lng.toFixed(4)}</p><button class="rut-popup-btn" id="rut-del-${point.id}">${this.strings.labelDeleteAria}</button>`;
+    point.marker.bindPopup(div);
+    point.marker.on('popupopen', () => {
+      document.getElementById(`rut-del-${point.id}`)?.addEventListener('click', () => this.deletePoint(point.id));
+    });
+  }
+
+  deletePoint(id: number) {
+    const index = this.points.findIndex((p) => p.id === id);
+    if (index === -1) return;
+    const point = this.points[index];
+    if (point) this.map?.removeLayer(point.marker);
+    this.points.splice(index, 1);
+    this.refreshMarkerIcons();
+    this.clearRoute();
+    this.notifyUpdate();
+  }
+
+  private refreshMarkerIcons() {
+    this.points.forEach((point, index) => { point.marker.setIcon(this.getNumberedIcon(index + 1)); });
+  }
+
+  clearAll() {
+    this.points.forEach((p) => this.map?.removeLayer(p.marker));
+    this.points = [];
+    this.clearRoute();
+    this.notifyUpdate();
+  }
+
+  private clearRoute() {
+    if (this.routeLine && this.map) {
+      this.map.removeLayer(this.routeLine);
+      this.routeLine = null;
+    }
+    this.dispatchEvent(new CustomEvent('routeCleared'));
+  }
+
+  private findCutIndex(legs: OsrmLeg[]): number {
+    let maxIdx = 0;
+    let maxDist = -1;
+    legs.forEach((leg, idx) => {
+      if (leg.distance > maxDist) { maxDist = leg.distance; maxIdx = idx; }
+    });
+    return maxIdx;
+  }
+
+  private reorderPoints(waypoints: OsrmWaypoint[], legs: OsrmLeg[]): RoutePoint[] {
+    const mapped = waypoints
+      .map((wp) => (wp.waypoint_index !== undefined && wp.waypoint_index < this.points.length ? this.points[wp.waypoint_index] : undefined))
+      .filter((p): p is RoutePoint => p !== undefined);
+    if (mapped.length !== this.points.length) return this.points;
+    const startIdx = (this.findCutIndex(legs) + 1) % mapped.length;
+    return [...mapped.slice(startIdx), ...mapped.slice(0, startIdx)];
+  }
+
+  private drawRouteGeometry(route: OsrmRoute) {
+    this.clearRoute();
+    const feature: GeoJSON.Feature = { type: 'Feature', properties: {}, geometry: route.geometry as GeoJSON.Geometry };
+    this.routeLine = L.geoJSON(feature, {
+      style: { color: '#0891b2', weight: 5, opacity: 0.8, lineCap: 'round', lineJoin: 'round' },
+    }).addTo(this.map!);
+    this.map?.fitBounds(this.routeLine.getBounds(), { padding: [50, 50] });
+  }
+
+  async optimizeRoute() {
+    if (this.points.length < 2) {
+      this.dispatchEvent(new CustomEvent('error', { detail: this.strings.errorMinPoints }));
+      return;
+    }
+    this.dispatchEvent(new CustomEvent('loading', { detail: true }));
+    try {
+      const { waypoints, trip } = await this.routing.optimizeRoute(this.points);
+      this.points = this.reorderPoints(waypoints, trip.legs);
+      this.refreshMarkerIcons();
+      this.notifyUpdate();
+      const route = await this.routing.getRoute(this.points);
+      this.drawRouteGeometry(route);
+      this.dispatchEvent(new CustomEvent('routeCalculated', { detail: { distance: route.distance } }));
+    } catch (error) {
+      console.error(error);
+      this.dispatchEvent(new CustomEvent('error', { detail: this.strings.errorCalculate }));
+    } finally {
+      this.dispatchEvent(new CustomEvent('loading', { detail: false }));
+    }
+  }
+
+  panToPoint(id: number) {
+    const point = this.points.find((p) => p.id === id);
+    if (point && this.map) {
+      this.map.flyTo([point.lat, point.lng], 16);
+      point.marker.openPopup();
+    }
+  }
+
+  private notifyUpdate() {
+    this.dispatchEvent(new CustomEvent('update', { detail: this.points }));
+  }
+}

package/src/tool/routes/logic/RouteService.ts

@@ -0,0 +1,66 @@
+export interface OsrmWaypoint {
+  waypoint_index?: number;
+  location: [number, number];
+}
+
+export interface OsrmLeg {
+  distance: number;
+  duration: number;
+}
+
+export interface OsrmTrip {
+  legs: OsrmLeg[];
+  distance: number;
+}
+
+export interface OsrmGeometry {
+  type: string;
+  coordinates: [number, number][];
+}
+
+export interface OsrmRoute {
+  geometry: OsrmGeometry;
+  distance: number;
+}
+
+export interface OptimizationResult {
+  waypoints: OsrmWaypoint[];
+  trip: OsrmTrip;
+}
+
+interface OsrmTripResponse {
+  code: string;
+  message?: string;
+  waypoints: OsrmWaypoint[];
+  trips: OsrmTrip[];
+}
+
+interface OsrmRouteResponse {
+  code: string;
+  message?: string;
+  routes: OsrmRoute[];
+}
+
+export class RouteService {
+  async optimizeRoute(points: { lat: number; lng: number }[]): Promise<OptimizationResult> {
+    const coords = points.map((p) => `${p.lng},${p.lat}`).join(';');
+    const url = `https://router.project-osrm.org/trip/v1/driving/${coords}?source=any&roundtrip=true&geometries=geojson&overview=full`;
+    const response = await fetch(url);
+    const data = await response.json() as OsrmTripResponse;
+    if (data.code !== 'Ok') throw new Error(data.message ?? 'Route optimization failed');
+    const trip = data.trips[0];
+    if (!trip) throw new Error('No trip returned');
+    return { waypoints: data.waypoints, trip };
+  }
+
+  async getRoute(points: { lat: number; lng: number }[]): Promise<OsrmRoute> {
+    const coords = points.map((p) => `${p.lng},${p.lat}`).join(';');
+    const url = `https://router.project-osrm.org/route/v1/driving/${coords}?geometries=geojson&overview=full`;
+    const response = await fetch(url);
+    const data = await response.json() as OsrmRouteResponse;
+    if (data.code !== 'Ok') throw new Error(data.message ?? 'Route calculation failed');
+    const route = data.routes[0];
+    if (!route) throw new Error('No route returned');
+    return route;
+  }
+}

package/src/tool/routes/seo.astro

@@ -0,0 +1,14 @@
+---
+import { SEORenderer } from '@jjlmoya/utils-shared';
+import { routes } from './index';
+import type { KnownLocale } from '../../types';
+
+interface Props {
+  locale?: KnownLocale;
+}
+
+const { locale = 'es' } = Astro.props;
+const content = await routes.i18n[locale]?.();
+---
+
+{content && <SEORenderer content={{ locale, sections: content.seo }} />}