@jmruthers/pace-core 0.5.135 → 0.5.137

package/src/utils/core/logger.ts

@@ -0,0 +1,181 @@
+/**
+ * @file Production-Safe Logger Utility
+ * @package @jmruthers/pace-core
+ * @module Utils/Logger
+ * @since 0.4.76
+ */
+
+/**
+ * Logger levels for different types of messages
+ */
+export enum LogLevel {
+  DEBUG = 0,
+  INFO = 1,
+  WARN = 2,
+  ERROR = 3,
+}
+
+/**
+ * Logger configuration interface
+ */
+export interface LoggerConfig {
+  /** Minimum log level to output */
+  level: LogLevel;
+  /** Whether to include timestamps */
+  includeTimestamp: boolean;
+  /** Whether to include component names */
+  includeComponent: boolean;
+  /** Custom prefix for all log messages */
+  prefix?: string;
+}
+
+/**
+ * Production-safe logger that no-ops in production builds
+ * Only outputs logs in development mode to prevent production console spam
+ */
+export class Logger {
+  private static config: LoggerConfig = {
+    level: LogLevel.DEBUG,
+    includeTimestamp: false,
+    includeComponent: true,
+  };
+
+  /**
+   * Check if we're in development or test mode
+   * Allows logging in both development and test environments
+   */
+  private static get isDevelopment(): boolean {
+    const mode = import.meta.env.MODE;
+    return mode === 'development' || mode === 'test';
+  }
+
+  /**
+   * Configure the logger
+   */
+  static configure(config: Partial<LoggerConfig>): void {
+    this.config = { ...this.config, ...config };
+  }
+
+  /**
+   * Format a log message with optional timestamp and component
+   */
+  private static formatMessage(
+    level: LogLevel,
+    component: string,
+    message: string
+  ): string {
+    const parts: string[] = [];
+
+    if (this.config.prefix) {
+      parts.push(`[${this.config.prefix}]`);
+    }
+
+    if (this.config.includeTimestamp) {
+      parts.push(`[${new Date().toISOString()}]`);
+    }
+
+    parts.push(`[${LogLevel[level]}]`);
+
+    if (this.config.includeComponent && component) {
+      parts.push(`[${component}]`);
+    }
+
+    parts.push(message);
+
+    return parts.join(' ');
+  }
+
+  /**
+   * Check if a log level should be output
+   */
+  private static shouldLog(level: LogLevel): boolean {
+    return this.isDevelopment && level >= this.config.level;
+  }
+
+  /**
+   * Log debug information (development only)
+   */
+  static debug(component: string, message: string, ...args: any[]): void {
+    if (this.shouldLog(LogLevel.DEBUG)) {
+      try {
+        console.debug(this.formatMessage(LogLevel.DEBUG, component, message), ...args);
+      } catch (e) {
+        // Gracefully handle console method errors
+      }
+    }
+  }
+
+  /**
+   * Log info information (development only)
+   */
+  static info(component: string, message: string, ...args: any[]): void {
+    if (this.shouldLog(LogLevel.INFO)) {
+      try {
+        console.info(this.formatMessage(LogLevel.INFO, component, message), ...args);
+      } catch (e) {
+        // Gracefully handle console method errors
+      }
+    }
+  }
+
+  /**
+   * Log warning information (development only)
+   */
+  static warn(component: string, message: string, ...args: any[]): void {
+    if (this.shouldLog(LogLevel.WARN)) {
+      try {
+        console.warn(this.formatMessage(LogLevel.WARN, component, message), ...args);
+      } catch (e) {
+        // Gracefully handle console method errors
+      }
+    }
+  }
+
+  /**
+   * Log error information (development only)
+   */
+  static error(component: string, message: string, ...args: any[]): void {
+    if (this.shouldLog(LogLevel.ERROR)) {
+      try {
+        console.error(this.formatMessage(LogLevel.ERROR, component, message), ...args);
+      } catch (e) {
+        // Gracefully handle console method errors
+      }
+    }
+  }
+
+  /**
+   * Create a scoped logger for a specific component
+   */
+  static createScopedLogger(component: string) {
+    return {
+      debug: (message: string, ...args: any[]) => this.debug(component, message, ...args),
+      info: (message: string, ...args: any[]) => this.info(component, message, ...args),
+      warn: (message: string, ...args: any[]) => this.warn(component, message, ...args),
+      error: (message: string, ...args: any[]) => this.error(component, message, ...args),
+    };
+  }
+}
+
+/**
+ * Default logger instance for convenience
+ */
+export const logger = {
+  debug: (component: string, message: string, ...args: any[]) => 
+    Logger.debug(component, message, ...args),
+  info: (component: string, message: string, ...args: any[]) => 
+    Logger.info(component, message, ...args),
+  warn: (component: string, message: string, ...args: any[]) => 
+    Logger.warn(component, message, ...args),
+  error: (component: string, message: string, ...args: any[]) => 
+    Logger.error(component, message, ...args),
+  createScopedLogger: (component: string) => Logger.createScopedLogger(component),
+  configure: (config: Partial<LoggerConfig>) => Logger.configure(config),
+};
+
+/**
+ * Convenience function to create a scoped logger
+ */
+export function createLogger(component: string) {
+  return Logger.createScopedLogger(component);
+}

