@moontra/moonui 2.2.0 → 2.2.1

package/src/use-performance-optimizer.ts

@@ -19,11 +19,11 @@ export function usePerformanceOptimizer() {
       const componentMetrics = performanceProfiler.getMeasurements('component');
       if (componentMetrics.length > 0) {
         const slowComponents = componentMetrics
-          .filter(m => m.duration > 16.67) // Slower than 60fps
-          .sort((a, b) => b.duration - a.duration)
+          .filter((m: any) => m.duration > 16.67) // Slower than 60fps
+          .sort((a: any, b: any) => b.duration - a.duration)
           .slice(0, 5);
 
-        slowComponents.forEach(component => {
+        slowComponents.forEach((component: any) => {
           suggestions.push({
             type: 'component',
             severity: component.duration > 50 ? 'high' : 'medium',
@@ -55,7 +55,7 @@ export function usePerformanceOptimizer() {
       // Analyze layout shifts
       const layoutShifts = performanceProfiler.getMeasurements('layout-shift');
       if (layoutShifts.length > 0) {
-        const totalShift = layoutShifts.reduce((sum, shift) => sum + (shift.value || 0), 0);
+        const totalShift = layoutShifts.reduce((sum: any, shift: any) => sum + (shift.value || 0), 0);
         
         if (totalShift > 0.1) {
           suggestions.push({
@@ -112,9 +112,9 @@ export function useRenderOptimization<T>(
   React.useEffect(() => {
     if (process.env.NODE_ENV === 'development') {
       const componentName = 'useRenderOptimization';
-      performanceProfiler.measureComponent(componentName, () => {
-        // Measure the impact of memoization
-      });
+      const endMeasure = performanceProfiler.measureComponent(componentName);
+      // Measure the impact of memoization
+      endMeasure();
     }
   }, dependencies);
 
@@ -126,7 +126,7 @@ export function useDebouncePerformance<T extends (...args: any[]) => void>(
   callback: T,
   delay: number = 300
 ): T {
-  const timeoutRef = React.useRef<NodeJS.Timeout>();
+  const timeoutRef = React.useRef<NodeJS.Timeout | undefined>(undefined);
   
   const debouncedCallback = React.useCallback(
     (...args: Parameters<T>) => {
@@ -135,9 +135,9 @@ export function useDebouncePerformance<T extends (...args: any[]) => void>(
       }
       
       timeoutRef.current = setTimeout(() => {
-        performanceProfiler.measureComponent('debounced-callback', () => {
-          callback(...args);
-        });
+        const endMeasure = performanceProfiler.measureComponent('debounced-callback');
+        callback(...args);
+        endMeasure();
       }, delay);
     },
     [callback, delay]
@@ -167,9 +167,9 @@ export function useThrottlePerformance<T extends (...args: any[]) => void>(
       
       if (now - lastCallRef.current >= delay) {
         lastCallRef.current = now;
-        performanceProfiler.measureComponent('throttled-callback', () => {
-          callback(...args);
-        });
+        const endMeasure = performanceProfiler.measureComponent('throttled-callback');
+        callback(...args);
+        endMeasure();
       }
     },
     [callback, delay]
@@ -187,16 +187,16 @@ export function useComponentLifecycleTracking(componentName: string) {
     // Component mount
     mountTime.current = performance.now();
     
-    performanceProfiler.measureComponent(`${componentName}-mount`, () => {
-      // Measure mount time
-    });
+    const endMountMeasure = performanceProfiler.measureComponent(`${componentName}-mount`);
+    // Measure mount time
+    endMountMeasure();
 
     return () => {
       // Component unmount
       const lifetime = performance.now() - mountTime.current;
-      performanceProfiler.measureComponent(`${componentName}-unmount`, () => {
-        // Record component lifetime
-      });
+      const endUnmountMeasure = performanceProfiler.measureComponent(`${componentName}-unmount`);
+      // Record component lifetime
+      endUnmountMeasure();
     };
   }, [componentName]);
 
@@ -205,9 +205,9 @@ export function useComponentLifecycleTracking(componentName: string) {
     updateCount.current++;
     
     if (updateCount.current > 1) {
-      performanceProfiler.measureComponent(`${componentName}-update`, () => {
-        // Measure update time
-      });
+      const endUpdateMeasure = performanceProfiler.measureComponent(`${componentName}-update`);
+      // Measure update time
+      endUpdateMeasure();
     }
   });
 
@@ -271,9 +271,9 @@ export function useLazyImageOptimization(src: string, threshold: number = 0.1) {
           
           img.onload = () => {
             const loadTime = performance.now() - startTime;
-            performanceProfiler.measureComponent('image-load', () => {
-              // Record image load time
-            });
+            const endImageMeasure = performanceProfiler.measureComponent('image-load');
+            // Record image load time
+            endImageMeasure();
             setIsLoaded(true);
           };
           

package/src/use-scroll-animation.ts

@@ -12,10 +12,9 @@ interface UseScrollAnimationOptions {
 export function useScrollAnimation(options: UseScrollAnimationOptions = {}) {
   const ref = useRef<HTMLElement>(null)
   const isInView = useInView(ref, {
-    threshold: options.threshold || 0.1,
+    amount: options.threshold || 0.1,
     once: options.triggerOnce ?? true,
-    margin: options.rootMargin || '-100px',
-  })
+  } as any)
 
   return { ref, isInView }
 }
@@ -106,9 +105,8 @@ export function useInfiniteScroll(
 ) {
   const ref = useRef<HTMLElement>(null)
   const isInView = useInView(ref, {
-    threshold: options.threshold || 0.1,
-    margin: options.rootMargin || '100px',
-  })
+    amount: options.threshold || 0.1,
+  } as any)
 
   useEffect(() => {
     if (isInView) {
@@ -153,7 +151,7 @@ export function useScrollTriggeredCounter(
   const ref = useRef<HTMLElement>(null)
   
   const isInView = useInView(ref, {
-    threshold: 0.5,
+    amount: 0.5,
     once: true
   })