@smartnet360/svelte-components 0.0.84 → 0.0.86

package/dist/apps/site-check/helper.js

@@ -6,11 +6,12 @@ import { createStyledKPI, sortCellsByBandFrequency, assignStackGroups } from './
  * @param baseLayout - The base layout configuration from JSON
  * @param data - Filtered cell traffic records for selected cells
  * @param grouping - Current tree grouping configuration (determines label format)
+ * @param colorDimension - Which field to use for coloring (site or band)
  * @param stylingConfig - Optional cell styling configuration (band colors, sector line styles)
  * @param stackGroupMode - Optional stackgroup strategy for stacked charts (default: 'none' = single stack)
  * @returns Expanded layout with cell-specific KPIs
  */
-export function expandLayoutForCells(baseLayout, data, grouping, stylingConfig, stackGroupMode = 'none') {
+export function expandLayoutForCells(baseLayout, data, grouping, colorDimension, stylingConfig, stackGroupMode = 'none') {
     // Get unique cells and their metadata, sorted by band frequency
     const cellMap = new Map();
     data.forEach((record) => {
@@ -38,8 +39,8 @@ export function expandLayoutForCells(baseLayout, data, grouping, stylingConfig,
                 ...section,
                 charts: section.charts.map((chart) => ({
                     ...chart,
-                    yLeft: expandKPIs(chart.yLeft, cells, grouping, effectiveStyling, stackGroupMode),
-                    yRight: expandKPIs(chart.yRight, cells, grouping, effectiveStyling, stackGroupMode)
+                    yLeft: expandKPIs(chart.yLeft, cells, grouping, colorDimension, effectiveStyling, stackGroupMode),
+                    yRight: expandKPIs(chart.yRight, cells, grouping, colorDimension, effectiveStyling, stackGroupMode)
                 }))
             };
         })
@@ -54,17 +55,18 @@ export function expandLayoutForCells(baseLayout, data, grouping, stylingConfig,
  * @param baseKPIs - Array of base KPIs from layout
  * @param cells - Array of [cellName, record] tuples
  * @param grouping - Current tree grouping configuration (determines label format)
+ * @param colorDimension - Which field to use for coloring (site or band)
  * @param stylingConfig - Optional cell styling configuration
  * @param stackGroupMode - Stackgroup strategy for this set of KPIs
  * @returns Expanded array of KPIs (styled or default, with stackgroups assigned)
  */
-function expandKPIs(baseKPIs, cells, grouping, stylingConfig, stackGroupMode = 'none') {
+function expandKPIs(baseKPIs, cells, grouping, colorDimension, stylingConfig, stackGroupMode = 'none') {
     let expandedKPIs = [];
     baseKPIs.forEach((baseKPI) => {
         cells.forEach(([cellName, record]) => {
             if (stylingConfig) {
                 // Apply custom styling (band colors, sector line styles)
-                const styledKPI = createStyledKPI(baseKPI.rawName, record, baseKPI.unit, grouping, stylingConfig);
+                const styledKPI = createStyledKPI(baseKPI.rawName, record, baseKPI.unit, grouping, colorDimension, stylingConfig);
                 expandedKPIs.push({
                     ...styledKPI,
                     stackGroup: undefined // Initialize for treeshake-safe property assignment

package/dist/apps/site-check/index.d.ts

@@ -3,7 +3,7 @@
  * Public API exports for cell traffic KPI visualization
  */
 export { default as SiteCheck } from './SiteCheck.svelte';
-export { loadCellTrafficData, getUniqueSites, getUniqueCells, groupDataByCell, defaultTreeGrouping, type CellTrafficRecord, type TreeGroupingConfig, type TreeGroupField } from './data-loader.js';
+export { loadCellTrafficData, getUniqueSites, getUniqueCells, groupDataByCell, defaultTreeGrouping, type CellTrafficRecord, type TreeGroupingConfig, type TreeGroupField, type ColorDimension } from './data-loader.js';
 export { buildTreeNodes, filterChartData, transformChartData, createStyledKPI, extractBandFromCell, getBandFrequency, sortCellsByBandFrequency, assignStackGroups, createStackGroupId, type StackGroupMode } from './transforms.js';
 export { expandLayoutForCells, extractBaseMetrics } from './helper.js';
 export { defaultCellStyling } from './default-cell-styling.js';

package/dist/apps/site-check/transforms.d.ts

@@ -4,7 +4,7 @@
  */
 import type { TreeNode } from '../../core/TreeView';
 import type { KPI, CellStylingConfig } from '../../core/Charts';
-import type { CellTrafficRecord, TreeGroupingConfig } from './data-loader';
+import type { CellTrafficRecord, TreeGroupingConfig, ColorDimension } from './data-loader';
 /**
  * Stackgroup mode types for dynamic stacking strategies
  */
@@ -75,11 +75,13 @@ export declare function transformChartData(data: CellTrafficRecord[], baseMetric
 /**
  * Create a styled KPI with band colors and sector line styles
  * Label format adapts to tree grouping configuration
+ * Color assignment adapts to colorDimension selection
  * @param metricName - Base metric name (e.g., 'DL_GBYTES')
  * @param cellRecord - Cell traffic record with metadata
  * @param unit - Unit string (e.g., 'GB', '%')
  * @param grouping - Current tree grouping configuration (determines label format)
+ * @param colorDimension - Which field to use for coloring (site or band)
  * @param stylingConfig - Optional styling configuration
  * @returns KPI with cell-specific styling applied
  */
-export declare function createStyledKPI(metricName: string, cellRecord: CellTrafficRecord, unit: string, grouping: TreeGroupingConfig, stylingConfig?: CellStylingConfig): KPI;
+export declare function createStyledKPI(metricName: string, cellRecord: CellTrafficRecord, unit: string, grouping: TreeGroupingConfig, colorDimension: ColorDimension, stylingConfig?: CellStylingConfig): KPI;

package/dist/apps/site-check/transforms.js

@@ -154,7 +154,7 @@ export function sortCellsByBandFrequency(items) {
  * @param data - Cell traffic records
  * @param grouping - Tree grouping configuration (defaults to Site → Azimuth → Cell)
  */
-export function buildTreeNodes(data, grouping = { level0: 'site', level1: 'azimuth', level2: 'cell' }) {
+export function buildTreeNodes(data, grouping = { level0: 'site', level1: 'azimuth' }) {
     log('🔄 Building tree nodes', {
         recordCount: data.length,
         grouping,
@@ -441,20 +441,60 @@ export function transformChartData(data, baseMetrics) {
     });
     return pivotedData;
 }
+/**
+ * Generate a consistent color for a site name using a hash function
+ * Same site will always get the same color
+ * @param siteName - Site name to generate color for
+ * @returns Hex color string
+ */
+function generateSiteColor(siteName) {
+    // Modern color palette for sites
+    const siteColors = [
+        '#3B82F6', // Blue
+        '#EF4444', // Red
+        '#10B981', // Emerald
+        '#F59E0B', // Amber
+        '#8B5CF6', // Violet
+        '#06B6D4', // Cyan
+        '#F97316', // Orange
+        '#84CC16', // Lime
+        '#EC4899', // Pink
+        '#14B8A6', // Teal
+        '#F43F5E', // Rose
+        '#A855F7' // Purple
+    ];
+    // Simple hash function for consistent color assignment
+    let hash = 0;
+    for (let i = 0; i < siteName.length; i++) {
+        hash = siteName.charCodeAt(i) + ((hash << 5) - hash);
+    }
+    hash = Math.abs(hash);
+    return siteColors[hash % siteColors.length];
+}
 /**
  * Create a styled KPI with band colors and sector line styles
  * Label format adapts to tree grouping configuration
+ * Color assignment adapts to colorDimension selection
  * @param metricName - Base metric name (e.g., 'DL_GBYTES')
  * @param cellRecord - Cell traffic record with metadata
  * @param unit - Unit string (e.g., 'GB', '%')
  * @param grouping - Current tree grouping configuration (determines label format)
+ * @param colorDimension - Which field to use for coloring (site or band)
  * @param stylingConfig - Optional styling configuration
  * @returns KPI with cell-specific styling applied
  */
-export function createStyledKPI(metricName, cellRecord, unit, grouping, stylingConfig) {
+export function createStyledKPI(metricName, cellRecord, unit, grouping, colorDimension, stylingConfig) {
     const { band, sector, azimuth, cellName, siteName } = cellRecord;
-    // Get color from band (if config provided)
-    const color = stylingConfig?.bandColors?.[band];
+    // Determine color based on colorDimension
+    let color;
+    if (colorDimension === 'band') {
+        // Get color from band colors config
+        color = stylingConfig?.bandColors?.[band];
+    }
+    else if (colorDimension === 'site') {
+        // Generate consistent color for site
+        color = generateSiteColor(siteName);
+    }
     // Get line style from sector (if config provided)
     const lineStyle = stylingConfig?.sectorLineStyles?.[sector.toString()];
     // Generate label based on tree grouping configuration
@@ -475,6 +515,7 @@ export function createStyledKPI(metricName, cellRecord, unit, grouping, stylingC
         band,
         sector,
         azimuth,
+        colorDimension,
         color,
         lineStyle
     });
@@ -489,7 +530,7 @@ export function createStyledKPI(metricName, cellRecord, unit, grouping, stylingC
  * @returns Formatted label string matching complete tree hierarchy (only non-null levels)
  */
 function generateAdaptiveLabel(record, grouping) {
-    const { level0, level1, level2 } = grouping;
+    const { level0, level1 } = grouping;
     // Helper to format field values exactly as shown in tree
     const formatField = (field, value) => {
         if (field === 'cell') {
@@ -532,10 +573,8 @@ function generateAdaptiveLabel(record, grouping) {
     if (level1 !== null) {
         parts.push(formatField(level1, getFieldValue(level1)));
     }
-    // Level 2 (optional)
-    if (level2 !== null) {
-        parts.push(formatField(level2, getFieldValue(level2)));
-    }
+    // Cell is always the final leaf node
+    parts.push(record.cellName);
     // Join with arrow separator
-    return parts.join('_');
+    return parts.join(' → ');
 }

package/dist/core/Charts/GlobalControls.svelte

@@ -35,14 +35,10 @@
 	function saveSettings(updatedControls: GlobalChartControls) {
 		if (persistSettings && typeof window !== 'undefined') {
 			try {
-				console.log('💾 Saving chart controls to localStorage:', updatedControls);
 				localStorage.setItem(STORAGE_KEY, JSON.stringify(updatedControls));
-				console.log('✅ Saved successfully');
 			} catch (error) {
 				console.warn('Failed to save chart controls to localStorage:', error);
 			}
-		} else {
-			console.log('⚠️ Not saving: persistSettings =', persistSettings);
 		}
 	}
 

package/dist/core/Desktop/Grid/ResizeHandle.svelte

@@ -19,8 +19,6 @@
     startHorizontalSize = horizontalSize;
     startVerticalSize = verticalSize;
 
-    console.log('MouseDown:', { startX, startY, startHorizontalSize, startVerticalSize });
-
     document.addEventListener('mousemove', handleMouseMove);
     document.addEventListener('mouseup', handleMouseUp);
 
@@ -33,14 +31,10 @@
     const deltaX = event.clientX - startX;
     const deltaY = event.clientY - startY;
 
-    console.log('MouseMove:', { deltaX, deltaY });
-
     // Always calculate both dimensions - let the layout decide what to do
     const newHorizontalSize = Math.max(10, Math.min(90, startHorizontalSize + (deltaX / 4)));
     const newVerticalSize = Math.max(10, Math.min(90, startVerticalSize + (deltaY / 4)));
 
-    console.log('Resize:', { newHorizontalSize, newVerticalSize });
-
     dispatch('resize', {
       horizontalSize: newHorizontalSize,
       verticalSize: newVerticalSize
@@ -48,7 +42,6 @@
   }
 
   function handleMouseUp() {
-    console.log('MouseUp - stopping drag');
     isDragging = false;
     document.removeEventListener('mousemove', handleMouseMove);
     document.removeEventListener('mouseup', handleMouseUp);

package/dist/core/Desktop/Grid/resizeStore.js

@@ -31,7 +31,6 @@ function createResizeStore() {
                 topHeight: Math.max(10, Math.min(90, verticalSize)),
                 bottomHeight: 100 - Math.max(10, Math.min(90, verticalSize))
             };
-            console.log('Store update2D:', { horizontalSize, verticalSize, newState });
             return newState;
         })
     };

package/dist/index.d.ts

@@ -1,3 +1,4 @@
 export * from './core/index.js';
 export * from './map-v2/index.js';
+export * as MapV3 from './map-v3/index.js';
 export * from './apps/index.js';

package/dist/index.js

@@ -4,5 +4,7 @@
 export * from './core/index.js';
 // Map components (Mapbox cellular visualization - v2)
 export * from './map-v2/index.js';
+// Map components (Mapbox cellular visualization - v3)
+export * as MapV3 from './map-v3/index.js';
 // Complete applications
 export * from './apps/index.js';

package/dist/map-v2/demo/DemoMap.svelte

@@ -81,7 +81,6 @@
 
 	// Handler for site selection action button
 	function handleAnalyzeSites(siteIds: string[]) {
-		console.log('Analyze sites:', siteIds);
 		// Example: Navigate to SiteCheck page with selected sites
 		// window.location.href = `/site-check?sites=${siteIds.join(',')}`;
 		// Or use SvelteKit navigate, or open modal, etc.
@@ -90,7 +89,6 @@
 	
 	// Handler for generic feature selection action button
 	function handleProcessFeatures(featureIds: string[]) {
-		console.log('Process features:', featureIds);
 		alert(`Selected ${featureIds.length} features:\n${featureIds.join(', ')}`);
 	}
 	

package/dist/map-v2/demo/demo-cells.js

@@ -129,4 +129,3 @@ for (let siteIndex = 0; siteIndex < NUM_SITES; siteIndex++) {
         });
     });
 }
-console.log(`Generated ${demoCells.length} demo cells across ${NUM_SITES} sites (${AZIMUTHS.length} sectors × ${TECH_BANDS.length} tech-bands per site)`);

package/dist/map-v2/features/cells/layers/CellsLayer.svelte

@@ -15,6 +15,7 @@
 	import { useMapbox } from '../../../core/hooks/useMapbox';
 	import { cellsToGeoJSON } from '../utils/cellGeoJSON';
 	import { CELL_FILL_Z_INDEX, CELL_LINE_Z_INDEX, Z_INDEX_BY_BAND } from '../constants/zIndex';
+	import { log } from '../../../../core/logger';
 
 	interface Props {
 		/** Cell store context */
@@ -56,7 +57,7 @@
 		viewportUpdateTimer = setTimeout(() => {
 			if (!map) return;
 			const newZoom = map.getZoom();
-			console.log('CellsLayer: Viewport changed (zoom/pan), updating to zoom:', newZoom);
+			log('CellsLayer: Viewport changed (zoom/pan), updating to zoom:', newZoom);
 			// Update zoom if changed
 			store.setCurrentZoom(newZoom);
 			// Force $effect to re-run by incrementing version (triggers on pan without zoom change)
@@ -71,8 +72,6 @@
 	function initializeLayer() {
 		if (!map) return;
 
-		console.log('CellsLayer: initializeLayer called');
-
 		// Set initial zoom
 		store.setCurrentZoom(map.getZoom());
 
@@ -91,12 +90,9 @@
 	}
 
 	onMount(() => {
-		console.log('CellsLayer: onMount, waiting for map...');
-
 		// Subscribe to map store
 		const unsubscribe = mapStore.subscribe((mapInstance) => {
 			if (mapInstance && !map) {
-				console.log('CellsLayer: Map available, initializing...');
 				map = mapInstance;
 
 				// Initial layer setup
@@ -142,14 +138,12 @@
 		// Track viewportVersion to force re-run on pan (even without zoom change)
 		viewportVersion;
 
-		console.log('CellsLayer $effect triggered:', {
+		log('CellsLayer update:', {
 			mounted,
 			hasMap: !!map,
 			showCells: store.showCells,
 			filteredCellsCount: store.filteredCells.length,
-			currentZoom: store.currentZoom,
-			baseRadius: store.baseRadius,
-			viewportVersion
+			currentZoom: store.currentZoom
 		});
 
 		if (!mounted || !map) {
@@ -180,15 +174,9 @@
 			bounds.contains([cell.longitude, cell.latitude])
 		);
 
-		console.log('CellsLayer: Viewport filtering:', {
+		log('CellsLayer viewport filter:', {
 			totalFiltered: store.filteredCells.length,
-			visibleInViewport: visibleCells.length,
-			bounds: {
-				north: bounds.getNorth(),
-				south: bounds.getSouth(),
-				east: bounds.getEast(),
-				west: bounds.getWest()
-			}
+			visibleInViewport: visibleCells.length
 		});
 
 		// Generate GeoJSON from visible cells only
@@ -200,18 +188,13 @@
 			store.cellGroupMap // Pass lookup map for O(1) color lookup
 		);
 
-		console.log('CellsLayer: Generated GeoJSON:', {
-			featureCount: geoJSON.features.length,
-			firstFeature: geoJSON.features[0]
-		});
+		log('CellsLayer GeoJSON generated:', geoJSON.features.length, 'features');
 
 		// Update or create source
 		const source = map.getSource(SOURCE_ID);
 		if (source && source.type === 'geojson') {
-			console.log('CellsLayer: Updating existing source');
 			source.setData(geoJSON);
 		} else {
-			console.log('CellsLayer: Creating new source');
 			map.addSource(SOURCE_ID, {
 				type: 'geojson',
 				data: geoJSON
@@ -235,7 +218,6 @@
 
 			// Add fill layer if not exists
 			if (!map.getLayer(fillLayerId)) {
-				console.log(`CellsLayer: Creating fill layer for z-index ${zIndex}`);
 				map.addLayer({
 					id: fillLayerId,
 					type: 'fill',
@@ -261,7 +243,6 @@
 
 			// Add line layer if not exists
 			if (!map.getLayer(lineLayerId)) {
-				console.log(`CellsLayer: Creating line layer for z-index ${zIndex}`);
 				map.addLayer({
 					id: lineLayerId,
 					type: 'line',

package/dist/map-v2/features/cells/utils/cellTree.js

@@ -211,30 +211,16 @@ function buildNestedTree(cells, level1, level2, colorMap, labelMap) {
  * @returns Filtered array of cells
  */
 export function getFilteredCells(checkedPaths, allCells) {
-    console.log('=== getFilteredCells START ===');
-    console.log('Checked paths:', Array.from(checkedPaths));
-    console.log('Total cells:', allCells.length);
     // If root is checked (or no specific filters), return all cells
     if (checkedPaths.has('root') && checkedPaths.size === 1) {
-        console.log('Root only checked, returning all cells');
         return allCells;
     }
-    // Sample first 3 cells for detailed logging
-    const sampleSize = 3;
-    let processedCount = 0;
     // Filter cells that match any of the checked paths
     const filtered = allCells.filter((cell) => {
-        const shouldLog = processedCount < sampleSize;
-        if (shouldLog) {
-            console.log(`\n--- Sample Cell ${processedCount + 1}: ${cell.id} ---`);
-            console.log(`  Properties: tech="${cell.tech}", frq="${cell.frq}", status="${cell.status}"`);
-        }
         // Check if this cell belongs to any checked path
         const matched = Array.from(checkedPaths).some((path) => {
             // Match cell properties against path segments
             if (path === 'root') {
-                if (shouldLog)
-                    console.log(`  Path "root": MATCH`);
                 return true;
             }
             // Parse path and filter out "root" prefix and deduplicate consecutive segments
@@ -248,9 +234,6 @@ export function getFilteredCells(checkedPaths, allCells) {
                     prevSegment = segment;
                 }
             }
-            if (shouldLog) {
-                console.log(`  Checking path "${path}" (raw: [${allSegments.join(', ')}], filtered: [${segments.join(', ')}])`);
-            }
             // Match filtered segments against cell properties
             const segmentMatches = segments.every((segment) => {
                 const matches = (cell.tech === segment ||
@@ -260,23 +243,11 @@ export function getFilteredCells(checkedPaths, allCells) {
                     cell.customSubgroup === segment ||
                     cell.type === segment ||
                     cell.planner === segment);
-                if (shouldLog) {
-                    console.log(`    Segment "${segment}": ${matches ? '✓ MATCH' : '✗ NO MATCH'}`);
-                }
                 return matches;
             });
-            if (shouldLog) {
-                console.log(`  Path "${path}": ${segmentMatches ? '✓ MATCHED' : '✗ NOT MATCHED'}`);
-            }
             return segmentMatches;
         });
-        if (shouldLog) {
-            console.log(`  Final result: ${matched ? '✓ INCLUDE' : '✗ EXCLUDE'}`);
-        }
-        processedCount++;
         return matched;
     });
-    console.log(`\nFiltered result: ${filtered.length} of ${allCells.length} cells`);
-    console.log('=== getFilteredCells END ===\n');
     return filtered;
 }

package/dist/map-v2/features/repeaters/layers/RepeaterLabelsLayer.svelte

@@ -16,6 +16,7 @@
 	import type { RepeaterStoreContext } from '../stores/repeaterStoreContext.svelte';
 	import type { Repeater } from '../types';
 	import * as turf from '@turf/turf';
+	import { log } from '../../../../core/logger';
 	
 	interface Props {
 		/** Repeater store context */
@@ -66,18 +67,7 @@
 	function buildLabelFeatures(): GeoJSON.FeatureCollection {
 		const features: GeoJSON.Feature[] = [];
 		
-		console.log('RepeaterLabelsLayer: Building label features', {
-			showLabels: store.showLabels,
-			filteredRepeatersCount: store.filteredRepeaters.length,
-			hasMap: !!map
-		});
-		
 		if (!store.showLabels || store.filteredRepeaters.length === 0 || !map) {
-			console.log('RepeaterLabelsLayer: Skipping labels -', {
-				showLabels: store.showLabels,
-				hasRepeaters: store.filteredRepeaters.length > 0,
-				hasMap: !!map
-			});
 			return { type: 'FeatureCollection', features: [] };
 		}
 		
@@ -134,11 +124,7 @@
 			});
 		});
 		
-		console.log('RepeaterLabelsLayer: Built features', {
-			totalRepeaters: store.filteredRepeaters.length,
-			visibleInViewport: visibleRepeaters.length,
-			featuresGenerated: features.length
-		});
+		log('RepeaterLabelsLayer features:', features.length, 'of', visibleRepeaters.length, 'visible repeaters');
 		
 		return { type: 'FeatureCollection', features };
 	}
@@ -151,15 +137,7 @@
 		
 		const geojson = buildLabelFeatures();
 		
-		console.log('RepeaterLabelsLayer: Updating labels', {
-			sourceExists: !!map.getSource(sourceId),
-			layerExists: !!map.getLayer(layerId),
-			featureCount: geojson.features.length,
-			currentZoom: map.getZoom(),
-			minLabelZoom: store.minLabelZoom,
-			labelSize: store.labelSize,
-			labelColor: store.labelColor
-		});
+		log('RepeaterLabelsLayer: Updating', geojson.features.length, 'labels');
 		
 		const source = map.getSource(sourceId) as mapboxgl.GeoJSONSource;
 		source.setData(geojson);
@@ -171,8 +149,6 @@
 			map.setPaintProperty(layerId, 'text-halo-color', store.labelHaloColor);
 			map.setPaintProperty(layerId, 'text-halo-width', store.labelHaloWidth);
 			map.setLayerZoomRange(layerId, store.minLabelZoom, 24);
-			
-			console.log('RepeaterLabelsLayer: Updated layer properties');
 		}
 	}
 	

package/dist/map-v2/features/repeaters/layers/RepeatersLayer.svelte

@@ -18,6 +18,7 @@
 	import { repeatersToGeoJSON } from '../utils/repeaterGeoJSON';
 	import { REPEATER_FILL_Z_INDEX, REPEATER_LINE_Z_INDEX } from '../constants/zIndex';
 	import { Z_INDEX_BY_BAND } from '../constants/techBandZOrder';
+	import { log } from '../../../../core/logger';
 
 	interface Props {
 		/** Repeater store context */
@@ -59,7 +60,7 @@
 		viewportUpdateTimer = setTimeout(() => {
 			if (!map) return;
 			const newZoom = map.getZoom();
-			console.log('RepeatersLayer: Viewport changed, updating to zoom:', newZoom);
+			log('RepeatersLayer: Viewport changed, updating to zoom:', newZoom);
 			// Update zoom
 			store.setCurrentZoom(newZoom);
 			// Force $effect to re-run
@@ -74,8 +75,6 @@
 	function initializeLayer() {
 		if (!map) return;
 
-		console.log('RepeatersLayer: initializeLayer called');
-
 		// Set initial zoom
 		store.setCurrentZoom(map.getZoom());
 
@@ -91,12 +90,9 @@
 	}
 
 	onMount(() => {
-		console.log('RepeatersLayer: onMount, waiting for map...');
-
 		// Subscribe to map store
 		const unsubscribe = mapStore.subscribe((mapInstance) => {
 			if (mapInstance && !map) {
-				console.log('RepeatersLayer: Map available, initializing...');
 				map = mapInstance;
 
 				// Initial layer setup
@@ -137,19 +133,16 @@
 		}
 	});
 	
-	// Reactive: Update GeoJSON when repeaters/zoom/settings change
+	// Reactive: Update GeoJSON when repeaters/zoom/filters/settings change
 	$effect(() => {
-		// Track viewportVersion to force re-run on pan
+		// Track viewportVersion to force re-run on viewport changes
 		viewportVersion;
 
-		console.log('RepeatersLayer $effect triggered:', {
+		log('RepeatersLayer update:', {
 			mounted,
 			hasMap: !!map,
 			showRepeaters: store.showRepeaters,
-			filteredRepeatersCount: store.filteredRepeaters.length,
-			currentZoom: store.currentZoom,
-			baseRadius: store.baseRadius,
-			viewportVersion
+			filteredCount: store.filteredRepeaters.length
 		});
 
 		if (!mounted || !map) {
@@ -180,10 +173,7 @@
 			bounds.contains([repeater.longitude, repeater.latitude])
 		);
 
-		console.log('RepeatersLayer: Viewport filtering:', {
-			totalFiltered: store.filteredRepeaters.length,
-			visibleInViewport: visibleRepeaters.length
-		});
+		log('RepeatersLayer viewport filter:', visibleRepeaters.length, 'of', store.filteredRepeaters.length);
 
 		// Generate GeoJSON from visible repeaters only
 		const geoJSON = repeatersToGeoJSON(
@@ -193,18 +183,13 @@
 			store.techBandColorMap
 		);
 
-		console.log('RepeatersLayer: Generated GeoJSON:', {
-			featureCount: geoJSON.features.length,
-			firstFeature: geoJSON.features[0]
-		});
+		log('RepeatersLayer GeoJSON:', geoJSON.features.length, 'features');
 
 		// Update or create source
 		const source = map.getSource(SOURCE_ID);
 		if (source && source.type === 'geojson') {
-			console.log('RepeatersLayer: Updating existing source');
 			source.setData(geoJSON);
 		} else {
-			console.log('RepeatersLayer: Creating new source');
 			map.addSource(SOURCE_ID, {
 				type: 'geojson',
 				data: geoJSON
@@ -228,7 +213,6 @@
 
 			// Add fill layer if not exists
 			if (!map.getLayer(fillLayerId)) {
-				console.log(`RepeatersLayer: Creating fill layer for z-index ${zIndex}`);
 				map.addLayer({
 					id: fillLayerId,
 					type: 'fill',
@@ -249,7 +233,6 @@
 
 			// Add line layer if not exists
 			if (!map.getLayer(lineLayerId)) {
-				console.log(`RepeatersLayer: Creating line layer for z-index ${zIndex}`);
 				map.addLayer({
 					id: lineLayerId,
 					type: 'line',

package/dist/map-v2/features/repeaters/utils/repeaterTree.js

@@ -75,10 +75,8 @@ export function buildRepeaterTree(repeaters, colorMap) {
  */
 export function getFilteredRepeaters(checkedPaths) {
     const selected = new Set();
-    console.log('getFilteredRepeaters - checkedPaths:', Array.from(checkedPaths));
     // If only root is checked, all tech:fbands are visible
     if (checkedPaths.has('root') && checkedPaths.size === 1) {
-        console.log('Only root checked - returning empty set for "all visible"');
         return selected;
     }
     // Check each path - leaf nodes have tech:fband in their ID
@@ -86,14 +84,12 @@ export function getFilteredRepeaters(checkedPaths) {
         // Paths are like "root:2G:2G:GSM900" where the node ID is the last segment
         // The node ID for leaf nodes is "tech:fband" format
         const parts = path.split(':');
-        console.log('Processing path:', path, 'parts:', parts);
         // Check if this is a leaf node (contains tech:fband format)
         // Leaf node IDs are like "2G:GSM900", "4G:LTE1800"
         // The path would be "root:2G:2G:GSM900" (root -> tech -> tech:fband)
         if (parts.length === 4 && parts[0] === 'root') {
             // This is a leaf node: root:tech:tech:fband
             const techBandKey = `${parts[2]}:${parts[3]}`;
-            console.log('Adding tech:fband key:', techBandKey);
             selected.add(techBandKey);
         }
         else if (parts.length === 3 && parts[0] === 'root') {
@@ -101,11 +97,9 @@ export function getFilteredRepeaters(checkedPaths) {
             const nodeId = parts[2];
             if (nodeId && nodeId.includes(':')) {
                 // This is already in tech:fband format
-                console.log('Adding tech:fband key (alternative format):', nodeId);
                 selected.add(nodeId);
             }
         }
     }
-    console.log('getFilteredRepeaters - selected tech:bands:', Array.from(selected));
     return selected;
 }