viconic-react-icons 1.3.0 → 1.4.0

package/dist/index.js

@@ -2061,11 +2061,7 @@ var ViconicIcon = ({ name, className, style, size, color, ...props }) => {
       el._u();
     }
     if (isInjected()) return;
-    const delays = [50, 100, 200, 400, 800, 500, 500, 500, 500, 500, 500, 500];
-    let attempt = 0;
-    let timerId = null;
-    let reloadTriggered = false;
-    function tryInject() {
+    function tryInjectFromEvent() {
       if (isInjected()) return;
       const W = window.__viconic;
       if (W && W.icons) {
@@ -2081,8 +2077,12 @@ var ViconicIcon = ({ name, className, style, size, color, ...props }) => {
       if (!isKitIcon && window.CopyIcons && window.CopyIcons.forceProcess) {
         window.CopyIcons.forceProcess(el);
       }
-      if (isKitIcon && !reloadTriggered && attempt >= 4 && prefixMatch) {
-        reloadTriggered = true;
+    }
+    document.addEventListener("viconic:ready", tryInjectFromEvent);
+    const fallbackTimer = setTimeout(() => {
+      if (isInjected()) return;
+      tryInjectFromEvent();
+      if (!isInjected() && isKitIcon && prefixMatch) {
         const prefix = prefixMatch[1];
         if (window.CopyIconsKit) {
           for (const kId in window.CopyIconsKit) {
@@ -2094,15 +2094,10 @@ var ViconicIcon = ({ name, className, style, size, color, ...props }) => {
           }
         }
       }
-      if (isInjected()) return;
-      attempt++;
-      if (attempt < delays.length) {
-        timerId = setTimeout(tryInject, delays[attempt]);
-      }
-    }
-    timerId = setTimeout(tryInject, delays[0]);
+    }, 500);
     return () => {
-      if (timerId) clearTimeout(timerId);
+      document.removeEventListener("viconic:ready", tryInjectFromEvent);
+      clearTimeout(fallbackTimer);
     };
   }, [name, className, size, color, style]);
   const combinedStyle = {

package/dist/index.mjs

@@ -2026,11 +2026,7 @@ var ViconicIcon = ({ name, className, style, size, color, ...props }) => {
       el._u();
     }
     if (isInjected()) return;
-    const delays = [50, 100, 200, 400, 800, 500, 500, 500, 500, 500, 500, 500];
-    let attempt = 0;
-    let timerId = null;
-    let reloadTriggered = false;
-    function tryInject() {
+    function tryInjectFromEvent() {
       if (isInjected()) return;
       const W = window.__viconic;
       if (W && W.icons) {
@@ -2046,8 +2042,12 @@ var ViconicIcon = ({ name, className, style, size, color, ...props }) => {
       if (!isKitIcon && window.CopyIcons && window.CopyIcons.forceProcess) {
         window.CopyIcons.forceProcess(el);
       }
-      if (isKitIcon && !reloadTriggered && attempt >= 4 && prefixMatch) {
-        reloadTriggered = true;
+    }
+    document.addEventListener("viconic:ready", tryInjectFromEvent);
+    const fallbackTimer = setTimeout(() => {
+      if (isInjected()) return;
+      tryInjectFromEvent();
+      if (!isInjected() && isKitIcon && prefixMatch) {
         const prefix = prefixMatch[1];
         if (window.CopyIconsKit) {
           for (const kId in window.CopyIconsKit) {
@@ -2059,15 +2059,10 @@ var ViconicIcon = ({ name, className, style, size, color, ...props }) => {
           }
         }
       }
-      if (isInjected()) return;
-      attempt++;
-      if (attempt < delays.length) {
-        timerId = setTimeout(tryInject, delays[attempt]);
-      }
-    }
-    timerId = setTimeout(tryInject, delays[0]);
+    }, 500);
     return () => {
-      if (timerId) clearTimeout(timerId);
+      document.removeEventListener("viconic:ready", tryInjectFromEvent);
+      clearTimeout(fallbackTimer);
     };
   }, [name, className, size, color, style]);
   const combinedStyle = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "viconic-react-icons",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "description": "Viconic Smart Icons loader for React — supports Kit and 200k+ system icons",
   "main": "dist/index.js",
   "module": "dist/index.mjs",

package/src/index.jsx

@@ -145,18 +145,10 @@ export const ViconicIcon = ({ name, className, style, size, color, ...props }) =
 
         if (isInjected()) return;
 
-        // --- PATH 4: Fallback retry — kit loader script may still be loading async ---
-        // Use short exponential backoff: 50ms, 100ms, 200ms, 400ms, 800ms, then every 500ms
-        // Max 8 seconds total. Much cheaper than 100 × 100ms polling.
-        const delays = [50, 100, 200, 400, 800, 500, 500, 500, 500, 500, 500, 500];
-        let attempt = 0;
-        let timerId = null;
-        let reloadTriggered = false;
-
-        function tryInject() {
+        // --- PATH 4: Event-driven — listen for viconic:ready fired by kit loader after register() ---
+        // Much faster than polling: icons appear the instant the loader finishes fetching them.
+        function tryInjectFromEvent() {
             if (isInjected()) return;
-
-            // Try W.icons again (kit may have loaded by now)
             const W = window.__viconic;
             if (W && W.icons) {
                 const iconBaseName = prefixMatch ? prefixMatch[2] : null;
@@ -169,16 +161,20 @@ export const ViconicIcon = ({ name, className, style, size, color, ...props }) =
                     return;
                 }
             }
-
-            // Try custom element _u()
             if (el._u) el._u();
             if (!isKitIcon && window.CopyIcons && window.CopyIcons.forceProcess) {
                 window.CopyIcons.forceProcess(el);
             }
+        }
 
-            // Trigger kit reload once if still not loaded after ~1s
-            if (isKitIcon && !reloadTriggered && attempt >= 4 && prefixMatch) {
-                reloadTriggered = true;
+        document.addEventListener('viconic:ready', tryInjectFromEvent);
+
+        // --- PATH 5: Short-deadline fallback (500ms) in case script already fired before we listened ---
+        const fallbackTimer = setTimeout(() => {
+            if (isInjected()) return;
+            tryInjectFromEvent();
+            // If still not loaded after 500ms, trigger kit reload once
+            if (!isInjected() && isKitIcon && prefixMatch) {
                 const prefix = prefixMatch[1];
                 if (window.CopyIconsKit) {
                     for (const kId in window.CopyIconsKit) {
@@ -190,17 +186,12 @@ export const ViconicIcon = ({ name, className, style, size, color, ...props }) =
                     }
                 }
             }
+        }, 500);
 
-            if (isInjected()) return;
-
-            attempt++;
-            if (attempt < delays.length) {
-                timerId = setTimeout(tryInject, delays[attempt]);
-            }
-        }
-
-        timerId = setTimeout(tryInject, delays[0]);
-        return () => { if (timerId) clearTimeout(timerId); };
+        return () => {
+            document.removeEventListener('viconic:ready', tryInjectFromEvent);
+            clearTimeout(fallbackTimer);
+        };
     }, [name, className, size, color, style]);
 
     const combinedStyle = {