@planningcenter/topbar 12.4.0-rc.2 → 12.4.1

package/dist/topbar.umd.js

@@ -34670,12 +34670,15 @@ true;
         setLoadedPath(iframePath || "");
       }, [iframePath]);
       // A one-way channel for sending messages to picobot. Topbar just
-      // forwards the envelope to the iframe and holds no message semantics of
-      // its own—the consumer decides what to send and when.
+      // forwards the envelope to the iframe—the consumer decides what to send
+      // and when. The one exception is PANE_VISIBLE: Safari ignores focus()
+      // from inside a cross-origin iframe, so the host has to focus the iframe
+      // before picobot can focus its composer.
       React.useImperativeHandle(ref, () => ({
         postMessage(message) {
-          var _a, _b;
-          (_b = (_a = iframeRef.current) === null || _a === void 0 ? void 0 : _a.contentWindow) === null || _b === void 0 ? void 0 : _b.postMessage(message, picobotOrigin);
+          var _a, _b, _c;
+          if (message.type === "PANE_VISIBLE") (_a = iframeRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+          (_c = (_b = iframeRef.current) === null || _b === void 0 ? void 0 : _b.contentWindow) === null || _c === void 0 ? void 0 : _c.postMessage(message, picobotOrigin);
         }
       }), []);
       const iframeSrc = buildPicobotSrc(picobotOrigin, loadedPath, {
@@ -35418,6 +35421,7 @@ true;
     closeDrawer,
     currentPath,
     env,
+    isOpen,
     onChangePath,
     openTool,
     pending
@@ -35462,6 +35466,17 @@ true;
       }
       clearPending();
     }, [pending, isPicobotReady, clearPending]);
+    // The drawer keeps the iframe mounted while it's closed, so picobot's
+    // autofocus is spent by the time the panel reopens. READY gates the signal
+    // because picobot has no listener before it.
+    React.useEffect(function tellPicobotThePanelIsVisible() {
+      var _a;
+      if (isOpen && isPicobotReady) {
+        (_a = picobotRef.current) === null || _a === void 0 ? void 0 : _a.postMessage({
+          type: "PANE_VISIBLE"
+        });
+      }
+    }, [isOpen, isPicobotReady]);
     const [iframeErrored, setIframeErrored] = React.useState(false);
     const [mountKey, setMountKey] = React.useState(0);
     const handleRetry = React.useCallback(() => {
@@ -35978,6 +35993,11 @@ true;
   };
 
   const DURATION = 100;
+  const TOOLBAR_DRAWER_CHANGE_EVENT = "topbar:toolbar-drawer-change";
+  const CLOSED_TOOLBAR_DRAWER = {
+    open: false,
+    tool: null
+  };
   // Exempt paths match regardless of query, so `email?conversationId=…` is
   // exempt along with `email`.
   function isToolPathExemptFromStorage(toolName, path) {
@@ -36091,6 +36111,27 @@ true;
         delete window.openHelpdesk; /* TODO: Remove when products have migrated to window.topbar.openHelpdesk */
       };
     }, [Profile, openHelpdeskAtRoot]);
+    const toolbarDrawerTool = open && currentContent ? currentContent.name.toLowerCase() : null;
+    const lastToolbarDrawer = React.useRef(CLOSED_TOOLBAR_DRAWER);
+    React.useEffect(() => {
+      const toolbarDrawer = {
+        open,
+        tool: toolbarDrawerTool
+      };
+      window.topbar = window.topbar || {};
+      window.topbar.toolbarDrawer = toolbarDrawer;
+      const last = lastToolbarDrawer.current;
+      if (last.open !== toolbarDrawer.open || last.tool !== toolbarDrawer.tool) {
+        lastToolbarDrawer.current = toolbarDrawer;
+        window.dispatchEvent(new CustomEvent(TOOLBAR_DRAWER_CHANGE_EVENT, {
+          detail: toolbarDrawer
+        }));
+      }
+      return () => {
+        var _a;
+        (_a = window.topbar) === null || _a === void 0 ? true : delete _a.toolbarDrawer;
+      };
+    }, [open, toolbarDrawerTool]);
     const loginSettingsUrl = getLoginProfilePath({
       appName: appName.replace(/[\s-]/, ""),
       env: env,