@smartnet360/svelte-components 0.0.51 → 0.0.53

package/dist/map/layers/SitesLayer.svelte.d.ts

@@ -0,0 +1,19 @@
+interface Props {
+    /** Namespace for layer IDs (default: 'cellular') */
+    namespace?: string;
+    /** Enable click to select sites (default: true) */
+    clickable?: boolean;
+    /** Show popup on click (default: true) */
+    showPopup?: boolean;
+    /** Site circle radius (default: 8) */
+    circleRadius?: number;
+    /** Site circle color (default: '#3b82f6') */
+    circleColor?: string;
+    /** Selected site color (default: '#ef4444') */
+    selectedColor?: string;
+    /** Hovered site color (default: '#8b5cf6') */
+    hoverColor?: string;
+}
+declare const SitesLayer: import("svelte").Component<Props, {}, "">;
+type SitesLayer = ReturnType<typeof SitesLayer>;
+export default SitesLayer;

package/dist/map/providers/CellDataProvider.svelte

@@ -0,0 +1,43 @@
+<script lang="ts">
+	/**
+	 * CellDataProvider - Provides cellular data (sites, cells) and interaction state to child components
+	 *
+	 * Usage:
+	 * <CellDataProvider {sites} {cells}>
+	 *   <SitesLayer />
+	 *   <CellsLayer />
+	 * </CellDataProvider>
+	 */
+	import { setContext } from 'svelte';
+	import type { Site, Cell } from '../types';
+	import { CELL_DATA_CONTEXT_KEY } from '../types';
+	import { createCellDataStores } from '../stores/cellDataStore';
+
+	interface Props {
+		/** Array of cellular sites */
+		sites?: Site[];
+		/** Array of cellular cells/sectors */
+		cells?: Cell[];
+		/** Optional child content */
+		children?: import('svelte').Snippet;
+	}
+
+	let { sites = [], cells = [], children }: Props = $props();
+
+	// Create and set the cell data context in context
+	const cellDataContext = createCellDataStores(sites, cells);
+	setContext(CELL_DATA_CONTEXT_KEY, cellDataContext);
+
+	// Update stores when props change
+	$effect(() => {
+		cellDataContext.sites.set(sites);
+	});
+
+	$effect(() => {
+		cellDataContext.cells.set(cells);
+	});
+</script>
+
+{#if children}
+	{@render children()}
+{/if}

package/dist/map/providers/CellDataProvider.svelte.d.ts

@@ -0,0 +1,12 @@
+import type { Site, Cell } from '../types';
+interface Props {
+    /** Array of cellular sites */
+    sites?: Site[];
+    /** Array of cellular cells/sectors */
+    cells?: Cell[];
+    /** Optional child content */
+    children?: import('svelte').Snippet;
+}
+declare const CellDataProvider: import("svelte").Component<Props, {}, "">;
+type CellDataProvider = ReturnType<typeof CellDataProvider>;
+export default CellDataProvider;

package/dist/map/providers/MapboxProvider.svelte

@@ -0,0 +1,38 @@
+<script lang="ts">
+	/**
+	 * MapboxProvider - Provides Mapbox GL JS map instance to child components via context
+	 *
+	 * Usage:
+	 * <MapboxProvider {mapInstance}>
+	 *   <SitesLayer />
+	 *   <CellsLayer />
+	 * </MapboxProvider>
+	 */
+	import { setContext } from 'svelte';
+	import type mapboxgl from 'mapbox-gl';
+	import { MAP_CONTEXT_KEY } from '../types';
+	import { createMapStore } from '../stores/mapStore';
+
+	interface Props {
+		/** The Mapbox GL JS map instance */
+		mapInstance: mapboxgl.Map;
+		/** Optional child content */
+		children?: import('svelte').Snippet;
+	}
+
+	let { mapInstance, children }: Props = $props();
+
+	// Create and set the map store in context
+	const mapStore = createMapStore();
+	setContext(MAP_CONTEXT_KEY, mapStore);
+
+	// Update the store whenever the map instance changes
+	$effect(() => {
+		console.log('MapboxProvider: Setting map instance', mapInstance);
+		mapStore.set(mapInstance);
+	});
+</script>
+
+{#if children}
+	{@render children()}
+{/if}

package/dist/map/providers/MapboxProvider.svelte.d.ts

@@ -0,0 +1,9 @@
+interface Props {
+    /** The Mapbox GL JS map instance */
+    mapInstance: mapboxgl.Map;
+    /** Optional child content */
+    children?: import('svelte').Snippet;
+}
+declare const MapboxProvider: import("svelte").Component<Props, {}, "">;
+type MapboxProvider = ReturnType<typeof MapboxProvider>;
+export default MapboxProvider;

package/dist/map/providers/providerHelpers.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Provider helper utilities
+ */
+import type { MapStore } from '../types';
+import type { Site, Cell, CellDataContext } from '../types';
+/**
+ * Creates a new map store instance
+ */
+export declare function createMap(): MapStore;
+/**
+ * Creates a new cell data context
+ */
+export declare function createCellContext(sites?: Site[], cells?: Cell[]): CellDataContext;
+/**
+ * Validates that a map instance is ready for use
+ */
+export declare function isMapReady(map: unknown): boolean;

package/dist/map/providers/providerHelpers.js

@@ -0,0 +1,26 @@
+/**
+ * Provider helper utilities
+ */
+import { createMapStore } from '../stores/mapStore';
+import { createCellDataStores } from '../stores/cellDataStore';
+/**
+ * Creates a new map store instance
+ */
+export function createMap() {
+    return createMapStore();
+}
+/**
+ * Creates a new cell data context
+ */
+export function createCellContext(sites = [], cells = []) {
+    return createCellDataStores(sites, cells);
+}
+/**
+ * Validates that a map instance is ready for use
+ */
+export function isMapReady(map) {
+    if (!map)
+        return false;
+    // Check if it has the basic Mapbox GL Map interface
+    return typeof map.getStyle === 'function';
+}

package/dist/map/stores/cellDataStore.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Store factory and utilities for cellular data
+ */
+import type { Writable, Readable } from 'svelte/store';
+import type { Site, Cell, CellDataContext } from '../types';
+/**
+ * Creates a complete cell data context with all required stores
+ */
+export declare function createCellDataStores(initialSites?: Site[], initialCells?: Cell[]): CellDataContext;
+/**
+ * Creates a derived store that filters cells by site ID
+ */
+export declare function createCellsBySiteStore(cells: Writable<Cell[]>, siteId: Writable<string | null>): Readable<Cell[]>;
+/**
+ * Creates a derived store for the currently selected site
+ */
+export declare function createSelectedSiteStore(sites: Writable<Site[]>, selectedSiteId: Writable<string | null>): Readable<Site | null>;
+/**
+ * Creates a derived store for the currently selected cell
+ */
+export declare function createSelectedCellStore(cells: Writable<Cell[]>, selectedCellId: Writable<string | null>): Readable<Cell | null>;

package/dist/map/stores/cellDataStore.js

@@ -0,0 +1,53 @@
+/**
+ * Store factory and utilities for cellular data
+ */
+import { writable, derived } from 'svelte/store';
+/**
+ * Creates a complete cell data context with all required stores
+ */
+export function createCellDataStores(initialSites = [], initialCells = []) {
+    const sites = writable(initialSites);
+    const cells = writable(initialCells);
+    const selectedSiteId = writable(null);
+    const selectedCellId = writable(null);
+    const hoveredSiteId = writable(null);
+    const hoveredCellId = writable(null);
+    return {
+        sites,
+        cells,
+        selectedSiteId,
+        selectedCellId,
+        hoveredSiteId,
+        hoveredCellId
+    };
+}
+/**
+ * Creates a derived store that filters cells by site ID
+ */
+export function createCellsBySiteStore(cells, siteId) {
+    return derived([cells, siteId], ([$cells, $siteId]) => {
+        if (!$siteId)
+            return [];
+        return $cells.filter((cell) => cell.siteId === $siteId);
+    });
+}
+/**
+ * Creates a derived store for the currently selected site
+ */
+export function createSelectedSiteStore(sites, selectedSiteId) {
+    return derived([sites, selectedSiteId], ([$sites, $selectedSiteId]) => {
+        if (!$selectedSiteId)
+            return null;
+        return $sites.find((site) => site.id === $selectedSiteId) ?? null;
+    });
+}
+/**
+ * Creates a derived store for the currently selected cell
+ */
+export function createSelectedCellStore(cells, selectedCellId) {
+    return derived([cells, selectedCellId], ([$cells, $selectedCellId]) => {
+        if (!$selectedCellId)
+            return null;
+        return $cells.find((cell) => cell.id === $selectedCellId) ?? null;
+    });
+}

package/dist/map/stores/interactions.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Interaction state utilities and helpers
+ */
+import type { Writable } from 'svelte/store';
+/**
+ * Helper to clear all selections
+ */
+export declare function clearSelections(selectedSiteId: Writable<string | null>, selectedCellId: Writable<string | null>): void;
+/**
+ * Helper to clear all hover states
+ */
+export declare function clearHovers(hoveredSiteId: Writable<string | null>, hoveredCellId: Writable<string | null>): void;
+/**
+ * Helper to select a site and clear cell selection
+ */
+export declare function selectSite(siteId: string | null, selectedSiteId: Writable<string | null>, selectedCellId: Writable<string | null>): void;
+/**
+ * Helper to select a cell (and optionally its parent site)
+ */
+export declare function selectCell(cellId: string | null, selectedCellId: Writable<string | null>, parentSiteId?: string | null, selectedSiteId?: Writable<string | null>): void;

package/dist/map/stores/interactions.js

@@ -0,0 +1,33 @@
+/**
+ * Interaction state utilities and helpers
+ */
+/**
+ * Helper to clear all selections
+ */
+export function clearSelections(selectedSiteId, selectedCellId) {
+    selectedSiteId.set(null);
+    selectedCellId.set(null);
+}
+/**
+ * Helper to clear all hover states
+ */
+export function clearHovers(hoveredSiteId, hoveredCellId) {
+    hoveredSiteId.set(null);
+    hoveredCellId.set(null);
+}
+/**
+ * Helper to select a site and clear cell selection
+ */
+export function selectSite(siteId, selectedSiteId, selectedCellId) {
+    selectedSiteId.set(siteId);
+    selectedCellId.set(null);
+}
+/**
+ * Helper to select a cell (and optionally its parent site)
+ */
+export function selectCell(cellId, selectedCellId, parentSiteId, selectedSiteId) {
+    selectedCellId.set(cellId);
+    if (selectedSiteId && parentSiteId !== undefined) {
+        selectedSiteId.set(parentSiteId);
+    }
+}

package/dist/map/stores/mapStore.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Store factory and utilities for Mapbox instance
+ */
+import type { MapStore } from '../types';
+/**
+ * Creates a writable store for the Mapbox instance
+ */
+export declare function createMapStore(): MapStore;

package/dist/map/stores/mapStore.js

@@ -0,0 +1,10 @@
+/**
+ * Store factory and utilities for Mapbox instance
+ */
+import { writable } from 'svelte/store';
+/**
+ * Creates a writable store for the Mapbox instance
+ */
+export function createMapStore() {
+    return writable(null);
+}

package/dist/map/types.d.ts

@@ -0,0 +1,115 @@
+/**
+ * Core types for Mapbox cellular visualization components
+ */
+import type { Writable } from 'svelte/store';
+/** Context key for the Mapbox instance store */
+export declare const MAP_CONTEXT_KEY: unique symbol;
+/** Context key for the cell data stores */
+export declare const CELL_DATA_CONTEXT_KEY: unique symbol;
+/**
+ * Represents a cellular site/tower location
+ */
+export interface Site {
+    /** Unique identifier for the site */
+    id: string;
+    /** Human-readable site name */
+    name: string;
+    /** Latitude (WGS84) */
+    latitude: number;
+    /** Longitude (WGS84) */
+    longitude: number;
+    /** Frequency bands */
+    fbands?: string[];
+    /** Technology (e.g., '4G', '5G', 'LTE') */
+    technology: string;
+    /** Additional properties */
+    properties: Record<string, any>;
+    /** Array of cell names at this site */
+    cellNames: string[];
+    /** Source or owning organization (e.g. 'Vodafone', 'France Telecom') */
+    provider: string;
+    /** Sub-classification used for TreeView grouping for level2 grouping */
+    featureGroup: string;
+}
+/**
+ * Represents a cellular sector/cell with coverage area
+ */
+export interface Cell {
+    /** Unique identifier for the cell */
+    id: string;
+    /** ID of the parent site */
+    siteId: string;
+    /** Sector number (e.g., 1, 2, 3) */
+    sector?: number;
+    /** Azimuth/bearing in degrees (0-360, where 0 is North) */
+    azimuth: number;
+    /** Beamwidth/aperture in degrees (e.g., 65, 120) */
+    beamwidth: number;
+    /** Coverage radius in meters (default: 500) */
+    radius?: number;
+    /** Optional additional properties (band, technology, etc.) */
+    properties?: Record<string, unknown>;
+}
+/**
+ * User interaction state (selection, hover)
+ */
+export interface InteractionState {
+    /** Currently selected site ID */
+    selectedSiteId: string | null;
+    /** Currently selected cell ID */
+    selectedCellId: string | null;
+    /** Currently hovered site ID */
+    hoveredSiteId: string | null;
+    /** Currently hovered cell ID */
+    hoveredCellId: string | null;
+}
+/**
+ * Map instance store provided by MapboxProvider
+ */
+export type MapStore = Writable<mapboxgl.Map | null>;
+/**
+ * Cell data context stores provided by CellDataProvider
+ */
+export interface CellDataContext {
+    /** Store containing all sites */
+    sites: Writable<Site[]>;
+    /** Store containing all cells */
+    cells: Writable<Cell[]>;
+    /** Store for selected site ID */
+    selectedSiteId: Writable<string | null>;
+    /** Store for selected cell ID */
+    selectedCellId: Writable<string | null>;
+    /** Store for hovered site ID */
+    hoveredSiteId: Writable<string | null>;
+    /** Store for hovered cell ID */
+    hoveredCellId: Writable<string | null>;
+}
+/**
+ * GeoJSON Point Feature for a site
+ */
+export interface SiteFeature {
+    type: 'Feature';
+    geometry: {
+        type: 'Point';
+        coordinates: [number, number];
+    };
+    properties: Site;
+}
+/**
+ * GeoJSON Polygon Feature for a cell sector
+ */
+export interface CellFeature {
+    type: 'Feature';
+    geometry: {
+        type: 'Polygon';
+        coordinates: number[][][];
+    };
+    properties: Cell;
+}
+/**
+ * GeoJSON FeatureCollection
+ */
+export interface FeatureCollection<T> {
+    type: 'FeatureCollection';
+    features: T[];
+}

package/dist/map/types.js

@@ -0,0 +1,10 @@
+/**
+ * Core types for Mapbox cellular visualization components
+ */
+// ============================================================================
+// Context Keys
+// ============================================================================
+/** Context key for the Mapbox instance store */
+export const MAP_CONTEXT_KEY = Symbol('mapbox-instance');
+/** Context key for the cell data stores */
+export const CELL_DATA_CONTEXT_KEY = Symbol('cell-data');

package/dist/map/utils/geojson.d.ts

@@ -0,0 +1,20 @@
+/**
+ * GeoJSON conversion utilities for sites and cells
+ */
+import type { Site, Cell, SiteFeature, CellFeature, FeatureCollection } from '../types';
+/**
+ * Converts an array of sites to a GeoJSON FeatureCollection
+ */
+export declare function sitesToGeoJSON(sites: Site[]): FeatureCollection<SiteFeature>;
+/**
+ * Converts an array of cells to a GeoJSON FeatureCollection of polygons
+ */
+export declare function cellsToGeoJSON(cells: Cell[], sites: Site[], defaultRadius?: number): FeatureCollection<CellFeature>;
+/**
+ * Converts a single site to a GeoJSON Feature
+ */
+export declare function siteToFeature(site: Site): SiteFeature;
+/**
+ * Converts a single cell to a GeoJSON Feature (requires parent site for location)
+ */
+export declare function cellToFeature(cell: Cell, site: Site, defaultRadius?: number): CellFeature | null;

package/dist/map/utils/geojson.js

@@ -0,0 +1,78 @@
+/**
+ * GeoJSON conversion utilities for sites and cells
+ */
+import { createSectorPolygon } from './math';
+/**
+ * Converts an array of sites to a GeoJSON FeatureCollection
+ */
+export function sitesToGeoJSON(sites) {
+    const features = sites.map((site) => ({
+        type: 'Feature',
+        geometry: {
+            type: 'Point',
+            coordinates: [site.longitude, site.latitude]
+        },
+        properties: site
+    }));
+    return {
+        type: 'FeatureCollection',
+        features
+    };
+}
+/**
+ * Converts an array of cells to a GeoJSON FeatureCollection of polygons
+ */
+export function cellsToGeoJSON(cells, sites, defaultRadius = 500) {
+    // Create a map for fast site lookup
+    const siteMap = new Map(sites.map((site) => [site.id, site]));
+    const features = [];
+    for (const cell of cells) {
+        const site = siteMap.get(cell.siteId);
+        if (!site) {
+            console.warn(`Cell ${cell.id} references unknown site ${cell.siteId}`);
+            continue;
+        }
+        const radius = cell.radius ?? defaultRadius;
+        const coordinates = createSectorPolygon(site.longitude, site.latitude, cell.azimuth, cell.beamwidth, radius);
+        features.push({
+            type: 'Feature',
+            geometry: {
+                type: 'Polygon',
+                coordinates: [coordinates]
+            },
+            properties: cell
+        });
+    }
+    return {
+        type: 'FeatureCollection',
+        features
+    };
+}
+/**
+ * Converts a single site to a GeoJSON Feature
+ */
+export function siteToFeature(site) {
+    return {
+        type: 'Feature',
+        geometry: {
+            type: 'Point',
+            coordinates: [site.longitude, site.latitude]
+        },
+        properties: site
+    };
+}
+/**
+ * Converts a single cell to a GeoJSON Feature (requires parent site for location)
+ */
+export function cellToFeature(cell, site, defaultRadius = 500) {
+    const radius = cell.radius ?? defaultRadius;
+    const coordinates = createSectorPolygon(site.longitude, site.latitude, cell.azimuth, cell.beamwidth, radius);
+    return {
+        type: 'Feature',
+        geometry: {
+            type: 'Polygon',
+            coordinates: [coordinates]
+        },
+        properties: cell
+    };
+}

package/dist/map/utils/mapboxHelpers.d.ts

@@ -0,0 +1,51 @@
+/**
+ * Mapbox GL JS helper utilities for layer and source management
+ */
+/**
+ * Safely adds a source to the map if it doesn't already exist
+ */
+export declare function addSourceIfMissing(map: mapboxgl.Map, sourceId: string, sourceSpec: mapboxgl.AnySourceData): void;
+/**
+ * Safely removes a source from the map if it exists
+ */
+export declare function removeSourceIfExists(map: mapboxgl.Map, sourceId: string): void;
+/**
+ * Safely adds a layer to the map if it doesn't already exist
+ */
+export declare function addLayerIfMissing(map: mapboxgl.Map, layer: mapboxgl.AnyLayer, beforeId?: string): void;
+/**
+ * Safely removes a layer from the map if it exists
+ */
+export declare function removeLayerIfExists(map: mapboxgl.Map, layerId: string): void;
+/**
+ * Updates GeoJSON source data if the source exists
+ */
+export declare function updateGeoJSONSource(map: mapboxgl.Map, sourceId: string, data: GeoJSON.FeatureCollection | GeoJSON.Feature): void;
+/**
+ * Removes a layer and its associated source
+ */
+export declare function removeLayerAndSource(map: mapboxgl.Map, layerId: string, sourceId: string): void;
+/**
+ * Checks if the map style is loaded
+ */
+export declare function isStyleLoaded(map: mapboxgl.Map): boolean;
+/**
+ * Waits for the map style to be loaded
+ */
+export declare function waitForStyleLoad(map: mapboxgl.Map): Promise<void>;
+/**
+ * Sets a feature state on a source
+ */
+export declare function setFeatureState(map: mapboxgl.Map, sourceId: string, featureId: string | number, state: Record<string, unknown>): void;
+/**
+ * Removes a feature state from a source
+ */
+export declare function removeFeatureState(map: mapboxgl.Map, sourceId: string, featureId: string | number, key?: string): void;
+/**
+ * Generates a unique layer ID with a namespace prefix
+ */
+export declare function generateLayerId(namespace: string, layerName: string): string;
+/**
+ * Generates a unique source ID with a namespace prefix
+ */
+export declare function generateSourceId(namespace: string, sourceName: string): string;