@smartnet360/svelte-components 0.0.102 → 0.0.104

package/dist/map-v3/features/coverage/stores/coverage.data.svelte.js

@@ -0,0 +1,95 @@
+/**
+ * Coverage Data Store
+ *
+ * Self-contained store for coverage calculation data and state.
+ * Zero dependencies on cells/sites features - fully encapsulated.
+ */
+import { CoverageCalculator } from '../../../../core/CoverageMap';
+export class CoverageDataStore {
+    // State
+    result = $state(null);
+    calculating = $state(false);
+    progress = $state(0);
+    progressStage = $state('');
+    error = $state(null);
+    // Calculator instance (reusable)
+    calculator;
+    constructor() {
+        this.calculator = new CoverageCalculator();
+    }
+    /**
+     * Calculate coverage prediction
+     * @param config - Complete RF configuration
+     */
+    async calculateCoverage(config) {
+        this.calculating = true;
+        this.progress = 0;
+        this.progressStage = 'Initializing';
+        this.error = null;
+        this.result = null;
+        try {
+            // Progress callback to update UI
+            const progressCallback = (update) => {
+                const cellsProcessed = update.cellsProcessed ?? 0;
+                const totalCells = update.totalCells ?? 1;
+                this.progress = Math.round((cellsProcessed / totalCells) * 100);
+                this.progressStage = update.stage;
+                console.log(`[CoverageDataStore] ${update.stage}: ${this.progress}%`);
+            };
+            // Calculate
+            console.log('[CoverageDataStore] Starting calculation with config:', config);
+            this.result = await this.calculator.calculate(config, progressCallback);
+            console.log('[CoverageDataStore] Calculation complete:', this.result);
+            this.progress = 100;
+            this.progressStage = 'Complete';
+        }
+        catch (err) {
+            console.error('[CoverageDataStore] Calculation failed:', err);
+            this.error = err instanceof Error ? err.message : 'Unknown calculation error';
+            this.result = null;
+        }
+        finally {
+            this.calculating = false;
+        }
+    }
+    /**
+     * Clear current coverage data
+     */
+    clearCoverage() {
+        this.result = null;
+        this.progress = 0;
+        this.progressStage = '';
+        this.error = null;
+    }
+    /**
+     * Get grid cells for rendering
+     * Returns null if no result available
+     */
+    get gridCells() {
+        return this.result?.grid.cells ?? null;
+    }
+    /**
+     * Get coverage statistics
+     */
+    get stats() {
+        return this.result?.grid.stats ?? null;
+    }
+    /**
+     * Get coverage configuration used
+     */
+    get config() {
+        return this.result?.config ?? null;
+    }
+    /**
+     * Check if results are available
+     */
+    get hasResults() {
+        return this.result !== null && this.result.grid.cells.length > 0;
+    }
+}
+/**
+ * Factory function to create coverage data store
+ */
+export function createCoverageDataStore() {
+    return new CoverageDataStore();
+}

package/dist/map-v3/features/coverage/stores/coverage.display.svelte.d.ts

@@ -0,0 +1,33 @@
+/**
+ * Coverage Display Store
+ *
+ * Controls visualization settings for coverage layer.
+ * Follows Map V3 pattern with localStorage persistence.
+ */
+import type { CoverageColorScheme } from '../types';
+export declare class CoverageDisplayStore {
+    key: string;
+    visible: boolean;
+    opacity: number;
+    colorScheme: CoverageColorScheme;
+    showLegend: boolean;
+    showLabels: boolean;
+    minSignalThreshold: number;
+    maxSignalThreshold: number;
+    zIndex: number;
+    constructor();
+    private loadFromStorage;
+    private saveToStorage;
+    /**
+     * Reset to defaults
+     */
+    reset(): void;
+    /**
+     * Toggle visibility
+     */
+    toggle(): void;
+}
+/**
+ * Factory function to create coverage display store
+ */
+export declare function createCoverageDisplayStore(): CoverageDisplayStore;

