@rakeyshgidwani/roger-ui-bank-theme-stan-design 0.2.10 → 0.2.16

package/dist/hooks/use-performance-throttling.d.ts

@@ -1,346 +0,0 @@
-export interface PerformanceThrottlingConfig {
-  enablePerformanceMonitoring?: boolean
-  enableAutomaticThrottling?: boolean
-  enableUserExperienceOptimization?: boolean
-  enableBatteryPreservation?: boolean
-  performanceThreshold?: number
-  frameRateTarget?: number
-  memoryThreshold?: number
-  cpuThreshold?: number
-}
-
-export interface PerformanceMetrics {
-  fps: number
-  frameTime: number
-  memoryUsage: number
-  cpuUsage: number
-  performanceScore: number
-  isThrottling: boolean
-  throttleReason: string
-}
-
-export interface PerformanceThrottlingCallbacks {
-  onPerformanceWarning?: (metrics: PerformanceMetrics) => void
-  onThrottlingApplied?: (level: string, reason: string) => void
-  onPerformanceRecovery?: (metrics: PerformanceMetrics) => void
-  onUserExperienceOptimized?: (optimization: string) => void
-}
-
-export declare const usePerformanceThrottling: (
-  config: PerformanceThrottlingConfig = {},
-  callbacks: PerformanceThrottlingCallbacks = {}
-) => {
-  const {
-    enablePerformanceMonitoring = true,
-    enableAutomaticThrottling = true,
-    enableUserExperienceOptimization = true,
-    enableBatteryPreservation = true,
-    performanceThreshold = 70,
-    frameRateTarget = 60,
-    memoryThreshold = 80,
-    cpuThreshold = 80
-  } = config
-
-  const [metrics, setMetrics] = useState<PerformanceMetrics>({
-    fps: 60,
-    frameTime: 16.67,
-    memoryUsage: 0,
-    cpuUsage: 0,
-    performanceScore: 100,
-    isThrottling: false,
-    throttleReason: 'none'
-  })
-
-  const [isOptimizing, setIsOptimizing] = useState(false)
-  const [optimizations, setOptimizations] = useState<string[]>([])
-  const [throttleLevel, setThrottleLevel] = useState<'none' | 'light' | 'moderate' | 'aggressive'>('none')
-
-  const frameCountRef = useRef(0)
-  const lastFrameTimeRef = useRef(performance.now())
-  const performanceTimerRef = useRef<number | null>(null)
-  const throttlingTimerRef = useRef<number | null>(null)
-
-  // Performance monitoring
-  const measurePerformance = useCallback(() => {
-    if (!enablePerformanceMonitoring) return
-
-    try {
-      const now = performance.now()
-      frameCountRef.current++
-
-      if (now - lastFrameTimeRef.current >= 1000) {
-        const fps = Math.round((frameCountRef.current * 1000) / (now - lastFrameTimeRef.current))
-        const frameTime = 1000 / fps
-
-        // Simulate memory and CPU usage
-        const memoryUsage = Math.random() * 100
-        const cpuUsage = Math.random() * 100
-
-        // Calculate performance score
-        const fpsScore = Math.min((fps / frameRateTarget) * 100, 100)
-        const timeScore = Math.max(100 - (frameTime - 16.67) * 10, 0)
-        const memoryScore = Math.max(100 - memoryUsage, 0)
-        const cpuScore = Math.max(100 - cpuUsage, 0)
-
-        const performanceScore = Math.round((fpsScore + timeScore + memoryScore + cpuScore) / 4)
-
-        // Determine if throttling is needed
-        const isThrottling = performanceScore < performanceThreshold || 
-                           fps < frameRateTarget * 0.8 || 
-                           memoryUsage > memoryThreshold || 
-                           cpuUsage > cpuThreshold
-
-        let throttleReason = 'none'
-        if (performanceScore < performanceThreshold) throttleReason = 'low_performance'
-        else if (fps < frameRateTarget * 0.8) throttleReason = 'low_fps'
-        else if (memoryUsage > memoryThreshold) throttleReason = 'high_memory'
-        else if (cpuUsage > cpuThreshold) throttleReason = 'high_cpu'
-
-        const newMetrics: PerformanceMetrics = {
-          fps,
-          frameTime,
-          memoryUsage,
-          cpuUsage,
-          performanceScore,
-          isThrottling,
-          throttleReason
-        }
-
-        setMetrics(newMetrics)
-
-        // Trigger callbacks
-        if (isThrottling) {
-          callbacks.onPerformanceWarning?.(newMetrics)
-        } else if (metrics.isThrottling) {
-          callbacks.onPerformanceRecovery?.(newMetrics)
-        }
-
-        frameCountRef.current = 0
-        lastFrameTimeRef.current = now
-      }
-    } catch (error) {
-      console.warn('Performance measurement failed:', error)
-    }
-  }, [enablePerformanceMonitoring, performanceThreshold, frameRateTarget, memoryThreshold, cpuThreshold, callbacks, metrics.isThrottling])
-
-  // Automatic throttling
-  const applyPerformanceThrottling = useCallback(() => {
-    if (!enableAutomaticThrottling) return
-
-    setIsOptimizing(true)
-
-    setTimeout(() => {
-      let newThrottleLevel: 'none' | 'light' | 'moderate' | 'aggressive' = 'none'
-      let optimizations: string[] = []
-
-      // Determine throttle level based on performance metrics
-      if (metrics.performanceScore < 50 || metrics.fps < 30) {
-        newThrottleLevel = 'aggressive'
-        optimizations.push('Critical performance: Maximum throttling applied')
-        optimizations.push('All non-essential animations disabled')
-        optimizations.push('Frame rate limited to 30fps')
-        optimizations.push('Memory usage optimized')
-      } else if (metrics.performanceScore < 70 || metrics.fps < 45) {
-        newThrottleLevel = 'moderate'
-        optimizations.push('Performance issue: Moderate throttling applied')
-        optimizations.push('Animation complexity reduced by 50%')
-        optimizations.push('Frame rate limited to 45fps')
-        optimizations.push('Memory optimization enabled')
-      } else if (metrics.performanceScore < 85 || metrics.fps < 55) {
-        newThrottleLevel = 'light'
-        optimizations.push('Performance warning: Light throttling applied')
-        optimizations.push('Animation complexity reduced by 25%')
-        optimizations.push('Frame rate limited to 55fps')
-        optimizations.push('Performance monitoring enhanced')
-      }
-
-      // Battery preservation considerations
-      if (enableBatteryPreservation && newThrottleLevel !== 'none') {
-        optimizations.push('Battery preservation: Animation efficiency optimized')
-        optimizations.push('GPU usage minimized for power efficiency')
-      }
-
-      // User experience optimization
-      if (enableUserExperienceOptimization && newThrottleLevel !== 'none') {
-        optimizations.push('User experience: Smooth performance prioritized')
-        optimizations.push('Animation quality balanced with performance')
-        optimizations.push('Responsive interactions maintained')
-      }
-
-      setThrottleLevel(newThrottleLevel)
-      setOptimizations(prev => [...prev, ...optimizations])
-      setIsOptimizing(false)
-
-      callbacks.onThrottlingApplied?.(newThrottleLevel, metrics.throttleReason)
-
-      optimizations.forEach(optimization => {
-        callbacks.onUserExperienceOptimized?.(optimization)
-      })
-    }, 200)
-  }, [enableAutomaticThrottling, enableBatteryPreservation, enableUserExperienceOptimization, metrics, callbacks])
-
-  // Get throttling recommendations
-  const getThrottlingRecommendations = useCallback(() => {
-    const recommendations = []
-
-    if (metrics.performanceScore < 50) {
-      recommendations.push('Critical: Disable all animations and complex UI operations')
-      recommendations.push('Use static UI elements and minimal interactions')
-      recommendations.push('Implement aggressive memory cleanup')
-    } else if (metrics.performanceScore < 70) {
-      recommendations.push('High: Significantly reduce animation complexity')
-      recommendations.push('Limit concurrent animations to 2-3 maximum')
-      recommendations.push('Use CSS transforms instead of JavaScript animations')
-    } else if (metrics.performanceScore < 85) {
-      recommendations.push('Medium: Consider light performance optimization')
-      recommendations.push('Monitor animation frame rates closely')
-      recommendations.push('Implement animation debouncing')
-    }
-
-    if (metrics.fps < frameRateTarget * 0.8) {
-      recommendations.push('Low FPS: Reduce animation frame rate')
-      recommendations.push('Use requestAnimationFrame for smooth animations')
-      recommendations.push('Implement frame skipping for complex animations')
-    }
-
-    if (metrics.memoryUsage > memoryThreshold) {
-      recommendations.push('High Memory: Optimize memory usage')
-      recommendations.push('Clean up animation references')
-      recommendations.push('Use object pooling for repeated animations')
-    }
-
-    if (metrics.cpuUsage > cpuThreshold) {
-      recommendations.push('High CPU: Reduce computational complexity')
-      recommendations.push('Use CSS animations instead of JavaScript')
-      recommendations.push('Implement animation pausing when not visible')
-    }
-
-    return recommendations
-  }, [metrics, frameRateTarget, memoryThreshold, cpuThreshold])
-
-  // Get optimal performance settings
-  const getOptimalPerformanceSettings = useCallback(() => {
-    const settings = {
-      maxConcurrentAnimations: 5,
-      frameRateLimit: 60,
-      animationQuality: 'high',
-      memoryOptimization: false,
-      cpuOptimization: false
-    }
-
-    switch (throttleLevel) {
-      case 'aggressive':
-        settings.maxConcurrentAnimations = 1
-        settings.frameRateLimit = 30
-        settings.animationQuality = 'minimal'
-        settings.memoryOptimization = true
-        settings.cpuOptimization = true
-        break
-      case 'moderate':
-        settings.maxConcurrentAnimations = 2
-        settings.frameRateLimit = 45
-        settings.animationQuality = 'medium'
-        settings.memoryOptimization = true
-        settings.cpuOptimization = true
-        break
-      case 'light':
-        settings.maxConcurrentAnimations = 3
-        settings.frameRateLimit = 55
-        settings.animationQuality = 'high'
-        settings.memoryOptimization = true
-        settings.cpuOptimization = false
-        break
-      default:
-        settings.maxConcurrentAnimations = 5
-        settings.frameRateLimit = 60
-        settings.animationQuality = 'high'
-        settings.memoryOptimization = false
-        settings.cpuOptimization = false
-    }
-
-    return settings
-  }, [throttleLevel])
-
-  // Reset throttling
-  const resetThrottling = useCallback(() => {
-    setThrottleLevel('none')
-    setOptimizations([])
-    setMetrics(prev => ({
-      ...prev,
-      isThrottling: false,
-      throttleReason: 'none'
-    }))
-  }, [])
-
-  // Initialize performance monitoring
-  useEffect(() => {
-    if (!enablePerformanceMonitoring) return
-
-    try {
-      performanceTimerRef.current = window.setInterval(measurePerformance, 1000)
-
-      return () => {
-        if (performanceTimerRef.current) {
-          clearInterval(performanceTimerRef.current)
-        }
-      }
-    } catch (error) {
-      console.warn('Performance monitoring initialization failed:', error)
-    }
-  }, [enablePerformanceMonitoring, measurePerformance])
-
-  // Apply throttling when performance degrades
-  useEffect(() => {
-    if (enableAutomaticThrottling && metrics.isThrottling) {
-      throttlingTimerRef.current = window.setTimeout(applyPerformanceThrottling, 1000)
-
-      return () => {
-        if (throttlingTimerRef.current) {
-          clearTimeout(throttlingTimerRef.current)
-        }
-      }
-    }
-  }, [enableAutomaticThrottling, metrics.isThrottling, applyPerformanceThrottling])
-
-  // Cleanup on unmount
-  useEffect(() => {
-    return () => {
-      if (throttlingTimerRef.current) {
-        clearTimeout(throttlingTimerRef.current)
-      }
-    }
-  }, [])
-
-  return {
-    // State
-    metrics,
-    isOptimizing,
-    optimizations,
-    throttleLevel,
-
-    // Actions
-    measurePerformance,
-    applyPerformanceThrottling,
-    resetThrottling,
-
-    // Computed values
-    isThrottling: throttleLevel !== 'none',
-    performanceLevel: metrics.performanceScore >= 90 ? 'excellent' : 
-                     metrics.performanceScore >= 80 ? 'good' : 
-                     metrics.performanceScore >= 70 ? 'fair' : 'poor',
-    needsOptimization: metrics.performanceScore < 70,
-    recommendations: getThrottlingRecommendations(),
-    performanceSettings: getOptimalPerformanceSettings(),
-
-    // Utility functions
-    getPerformanceHealth: () => {
-      if (metrics.performanceScore >= 90) return 'excellent'
-      if (metrics.performanceScore >= 80) return 'good'
-      if (metrics.performanceScore >= 70) return 'fair'
-      if (metrics.performanceScore >= 50) return 'poor'
-      return 'critical'
-    }
-  }
-}
-
-export default usePerformanceThrottling

