@elementor/editor-app-bar 4.4.0-1065 → 4.4.0-1067

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;
     }
@@ -1424,25 +1453,43 @@ function init8() {
 }
 
 // src/extensions/help/hooks/use-action-props.ts
+import { isAngieAvailable as isAngieAvailable2, openAngieInAskMode } from "@elementor/editor-mcp";
 import { HelpIcon } from "@elementor/icons";
 import { __ as __20 } from "@wordpress/i18n";
+var HELP_CENTER_URL = "https://go.elementor.com/editor-top-bar-learn/";
+var HELP_CENTER_ANGIE_PROMPT = `${__20("Help me with", "elementor")} `;
+var dispatchHelpClickEvent = () => {
+  const extendedWindow = window;
+  const config = extendedWindow?.elementorCommon?.eventsManager?.config;
+  if (config) {
+    extendedWindow.elementorCommon.eventsManager.dispatchEvent(config.names.topBar.help, {
+      location: config.locations.topBar,
+      secondaryLocation: config.secondaryLocations.help,
+      trigger: config.triggers.click,
+      element: config.elements.buttonIcon
+    });
+  }
+};
 function useActionProps6() {
+  const hasAngieActive = isAngieAvailable2();
+  if (hasAngieActive) {
+    return {
+      title: __20("Help Center", "elementor"),
+      icon: HelpIcon,
+      onClick: (event) => {
+        event.preventDefault();
+        dispatchHelpClickEvent();
+        openAngieInAskMode(HELP_CENTER_ANGIE_PROMPT);
+      }
+    };
+  }
   return {
     title: __20("Help Center", "elementor"),
-    href: "https://go.elementor.com/editor-top-bar-learn/",
+    href: HELP_CENTER_URL,
     icon: HelpIcon,
     target: "_blank",
     onClick: () => {
-      const extendedWindow = window;
-      const config = extendedWindow?.elementorCommon?.eventsManager?.config;
-      if (config) {
-        extendedWindow.elementorCommon.eventsManager.dispatchEvent(config.names.topBar.help, {
-          location: config.locations.topBar,
-          secondaryLocation: config.secondaryLocations.help,
-          trigger: config.triggers.click,
-          element: config.elements.buttonIcon
-        });
-      }
+      dispatchHelpClickEvent();
     }
   };
 }