package/src/utils/device/deviceFingerprint.ts

@@ -0,0 +1,215 @@
+/**
+ * @file Secure Device Fingerprinting
+ * @description Enhanced device fingerprinting with encryption and security measures
+ */
+
+import { secureStorage } from '../security/secureStorage';
+
+export interface DeviceFingerprint {
+  hash: string;
+  timestamp: number;
+  components: {
+    userAgent: string;
+    language: string;
+    platform: string;
+    screen: string;
+    timezone: string;
+    canvas?: string;
+    webgl?: string;
+  };
+  entropy: number;
+}
+
+/**
+ * Generate a secure device fingerprint (synchronous)
+ */
+export function generateDeviceFingerprint(): DeviceFingerprint {
+  try {
+    const components = {
+      userAgent: getHashedUserAgent(),
+      language: navigator.language || 'unknown',
+      platform: navigator.platform || 'unknown',
+      screen: `${screen.width}x${screen.height}x${screen.colorDepth}`,
+      timezone: Intl.DateTimeFormat().resolvedOptions().timeZone || 'unknown',
+      canvas: getCanvasFingerprint(),
+      webgl: getWebGLFingerprint(),
+    };
+
+    // Calculate entropy (uniqueness score)
+    const entropy = calculateEntropy(components);
+    
+    // Create a hash from all components
+    const fingerprintData = JSON.stringify(components);
+    const hash = hashStringSync(fingerprintData);
+
+    const fingerprint: DeviceFingerprint = {
+      hash,
+      timestamp: Date.now(),
+      components,
+      entropy,
+    };
+
+    // Store fingerprint asynchronously
+    secureStorage.setItem('device_fingerprint', JSON.stringify(fingerprint));
+    
+    return fingerprint;
+  } catch (error) {
+    return generateFallbackFingerprint();
+  }
+}
+
+/**
+ * Validate device fingerprint with security checks
+ */
+export function validateDeviceFingerprint(
+  storedFingerprint: DeviceFingerprint,
+  currentFingerprint: DeviceFingerprint
+): {
+  isValid: boolean;
+  confidence: number;
+  reasons: string[];
+} {
+  const reasons: string[] = [];
+  let matchingComponents = 0;
+  const totalComponents = Object.keys(storedFingerprint.components).length;
+
+  // Check each component
+  Object.entries(storedFingerprint.components).forEach(([key, value]) => {
+    if (currentFingerprint.components[key as keyof typeof currentFingerprint.components] === value) {
+      matchingComponents++;
+    } else {
+      reasons.push(`Component mismatch: ${key}`);
+    }
+  });
+
+  // Calculate confidence score
+  const confidence = (matchingComponents / totalComponents) * 100;
+
+  // Security thresholds
+  const isValid = confidence >= 80; // Require 80% match
+  
+  // Additional security checks
+  const timeDiff = currentFingerprint.timestamp - storedFingerprint.timestamp;
+  const maxAge = 30 * 24 * 60 * 60 * 1000; // 30 days
+  
+  if (timeDiff > maxAge) {
+    reasons.push('Fingerprint too old');
+    return { isValid: false, confidence, reasons };
+  }
+
+  if (confidence < 60) {
+    reasons.push('Device signature changed significantly');
+  }
+
+  return { isValid, confidence, reasons };
+}
+
+/**
+ * Generate canvas fingerprint for enhanced uniqueness
+ */
+function getCanvasFingerprint(): string {
+  try {
+    const canvas = document.createElement('canvas');
+    const ctx = canvas.getContext('2d');
+    
+    if (!ctx) return 'canvas-unavailable';
+
+    // Draw complex pattern for fingerprinting
+    ctx.textBaseline = 'top';
+    ctx.font = '14px Arial';
+    ctx.fillStyle = '#f60';
+    ctx.fillRect(125, 1, 62, 20);
+    ctx.fillStyle = '#069';
+    ctx.fillText('Device fingerprint 🔒', 2, 15);
+    ctx.fillStyle = 'rgba(102, 204, 0, 0.2)';
+    ctx.fillText('Device fingerprint 🔒', 4, 17);
+
+    const dataURL = canvas.toDataURL();
+    return hashStringSync(dataURL);
+  } catch (error) {
+    return 'canvas-error';
+  }
+}
+
+/**
+ * Get WebGL fingerprint
+ */
+function getWebGLFingerprint(): string {
+  try {
+    const canvas = document.createElement('canvas');
+    const gl = canvas.getContext('webgl') || canvas.getContext('experimental-webgl') as WebGLRenderingContext | null;
+    
+    if (!gl) return 'webgl-unavailable';
+
+    const debugInfo = gl.getExtension('WEBGL_debug_renderer_info');
+    if (!debugInfo) return 'webgl-no-debug';
+
+    const vendor = gl.getParameter(debugInfo.UNMASKED_VENDOR_WEBGL);
+    const renderer = gl.getParameter(debugInfo.UNMASKED_RENDERER_WEBGL);
+    
+    return `${vendor}|${renderer}`;
+  } catch (error) {
+    return 'webgl-error';
+  }
+}
+
+/**
+ * Hash user agent to prevent direct exposure
+ */
+function getHashedUserAgent(): string {
+  const ua = navigator.userAgent;
+  return hashStringSync(ua).substring(0, 16); // Shorter hash for storage
+}
+
+/**
+ * Calculate entropy of fingerprint components
+ */
+function calculateEntropy(components: Record<string, string>): number {
+  const values = Object.values(components).join('');
+  const charCounts = new Map<string, number>();
+  
+  for (const char of values) {
+    charCounts.set(char, (charCounts.get(char) || 0) + 1);
+  }
+  
+  let entropy = 0;
+  for (const count of charCounts.values()) {
+    const probability = count / values.length;
+    entropy -= probability * Math.log2(probability);
+  }
+  
+  return entropy;
+}
+
+/**
+ * Synchronous hash function for device fingerprinting
+ */
+function hashStringSync(str: string): string {
+  let hash = 0;
+  for (let i = 0; i < str.length; i++) {
+    const char = str.charCodeAt(i);
+    hash = ((hash << 5) - hash) + char;
+    hash = hash & hash;
+  }
+  return Math.abs(hash).toString(36);
+}
+
+/**
+ * Generate fallback fingerprint for error cases
+ */
+function generateFallbackFingerprint(): DeviceFingerprint {
+  const components = {
+    userAgent: 'fallback',
+    language: 'unknown',
+    platform: 'unknown',
+    screen: 'unknown',
+    timezone: 'unknown',
+  };
+
+  return {
+    hash: `fallback_${Date.now()}_${Math.random().toString(36)}`,
+    timestamp: Date.now(),
+    components,
+    entropy: 1, // Low entropy for fallback
+  };
+}

