@elementor/editor-app-bar 4.4.0-1064 → 4.4.0-1066

package/dist/index.mjs

@@ -766,15 +766,44 @@ function AppBar() {
 }
 
 // src/extensions/angie/hooks/use-action-props.ts
-import { useEffect as useEffect5 } from "react";
-import { isAngieAvailable } from "@elementor/editor-mcp";
+import { useEffect as useEffect6 } from "react";
 import { trackEvent } from "@elementor/events";
 import { AngieIcon } from "@elementor/icons";
 import { __ as __7 } from "@wordpress/i18n";
+
+// src/hooks/use-is-angie-available.ts
+import { useEffect as useEffect5, useState as useState5 } from "react";
+import { isAngieAvailable } from "@elementor/editor-mcp";
+function useIsAngieAvailable() {
+  const [available, setAvailable] = useState5(() => isAngieAvailable());
+  useEffect5(() => {
+    if (available) {
+      return;
+    }
+    if (isAngieAvailable()) {
+      setAvailable(true);
+      return;
+    }
+    const observer = new MutationObserver(() => {
+      if (isAngieAvailable()) {
+        observer.disconnect();
+        setAvailable(true);
+      }
+    });
+    observer.observe(document.body, {
+      childList: true,
+      subtree: true
+    });
+    return () => observer.disconnect();
+  }, [available]);
+  return available;
+}
+
+// src/extensions/angie/hooks/use-action-props.ts
 function useActionProps() {
-  const hasAngieInstalled = isAngieAvailable();
+  const hasAngieInstalled = useIsAngieAvailable();
   const visible = !hasAngieInstalled;
-  useEffect5(() => {
+  useEffect6(() => {
     if (!visible) {
       return;
     }