package/dist/map-v3/features/coverage/stores/coverage.display.svelte.js

@@ -0,0 +1,90 @@
+/**
+ * Coverage Display Store
+ *
+ * Controls visualization settings for coverage layer.
+ * Follows Map V3 pattern with localStorage persistence.
+ */
+import { browser } from '$app/environment';
+export class CoverageDisplayStore {
+    key = 'map-v3-coverage-display';
+    // Visibility
+    visible = $state(true);
+    // Visual styling
+    opacity = $state(0.6);
+    colorScheme = $state('heatmap');
+    showLegend = $state(true);
+    showLabels = $state(false);
+    // Signal filtering (dBm)
+    minSignalThreshold = $state(-115); // Don't render below this
+    maxSignalThreshold = $state(-40); // Cap display at this
+    // Layer order
+    zIndex = $state(100); // Below cells/sites typically
+    constructor() {
+        if (browser) {
+            this.loadFromStorage();
+            // Auto-save on changes
+            $effect(() => {
+                this.saveToStorage();
+            });
+        }
+    }
+    loadFromStorage() {
+        const saved = localStorage.getItem(this.key);
+        if (saved) {
+            try {
+                const parsed = JSON.parse(saved);
+                this.visible = parsed.visible ?? true;
+                this.opacity = parsed.opacity ?? 0.6;
+                this.colorScheme = parsed.colorScheme ?? 'heatmap';
+                this.showLegend = parsed.showLegend ?? true;
+                this.showLabels = parsed.showLabels ?? false;
+                this.minSignalThreshold = parsed.minSignalThreshold ?? -115;
+                this.maxSignalThreshold = parsed.maxSignalThreshold ?? -40;
+                this.zIndex = parsed.zIndex ?? 100;
+            }
+            catch (e) {
+                console.error('[CoverageDisplayStore] Failed to load settings', e);
+            }
+        }
+    }
+    saveToStorage() {
+        if (!browser)
+            return;
+        const data = {
+            visible: this.visible,
+            opacity: this.opacity,
+            colorScheme: this.colorScheme,
+            showLegend: this.showLegend,
+            showLabels: this.showLabels,
+            minSignalThreshold: this.minSignalThreshold,
+            maxSignalThreshold: this.maxSignalThreshold,
+            zIndex: this.zIndex
+        };
+        localStorage.setItem(this.key, JSON.stringify(data));
+    }
+    /**
+     * Reset to defaults
+     */
+    reset() {
+        this.visible = true;
+        this.opacity = 0.6;
+        this.colorScheme = 'heatmap';
+        this.showLegend = true;
+        this.showLabels = false;
+        this.minSignalThreshold = -115;
+        this.maxSignalThreshold = -40;
+        this.zIndex = 100;
+    }
+    /**
+     * Toggle visibility
+     */
+    toggle() {
+        this.visible = !this.visible;
+    }
+}
+/**
+ * Factory function to create coverage display store
+ */
+export function createCoverageDisplayStore() {
+    return new CoverageDisplayStore();
+}

package/dist/map-v3/features/coverage/types.d.ts

@@ -0,0 +1,52 @@
+/**
+ * Coverage Feature - Type Definitions
+ *
+ * Fully encapsulated coverage prediction and visualization types.
+ * Zero dependencies on cells/sites features - works standalone.
+ */
+export type { CoverageResult, GridCell, CoverageGrid, CoverageStats, SignalQuality, SiteConfiguration, SectorConfig, PathLossModel, ProgressCallback, CoverageConfig, RFParameters, GridSettings, SignalThresholds, AntennaPattern } from '../../../core/CoverageMap';
+/**
+ * Color scheme options for coverage visualization
+ */
+export type CoverageColorScheme = 'heatmap' | 'quality' | 'viridis' | 'plasma' | 'categorical';
+/**
+ * Signal strength range for filtering/coloring
+ */
+export interface SignalRange {
+    min: number;
+    max: number;
+    label: string;
+    color: string;
+}
+/**
+ * Coverage layer display configuration
+ */
+export interface CoverageDisplayConfig {
+    visible: boolean;
+    opacity: number;
+    colorScheme: CoverageColorScheme;
+    showLegend: boolean;
+    showLabels: boolean;
+    minSignalThreshold: number;
+    maxSignalThreshold: number;
+}
+/**
+ * GeoJSON feature properties for grid cells
+ */
+export interface CoverageFeatureProperties {
+    signal: number;
+    quality: string;
+    color: string;
+    lat: number;
+    lon: number;
+    distance: number;
+}
+/**
+ * Optional helper to convert Cell to RFConfiguration
+ * Only needed if integrating with cells feature
+ */
+export interface CellToRFConfigOptions {
+    defaultTxPower?: number;
+    defaultFrequency?: number;
+    defaultHeight?: number;
+}