package/src/utils/dynamic/dynamicUtils.ts

@@ -0,0 +1,105 @@
+
+/**
+ * Dynamic utility loader to reduce initial bundle size
+ * Heavy utilities are loaded on-demand
+ */
+
+// Type definitions for dynamic imports
+type DebounceFunction = <T extends (...args: unknown[]) => unknown>(
+  func: T,
+  wait?: number,
+  options?: { leading?: boolean; maxWait?: number; trailing?: boolean }
+) => T & { cancel(): void; flush(): void };
+
+type ThrottleFunction = <T extends (...args: unknown[]) => unknown>(
+  func: T,
+  wait?: number,
+  options?: { leading?: boolean; trailing?: boolean }
+) => T & { cancel(): void; flush(): void };
+
+// Dynamic lodash utilities
+export const loadLodash = async (): Promise<{
+  debounce: DebounceFunction;
+  throttle: ThrottleFunction;
+}> => {
+  const [debounceModule, throttleModule] = await Promise.all([
+    import('lodash.debounce' as any),
+    import('lodash.throttle' as any)
+  ]);
+  
+  return {
+    debounce: (debounceModule.default || debounceModule) as DebounceFunction,
+    throttle: (throttleModule.default || throttleModule) as ThrottleFunction
+  };
+};
+
+// Dynamic date utilities
+export const loadDateUtils = async (): Promise<typeof import('date-fns')> => {
+  const dateFns = await import('date-fns');
+  return dateFns;
+};
+
+// Dynamic chart utilities - using unknown type to avoid Recharts type issues
+export const loadChartUtils = async (): Promise<unknown> => {
+  const recharts = await import('recharts');
+  return recharts;
+};
+
+// Dynamic form utilities
+export const loadFormUtils = async (): Promise<{
+  useForm: unknown;
+  useController: unknown;
+  Controller: unknown;
+  FormProvider: unknown;
+  useFormContext: unknown;
+  useWatch: unknown;
+  useFormState: unknown;
+  useFieldArray: unknown;
+  zodResolver: unknown;
+}> => {
+  const [reactHookForm, zodResolvers] = await Promise.all([
+    import('react-hook-form'),
+    import('@hookform/resolvers/zod')
+  ]);
+  
+  return {
+    ...reactHookForm,
+    zodResolver: zodResolvers.zodResolver
+  };
+};
+
+// Dynamic CSV utilities
+export const loadCSVUtils = async (): Promise<unknown> => {
+  const papaparse = await import('papaparse');
+  return papaparse.default;
+};
+
+// Utility function to create lazy utility hooks
+export function createLazyUtility<T>(loader: () => Promise<T>) {
+  let cached: T | null = null;
+  let loading: Promise<T> | null = null;
+
+  return {
+    load: async (): Promise<T> => {
+      if (cached) return cached;
+      if (loading) return loading;
+
+      loading = loader().then(result => {
+        cached = result;
+        loading = null;
+        return result;
+      });
+
+      return loading;
+    },
+    getCached: (): T | null => cached,
+    isLoaded: (): boolean => cached !== null
+  };
+}
+
+// Pre-configured lazy utilities with explicit types
+export const lazyLodash: ReturnType<typeof createLazyUtility<Awaited<ReturnType<typeof loadLodash>>>> = createLazyUtility(loadLodash);
+export const lazyDateUtils: ReturnType<typeof createLazyUtility<Awaited<ReturnType<typeof loadDateUtils>>>> = createLazyUtility(loadDateUtils);
+export const lazyChartUtils: ReturnType<typeof createLazyUtility<unknown>> = createLazyUtility(loadChartUtils);
+export const lazyFormUtils: ReturnType<typeof createLazyUtility<Awaited<ReturnType<typeof loadFormUtils>>>> = createLazyUtility(loadFormUtils);
+export const lazyCSVUtils: ReturnType<typeof createLazyUtility<unknown>> = createLazyUtility(loadCSVUtils);