package/dist/hooks/use-performance.d.ts

@@ -1,314 +0,0 @@
-export interface PerformanceMetrics {
-  fps: number
-  frameTime: number
-  memoryUsage?: number
-  memoryLimit?: number
-  memoryPercentage?: number
-  batteryLevel?: number
-  isLowPowerMode?: boolean
-  isCharging?: boolean
-  performanceMode: 'high' | 'medium' | 'low'
-  throttlingEnabled: boolean
-  throttlingReason?: string
-}
-
-export interface PerformanceThresholds {
-  fps: {
-    warning: number
-    critical: number
-  }
-  memory: {
-    warning: number
-    critical: number
-  }
-  battery: {
-    low: number
-    critical: number
-  }
-}
-
-export interface PerformanceCallbacks {
-  onFPSWarning?: (fps: number) => void
-  onMemoryWarning?: (usage: number) => void
-  onBatteryLow?: (level: number) => void
-  onPerformanceModeChange?: (mode: PerformanceMetrics['performanceMode']) => void
-  onThrottlingChange?: (enabled: boolean, reason?: string) => void
-}
-
-export interface PerformanceOptions {
-  updateInterval?: number
-  thresholds?: Partial<PerformanceThresholds>
-  enableThrottling?: boolean
-  enableBatteryOptimization?: boolean
-  callbacks?: PerformanceCallbacks
-}
-
-const DEFAULT_THRESHOLDS: PerformanceThresholds = {
-  fps: {
-    warning: 45,
-    critical: 30
-  },
-  memory: {
-    warning: 0.7,
-    critical: 0.85
-  },
-  battery: {
-    low: 0.3,
-    critical: 0.15
-  }
-}
-
-export declare const usePerformance: (options: PerformanceOptions = {}) => {
-  const {
-    updateInterval = 1000,
-    thresholds = {},
-    enableThrottling = true,
-    enableBatteryOptimization = true,
-    callbacks = {}
-  } = options
-
-  const [metrics, setMetrics] = useState<PerformanceMetrics>({
-    fps: 60,
-    frameTime: 16.67,
-    performanceMode: 'high',
-    throttlingEnabled: false
-  })
-
-  const [isMonitoring, setIsMonitoring] = useState(false)
-  const frameCountRef = useRef(0)
-  const lastTimeRef = useRef(performance.now())
-  const animationIdRef = useRef<number>()
-  const intervalIdRef = useRef<NodeJS.Timeout>()
-
-  // Merge default thresholds with custom ones
-  const finalThresholds = useMemo(() => ({
-    ...DEFAULT_THRESHOLDS,
-    ...thresholds
-  }), [thresholds])
-
-  // Frame rate monitoring
-  const measureFrameRate = useCallback(() => {
-    frameCountRef.current++
-    const currentTime = performance.now()
-
-    if (currentTime - lastTimeRef.current >= updateInterval) {
-      const fps = Math.round((frameCountRef.current * 1000) / (currentTime - lastTimeRef.current))
-      const frameTime = 1000 / fps
-
-      setMetrics(prev => ({
-        ...prev,
-        fps,
-        frameTime
-      }))
-
-      // Check FPS thresholds
-      if (fps <= finalThresholds.fps.critical && callbacks.onFPSWarning) {
-        callbacks.onFPSWarning(fps)
-      }
-
-      frameCountRef.current = 0
-      lastTimeRef.current = currentTime
-    }
-
-    animationIdRef.current = requestAnimationFrame(measureFrameRate)
-  }, [updateInterval, finalThresholds.fps.critical, callbacks.onFPSWarning])
-
-  // Memory usage monitoring
-  const updateMemoryInfo = useCallback(() => {
-    if ('memory' in performance) {
-      const memory = (performance as any).memory
-      const memoryUsage = memory.usedJSHeapSize / memory.jsHeapSizeLimit
-
-      setMetrics(prev => ({
-        ...prev,
-        memoryUsage,
-        memoryLimit: memory.jsHeapSizeLimit,
-        memoryPercentage: memoryUsage * 100
-      }))
-
-      // Check memory thresholds
-      if (memoryUsage >= finalThresholds.memory.critical && callbacks.onMemoryWarning) {
-        callbacks.onMemoryWarning(memoryUsage)
-      }
-    }
-  }, [finalThresholds.memory.critical, callbacks.onMemoryWarning])
-
-  // Battery status monitoring
-  const updateBatteryInfo = useCallback(async () => {
-    if ('getBattery' in navigator) {
-      try {
-        const battery = await (navigator as any).getBattery()
-
-        setMetrics(prev => ({
-          ...prev,
-          batteryLevel: battery.level,
-          isLowPowerMode: battery.level < finalThresholds.battery.low,
-          isCharging: battery.charging
-        }))
-
-        // Check battery thresholds
-        if (battery.level <= finalThresholds.battery.critical && callbacks.onBatteryLow) {
-          callbacks.onBatteryLow(battery.level)
-        }
-      } catch (error) {
-        console.warn('Battery API not available:', error)
-      }
-    }
-  }, [finalThresholds.battery.low, finalThresholds.battery.critical, callbacks.onBatteryLow])
-
-  // Performance mode determination
-  const determinePerformanceMode = useCallback((fps: number, memoryUsage?: number): PerformanceMetrics['performanceMode'] => {
-    if (fps < finalThresholds.fps.critical || (memoryUsage && memoryUsage > finalThresholds.memory.critical)) {
-      return 'low'
-    }
-    if (fps < finalThresholds.fps.warning || (memoryUsage && memoryUsage > finalThresholds.memory.warning)) {
-      return 'medium'
-    }
-    return 'high'
-  }, [finalThresholds])
-
-  // Performance throttling logic
-  const shouldThrottle = useCallback((): { should: boolean; reason?: string } => {
-    const { fps, memoryPercentage, batteryLevel, isLowPowerMode } = metrics
-
-    // FPS-based throttling
-    if (fps < finalThresholds.fps.critical) {
-      return { should: true, reason: 'Low FPS' }
-    }
-
-    // Memory-based throttling
-    if (memoryPercentage && memoryPercentage > finalThresholds.memory.critical * 100) {
-      return { should: true, reason: 'High memory usage' }
-    }
-
-    // Battery-based throttling
-    if (enableBatteryOptimization && (isLowPowerMode || (batteryLevel && batteryLevel < finalThresholds.battery.low))) {
-      return { should: true, reason: 'Low battery' }
-    }
-
-    return { should: false }
-  }, [metrics, finalThresholds, enableBatteryOptimization])
-
-  // Update performance mode and throttling
-  useEffect(() => {
-    const newMode = determinePerformanceMode(metrics.fps, metrics.memoryUsage)
-    const { should: shouldThrottleNow, reason } = shouldThrottle()
-
-    setMetrics(prev => ({
-      ...prev,
-      performanceMode: newMode,
-      throttlingEnabled: enableThrottling && shouldThrottleNow,
-      throttlingReason: reason
-    }))
-
-    // Notify callbacks
-    if (newMode !== metrics.performanceMode && callbacks.onPerformanceModeChange) {
-      callbacks.onPerformanceModeChange(newMode)
-    }
-
-    if (enableThrottling && shouldThrottleNow !== metrics.throttlingEnabled && callbacks.onThrottlingChange) {
-      callbacks.onThrottlingChange(shouldThrottleNow, reason)
-    }
-  }, [metrics.fps, metrics.memoryUsage, metrics.batteryLevel, metrics.isLowPowerMode, enableThrottling, determinePerformanceMode, shouldThrottle, callbacks, metrics.performanceMode, metrics.throttlingEnabled])
-
-  // Start monitoring
-  const startMonitoring = useCallback(() => {
-    if (isMonitoring) return
-
-    setIsMonitoring(true)
-    measureFrameRate()
-
-    // Set up interval for memory and battery updates
-    intervalIdRef.current = setInterval(() => {
-      updateMemoryInfo()
-      updateBatteryInfo()
-    }, updateInterval)
-  }, [isMonitoring, measureFrameRate, updateMemoryInfo, updateBatteryInfo, updateInterval])
-
-  // Stop monitoring
-  const stopMonitoring = useCallback(() => {
-    setIsMonitoring(false)
-
-    if (animationIdRef.current) {
-      cancelAnimationFrame(animationIdRef.current)
-    }
-
-    if (intervalIdRef.current) {
-      clearInterval(intervalIdRef.current)
-    }
-  }, [])
-
-  // Auto-start monitoring on mount
-  useEffect(() => {
-    startMonitoring()
-    return () => stopMonitoring()
-  }, [startMonitoring, stopMonitoring])
-
-  // Performance optimization recommendations
-  const getOptimizationRecommendations = useCallback(() => {
-    const recommendations: string[] = []
-
-    if (metrics.fps < finalThresholds.fps.warning) {
-      recommendations.push('Consider reducing animation complexity or enabling performance mode')
-    }
-
-    if (metrics.memoryPercentage && metrics.memoryPercentage > finalThresholds.memory.warning * 100) {
-      recommendations.push('Memory usage is high - consider implementing lazy loading or cleanup')
-    }
-
-    if (metrics.isLowPowerMode) {
-      recommendations.push('Low battery detected - performance optimizations are active')
-    }
-
-    return recommendations
-  }, [metrics, finalThresholds])
-
-  // Throttling controls
-  const enableThrottlingMode = useCallback(() => {
-    setMetrics(prev => ({
-      ...prev,
-      throttlingEnabled: true,
-      throttlingReason: 'Manual override'
-    }))
-  }, [])
-
-  const disableThrottlingMode = useCallback(() => {
-    setMetrics(prev => ({
-      ...prev,
-      throttlingEnabled: false,
-      throttlingReason: undefined
-    }))
-  }, [])
-
-  return {
-    // Metrics
-    metrics,
-
-    // Controls
-    startMonitoring,
-    stopMonitoring,
-    isMonitoring,
-
-    // Throttling
-    throttlingEnabled: metrics.throttlingEnabled,
-    throttlingReason: metrics.throttlingReason,
-    enableThrottlingMode,
-    disableThrottlingMode,
-
-    // Performance mode
-    performanceMode: metrics.performanceMode,
-
-    // Recommendations
-    getOptimizationRecommendations,
-
-    // Thresholds
-    thresholds: finalThresholds,
-
-    // Raw values for advanced usage
-    fps: metrics.fps,
-    frameTime: metrics.frameTime,
-    memoryUsage: metrics.memoryUsage,
-    batteryLevel: metrics.batteryLevel,
-    isLowPowerMode: metrics.isLowPowerMode
-  }
-}