package/dist/map-v3/features/coverage/types.js

@@ -0,0 +1,7 @@
+/**
+ * Coverage Feature - Type Definitions
+ *
+ * Fully encapsulated coverage prediction and visualization types.
+ * Zero dependencies on cells/sites features - works standalone.
+ */
+export {};

package/dist/map-v3/features/repeaters/components/RepeaterFilterControl.svelte

@@ -1,8 +1,7 @@
 <script lang="ts">
 	import { onDestroy, untrack } from 'svelte';
 	import { MapControl } from '../../../shared';
-	import { createTreeStore } from '../../../../core/TreeView/tree.store';
-	import TreeView from '../../../../core/TreeView/TreeView.svelte';
+	import { createTreeStore, TreeView } from '../../../../core/TreeView';
 	import type { RepeaterDataStore } from '../stores/repeater.data.svelte';
 	import type { RepeaterRegistry } from '../stores/repeater.registry.svelte';
 	import type { RepeaterDisplayStore } from '../stores/repeater.display.svelte';
@@ -38,25 +37,20 @@
 	});
 
 	$effect(() => {
-		const unsubscribe = treeStore.subscribe((val) => {
-			let changes = 0;
-			val.state.nodes.forEach((nodeState) => {
-				if (nodeState.node.children && nodeState.node.children.length > 0) return;
+		const val = treeStore;
+		let changes = 0;
+		val.state.nodes.forEach((nodeState) => {
+			if (nodeState.node.children && nodeState.node.children.length > 0) return;
 
-				const groupId = nodeState.node.id;
-				const isVisible = val.state.checkedPaths.has(nodeState.path);
-				
-				const currentStyle = registry.getStyle(groupId, '#000');
-				if (currentStyle.visible !== isVisible) {
-					registry.toggleVisibility(groupId);
-					changes++;
-				}
-			});
+			const groupId = nodeState.node.id;
+			const isVisible = val.state.checkedPaths.has(nodeState.path);
+			
+			const currentStyle = registry.getStyle(groupId, '#000');
+			if (currentStyle.visible !== isVisible) {
+				registry.toggleVisibility(groupId);
+				changes++;
+			}
 		});
-
-		return () => {
-			unsubscribe();
-		};
 	});
 
 	function handleColorChange(groupId: string, event: Event) {
@@ -124,7 +118,7 @@
 
 		<div class="card-body p-0 overflow-auto" style="max-height: 400px;">
 			<div class="p-2">
-				<TreeView showControls={false} store={$treeStore}>
+				<TreeView showControls={false} store={treeStore}>
 					{#snippet children({ node })}
 						<div class="d-flex align-items-center justify-content-between w-100">
 

package/dist/map-v3/features/sites/components/SiteFilterControl.svelte

@@ -1,8 +1,7 @@
 <script lang="ts">
 	import { untrack } from 'svelte';
 	import { MapControl } from '../../../shared';
-	import { createTreeStore } from '../../../../core/TreeView/tree.store';
-	import TreeView from '../../../../core/TreeView/TreeView.svelte';
+	import { createTreeStore, TreeView } from '../../../../core/TreeView';
 	import type { SiteDataStore } from '../stores/site.data.svelte';
 	import type { SiteRegistry } from '../stores/site.registry.svelte';
 	import type { SiteDisplayStore } from '../stores/site.display.svelte';
@@ -34,40 +33,31 @@
 
 	// Sync Tree Selection -> Site Registry Visibility
 	$effect(() => {
-		const unsubscribe = treeStore.subscribe((val) => {
-			// Iterate all leaf nodes to sync visibility
-			
-			// Collect all site IDs from the tree
-			const allSiteIds: string[] = [];
-			const visibleSiteIds: string[] = [];
-
-			val.state.nodes.forEach((nodeState) => {
-				// Check if it's a leaf node (Level 2 group)
-				if (nodeState.node.children && nodeState.node.children.length > 0) return; 
-				
-				// It's a leaf (Level 2 group)
-				const siteIds = nodeState.node.metadata?.siteIds || [];
-				allSiteIds.push(...siteIds);
+		const val = treeStore;
+		// Iterate all leaf nodes to sync visibility
+		
+		// Collect all site IDs from the tree
+		const allSiteIds: string[] = [];
+		const visibleSiteIds: string[] = [];
 
-				if (val.state.checkedPaths.has(nodeState.path)) {
-					visibleSiteIds.push(...siteIds);
-				}
-			});
-
-			// Update registry
-			const hiddenIds = allSiteIds.filter(id => !visibleSiteIds.includes(id));
+		val.state.nodes.forEach((nodeState) => {
+			// Check if it's a leaf node (Level 2 group)
+			if (nodeState.node.children && nodeState.node.children.length > 0) return; 
 			
-			// Optimization: Check if anything actually changed
-			let needsUpdate = false;
-			// Simple check: if counts match, assume mostly correct, but better to check content
-			// For now, just update. Registry handles diffing somewhat.
-			registry.setVisible(visibleSiteIds, true);
-			registry.setVisible(hiddenIds, false);
+			// It's a leaf (Level 2 group)
+			const siteIds = nodeState.node.metadata?.siteIds || [];
+			allSiteIds.push(...siteIds);
+
+			if (val.state.checkedPaths.has(nodeState.path)) {
+				visibleSiteIds.push(...siteIds);
+			}
 		});
 
-		return () => {
-			unsubscribe();
-		};
+		// Update registry
+		const hiddenIds = allSiteIds.filter(id => !visibleSiteIds.includes(id));
+		
+		registry.setVisible(visibleSiteIds, true);
+		registry.setVisible(hiddenIds, false);
 	});
 
 	function handleColorChange(node: any, event: Event) {
@@ -106,7 +96,7 @@
 			{dataStore.sites.length} Sites
 		</div> -->
 		<div class="border rounded bg-white" style="max-height: 400px; overflow-y: auto;">
-			<TreeView showControls={false} store={$treeStore}>
+			<TreeView showControls={false} store={treeStore}>
 				{#snippet children({ node, state })}
 					<!-- Color Picker (Only for leaves / Level 2) -->
 					{#if !node.children || node.children.length === 0}

package/dist/map-v3/index.d.ts

@@ -25,6 +25,10 @@ export * from './features/sites/stores/site.data.svelte';
 export * from './features/sites/stores/site.display.svelte';
 export * from './features/sites/stores/site.registry.svelte';
 export * from './features/selection';
+export * from './features/coverage/types';
+export { default as CoverageLayer } from './features/coverage/layers/CoverageLayer.svelte';
+export * from './features/coverage/stores/coverage.data.svelte';
+export * from './features/coverage/stores/coverage.display.svelte';
 export { default as DemoMap } from './demo/DemoMap.svelte';
 export { demoCells } from './demo/demo-cells';
 export { demoRepeaters } from './demo/demo-repeaters';

package/dist/map-v3/index.js

@@ -31,6 +31,11 @@ export * from './features/sites/stores/site.display.svelte';
 export * from './features/sites/stores/site.registry.svelte';
 // Features - Selection
 export * from './features/selection';
+// Features - Coverage
+export * from './features/coverage/types';
+export { default as CoverageLayer } from './features/coverage/layers/CoverageLayer.svelte';
+export * from './features/coverage/stores/coverage.data.svelte';
+export * from './features/coverage/stores/coverage.display.svelte';
 // Demo
 export { default as DemoMap } from './demo/DemoMap.svelte';
 export { demoCells } from './demo/demo-cells';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@smartnet360/svelte-components",
-	"version": "0.0.102",
+	"version": "0.0.104",
 	"scripts": {
 		"dev": "vite dev",
 		"build": "vite build && npm run prepack",
@@ -32,14 +32,15 @@
 		}
 	},
 	"peerDependencies": {
+		"@deck.gl/mapbox": "^9.2.2",
 		"@turf/turf": "^7.2.0",
 		"bootstrap": "^5.2.3",
 		"deck.gl": "^9.1.0",
-		"@deck.gl/mapbox": "^9.2.2",
 		"dexie": "^4.0.11",
 		"mapbox-gl": "^3.0.0",
 		"plotly.js-dist-min": "^3.1.0",
-		"svelte": "^5.0.0"
+		"svelte": "^5.0.0",
+		"tabulator-tables": "^6.3.1"
 	},
 	"devDependencies": {
 		"@eslint/compat": "^1.2.5",

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

@@ -1,56 +0,0 @@
-/**
- * Data Transforms for Site Check Component
- * Converts raw CSV data to TreeView nodes and Chart configurations
- */
-import type { TreeNode } from '../../core/TreeView';
-import type { KPI, CellStylingConfig } from '../../core/Charts';
-import type { CellTrafficRecord } from './data-loader';
-/**
- * Extract band from cell name using regex pattern matching
- * @param cellName - Cell name like "LTE700_1", "NR3500_2", etc.
- * @returns Band string like "LTE700", "NR3500" or null if not found
- * @deprecated Use the band field from CellTrafficRecord instead
- */
-export declare function extractBandFromCell(cellName: string): string | null;
-/**
- * Get frequency order for a band (for sorting)
- * @param band - Band string like "LTE700", "NR3500"
- * @returns Frequency number or high value for unknown bands
- */
-export declare function getBandFrequency(band: string | null): number;
-/**
- * Sort items by band frequency using actual band data from records
- * @param items - Array of [cellName, record] tuples
- * @returns Sorted array (ascending frequency order)
- */
-export declare function sortCellsByBandFrequency(items: [string, CellTrafficRecord][]): [string, CellTrafficRecord][];
-/**
- * Build hierarchical tree structure: Site → Sector (Azimuth) → Cell (Band)
- */
-export declare function buildTreeNodes(data: CellTrafficRecord[]): TreeNode[];
-/**
- * Filter chart data based on selected tree paths
- * Only include cells that are checked in the tree
- */
-export declare function filterChartData(data: CellTrafficRecord[], checkedPaths: Set<string>): CellTrafficRecord[];
-/**
- * Transform data for chart component consumption
- * Pivots data so each cell becomes its own KPI column
- * Transforms from long format (many rows per cell) to wide format (one column per cell)
- *
- * @param data - Filtered cell traffic records
- * @param baseMetrics - Array of metric names to pivot (e.g., ['dlGBytes', 'ulGBytes'])
- */
-export declare function transformChartData(data: CellTrafficRecord[], baseMetrics: string[]): any[];
-/**
- * Apply cell styling based on band and sector
- * Modifies KPI objects to include color (from band) and lineStyle (from sector)
- * Updates KPI name to format: Band_Azimuth°
- *
- * @param metricName - Base metric name (e.g., 'dlGBytes')
- * @param cellRecord - Cell traffic record with band, sector, azimuth metadata
- * @param unit - Unit string for the metric
- * @param stylingConfig - Optional cell styling configuration (band colors, sector line styles)
- * @returns Styled KPI object
- */
-export declare function createStyledKPI(metricName: string, cellRecord: CellTrafficRecord, unit: string, stylingConfig?: CellStylingConfig): KPI;