package/src/utils/dynamic/lazyLoad.tsx

@@ -0,0 +1,44 @@
+import React, { Suspense, ComponentType, lazy } from 'react';
+import { LoadingSpinner } from '../../components/LoadingSpinner/LoadingSpinner';
+
+interface LazyLoadOptions {
+  fallback?: React.ReactNode;
+  errorBoundary?: ComponentType<{ children: React.ReactNode }>;
+}
+
+/**
+ * Create a lazy-loaded component with error boundary and loading fallback
+ */
+export function createLazyComponent<T extends ComponentType<any>>(
+  importFn: () => Promise<{ default: T }>,
+  componentName: string,
+  options: LazyLoadOptions = {}
+): T {
+  const LazyComponent = lazy(importFn);
+  
+  const WrappedComponent = (props: any) => {
+    const content = (
+      <Suspense fallback={options.fallback || <LoadingSpinner />}>
+        <LazyComponent {...props} />
+      </Suspense>
+    );
+
+    if (options.errorBoundary) {
+      const ErrorBoundary = options.errorBoundary;
+      return <ErrorBoundary>{content}</ErrorBoundary>;
+    }
+
+    return content;
+  };
+  
+  WrappedComponent.displayName = `Lazy${componentName}`;
+  return WrappedComponent as T;
+}
+
+/**
+ * Lazy-loaded DataTable component
+ */
+export const LazyDataTable = createLazyComponent(
+  () => import('../../components/DataTable').then(module => ({ default: module.DataTable })),
+  'DataTable'
+);