@umituz/web-design-system 3.1.14 → 3.1.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/web-design-system",
-  "version": "3.1.14",
+  "version": "3.1.15",
   "private": false,
   "description": "Web Design System - Atomic Design components (Atoms, Molecules, Organisms, Templates) for React applications",
   "main": "./src/index.ts",

package/src/infrastructure/performance/index.ts

@@ -44,15 +44,29 @@ export const performanceUtils = {
 
   // Get performance metrics
   getMetrics: () => {
-    if (typeof performance === 'undefined' || !performance.memory) {
+    if (typeof performance === 'undefined') {
+      return null;
+    }
+
+    // performance.memory is not in standard TypeScript lib but available in Chrome-based browsers
+    type PerformanceWithMemory = typeof performance & {
+      memory?: {
+        usedJSHeapSize: number;
+        totalJSHeapSize: number;
+        jsHeapSizeLimit: number;
+      };
+    };
+
+    const mem = (performance as PerformanceWithMemory).memory;
+    if (!mem) {
       return null;
     }
 
     return {
       memory: {
-        usedJSHeapSize: performance.memory.usedJSHeapSize,
-        totalJSHeapSize: performance.memory.totalJSHeapSize,
-        jsHeapSizeLimit: performance.memory.jsHeapSizeLimit,
+        usedJSHeapSize: mem.usedJSHeapSize,
+        totalJSHeapSize: mem.totalJSHeapSize,
+        jsHeapSizeLimit: mem.jsHeapSizeLimit,
       },
       navigation: performance.getEntriesByType('navigation')[0] as PerformanceNavigationTiming | undefined,
     };

package/src/presentation/hooks/useDebounce.ts

@@ -7,7 +7,7 @@ import { useState, useEffect, useRef, useCallback } from 'react';
 
 export function useDebounce<T>(value: T, delay: number = 500): T {
   const [debouncedValue, setDebouncedValue] = useState<T>(value);
-  const timeoutRef = useRef<number>();
+  const timeoutRef = useRef<number | null>(null);
 
   useEffect(() => {
     // Clear previous timeout
@@ -40,7 +40,7 @@ export function useThrottle<T extends (...args: any[]) => any>(
   delay: number = 300
 ): T {
   const lastRun = useRef<Date>(new Date());
-  const timeoutRef = useRef<number>();
+  const timeoutRef = useRef<number | null>(null);
 
   return useCallback((...args: Parameters<T>) => {
     const now = new Date();

package/src/presentation/organisms/Footer.tsx

@@ -22,7 +22,7 @@ export interface FooterProps extends HTMLAttributes<HTMLElement>, BaseProps {
 
 // Memoize social icon component to prevent unnecessary re-renders
 const SocialIcon = memo<{
-  item: FooterProps['social'][number];
+  item: NonNullable<FooterProps['social']>[number];
 }>(({ item }) => (
   <a
     href={item.href}

package/src/presentation/organisms/Modal.tsx

@@ -27,8 +27,8 @@ export const Modal = React.memo(forwardRef<HTMLDivElement, ModalProps>(
   ({ open = false, onClose, showCloseButton = true, size = 'md', className, children, ...props }, ref) => {
     const [shouldRender, setShouldRender] = useState(open);
     const [isAnimating, setIsAnimating] = useState(false);
-    const rafRef = useRef<number>();
-    const timerRef = useRef<number>();
+    const rafRef = useRef<number | null>(null);
+    const timerRef = useRef<number | null>(null);
 
     useEffect(() => {
       if (open) {