@ai-stack/payloadcms 3.68.0 → 3.76.0-beta.1

package/dist/ui/Compose/hooks/menu/TranslateMenu.js

@@ -1,12 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import locales from 'locale-codes';
-import React, { memo, useState } from 'react';
+import React, { memo, useEffect, useRef, useState } from 'react';
 import { useInstructions } from '../../../../providers/InstructionsProvider/useInstructions.js';
 import { Item } from './Item.js';
 import { Translate } from './items.js';
 import styles from './menu.module.scss';
 export const TranslateMenu = ({ onClick })=>{
     const [show, setShow] = useState(false);
+    const closeTimeoutRef = useRef(null);
     const { enabledLanguages = [] } = useInstructions();
     let filteredLocales = locales.all.filter((a)=>{
         return a.tag && a.location;
@@ -16,11 +17,48 @@ export const TranslateMenu = ({ onClick })=>{
     }
     const [languages, setLanguages] = useState(filteredLocales);
     const [inputFocus, setInputFocus] = useState(false);
+    useEffect(()=>{
+        if (!show) {
+            if (typeof window !== 'undefined') {
+                window.__AI_MENU_INTERACTIVE = false;
+            }
+        }
+        return ()=>{
+            if (closeTimeoutRef.current) {
+                clearTimeout(closeTimeoutRef.current);
+            }
+            if (show && typeof window !== 'undefined') {
+                window.__AI_MENU_INTERACTIVE = false;
+            }
+        };
+    }, [
+        show
+    ]);
     return /*#__PURE__*/ _jsxs("div", {
-        className: styles.menu,
+        className: `${styles.menu} ai-interactive-menu`,
+        "data-ai-interactive": "true",
+        onBlur: (e)=>{
+            // Only clear if focus moves outside the menu container
+            if (!e.currentTarget.contains(e.relatedTarget)) {
+                if (typeof window !== 'undefined') window.__AI_MENU_INTERACTIVE = false;
+            }
+        },
+        onFocus: ()=>{
+            if (typeof window !== 'undefined') window.__AI_MENU_INTERACTIVE = true;
+        },
+        onMouseEnter: ()=>{
+            if (closeTimeoutRef.current) {
+                clearTimeout(closeTimeoutRef.current);
+                closeTimeoutRef.current = null;
+            }
+            if (typeof window !== 'undefined') window.__AI_MENU_INTERACTIVE = true;
+        },
         onMouseLeave: ()=>{
+            if (typeof window !== 'undefined') window.__AI_MENU_INTERACTIVE = false;
             if (!inputFocus) {
-                setShow(false);
+                closeTimeoutRef.current = setTimeout(()=>{
+                    setShow(false);
+                }, 400);
             }
         },
         children: [
@@ -49,7 +87,8 @@ export const TranslateMenu = ({ onClick })=>{
                                 top: 0
                             },
                             children: /*#__PURE__*/ _jsx("input", {
-                                className: styles.menuInput,
+                                className: `${styles.menuInput} ai-interactive-menu`,
+                                "data-ai-interactive": "true",
                                 onBlur: ()=>setInputFocus(false),
                                 onChange: (event)=>{
                                     const value = event.target.value;
@@ -64,6 +103,8 @@ export const TranslateMenu = ({ onClick })=>{
                         }),
                         languages.map((locale)=>{
                             return /*#__PURE__*/ _jsx(Item, {
+                                className: "ai-interactive-menu",
+                                "data-ai-interactive": "true",
                                 onClick: ()=>{
                                     onClick({
                                         locale: locale.tag

package/dist/ui/Compose/hooks/menu/TranslateMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/ui/Compose/hooks/menu/TranslateMenu.tsx"],"sourcesContent":["import locales from 'locale-codes'\nimport React, { memo, useState } from 'react'\n\nimport { useInstructions } from '../../../../providers/InstructionsProvider/useInstructions.js'\nimport { Item } from './Item.js'\nimport { Translate } from './items.js'\nimport styles from './menu.module.scss'\n\nexport const TranslateMenu = ({ onClick }: { onClick: (data: { locale: string }) => void }) => {\n  const [show, setShow] = useState(false)\n\n  const { enabledLanguages = [] } = useInstructions()\n\n  let filteredLocales = locales.all.filter((a) => {\n    return a.tag && a.location\n  })\n\n  if (enabledLanguages?.length) {\n    filteredLocales = filteredLocales.filter((a) => enabledLanguages?.includes(a.tag))\n  }\n\n  const [languages, setLanguages] = useState(filteredLocales)\n  const [inputFocus, setInputFocus] = useState(false)\n\n  return (\n    <div\n      className={styles.menu}\n      onMouseLeave={() => {\n        if (!inputFocus) {\n          setShow(false)\n        }\n      }}\n    >\n      <Translate\n        isActive={show}\n        isMenu\n        onClick={() => {\n          setShow(!show)\n        }}\n      />\n      <div className={styles.hoverMenu} data-show={show}>\n        <div\n          className={`${styles.menu} ${styles.subMenu}`}\n          style={{\n            background: 'var(--popup-bg)',\n            // minHeight: '300px',\n          }}\n        >\n          <Item\n            onClick={() => {}}\n            style={{\n              background: 'transparent',\n              padding: '0 0 5px 0',\n              position: 'sticky',\n              top: 0,\n            }}\n          >\n            <input\n              className={styles.menuInput}\n              onBlur={() => setInputFocus(false)}\n              onChange={(event) => {\n                const value = event.target.value\n                setLanguages(\n                  filteredLocales.filter((l) => {\n                    const lowerCaseValue = value.toLowerCase()\n                    return (\n                      l.name.toLowerCase().startsWith(lowerCaseValue) ||\n                      (l.location && l.location.toLowerCase().startsWith(lowerCaseValue)) ||\n                      l.tag.toLowerCase().startsWith(lowerCaseValue)\n                    )\n                  }),\n                )\n              }}\n              onFocus={() => setInputFocus(true)}\n              placeholder=\"Search...\"\n            />\n          </Item>\n          {languages.map((locale) => {\n            return (\n              <Item\n                key={locale.tag}\n                onClick={() => {\n                  onClick({ locale: locale.tag })\n                }}\n              >\n                <span className={styles.ellipsis}>{`${locale.location} (${locale.tag})`}</span>\n              </Item>\n            )\n          })}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport const MemoizedTranslateMenu = memo(TranslateMenu)\n"],"names":["locales","React","memo","useState","useInstructions","Item","Translate","styles","TranslateMenu","onClick","show","setShow","enabledLanguages","filteredLocales","all","filter","a","tag","location","length","includes","languages","setLanguages","inputFocus","setInputFocus","div","className","menu","onMouseLeave","isActive","isMenu","hoverMenu","data-show","subMenu","style","background","padding","position","top","input","menuInput","onBlur","onChange","event","value","target","l","lowerCaseValue","toLowerCase","name","startsWith","onFocus","placeholder","map","locale","span","ellipsis","MemoizedTranslateMenu"],"mappings":";AAAA,OAAOA,aAAa,eAAc;AAClC,OAAOC,SAASC,IAAI,EAAEC,QAAQ,QAAQ,QAAO;AAE7C,SAASC,eAAe,QAAQ,gEAA+D;AAC/F,SAASC,IAAI,QAAQ,YAAW;AAChC,SAASC,SAAS,QAAQ,aAAY;AACtC,OAAOC,YAAY,qBAAoB;AAEvC,OAAO,MAAMC,gBAAgB,CAAC,EAAEC,OAAO,EAAmD;IACxF,MAAM,CAACC,MAAMC,QAAQ,GAAGR,SAAS;IAEjC,MAAM,EAAES,mBAAmB,EAAE,EAAE,GAAGR;IAElC,IAAIS,kBAAkBb,QAAQc,GAAG,CAACC,MAAM,CAAC,CAACC;QACxC,OAAOA,EAAEC,GAAG,IAAID,EAAEE,QAAQ;IAC5B;IAEA,IAAIN,kBAAkBO,QAAQ;QAC5BN,kBAAkBA,gBAAgBE,MAAM,CAAC,CAACC,IAAMJ,kBAAkBQ,SAASJ,EAAEC,GAAG;IAClF;IAEA,MAAM,CAACI,WAAWC,aAAa,GAAGnB,SAASU;IAC3C,MAAM,CAACU,YAAYC,cAAc,GAAGrB,SAAS;IAE7C,qBACE,MAACsB;QACCC,WAAWnB,OAAOoB,IAAI;QACtBC,cAAc;YACZ,IAAI,CAACL,YAAY;gBACfZ,QAAQ;YACV;QACF;;0BAEA,KAACL;gBACCuB,UAAUnB;gBACVoB,MAAM;gBACNrB,SAAS;oBACPE,QAAQ,CAACD;gBACX;;0BAEF,KAACe;gBAAIC,WAAWnB,OAAOwB,SAAS;gBAAEC,aAAWtB;0BAC3C,cAAA,MAACe;oBACCC,WAAW,CAAC,EAAEnB,OAAOoB,IAAI,CAAC,CAAC,EAAEpB,OAAO0B,OAAO,CAAC,CAAC;oBAC7CC,OAAO;wBACLC,YAAY;oBAEd;;sCAEA,KAAC9B;4BACCI,SAAS,KAAO;4BAChByB,OAAO;gCACLC,YAAY;gCACZC,SAAS;gCACTC,UAAU;gCACVC,KAAK;4BACP;sCAEA,cAAA,KAACC;gCACCb,WAAWnB,OAAOiC,SAAS;gCAC3BC,QAAQ,IAAMjB,cAAc;gCAC5BkB,UAAU,CAACC;oCACT,MAAMC,QAAQD,MAAME,MAAM,CAACD,KAAK;oCAChCtB,aACET,gBAAgBE,MAAM,CAAC,CAAC+B;wCACtB,MAAMC,iBAAiBH,MAAMI,WAAW;wCACxC,OACEF,EAAEG,IAAI,CAACD,WAAW,GAAGE,UAAU,CAACH,mBAC/BD,EAAE5B,QAAQ,IAAI4B,EAAE5B,QAAQ,CAAC8B,WAAW,GAAGE,UAAU,CAACH,mBACnDD,EAAE7B,GAAG,CAAC+B,WAAW,GAAGE,UAAU,CAACH;oCAEnC;gCAEJ;gCACAI,SAAS,IAAM3B,cAAc;gCAC7B4B,aAAY;;;wBAGf/B,UAAUgC,GAAG,CAAC,CAACC;4BACd,qBACE,KAACjD;gCAECI,SAAS;oCACPA,QAAQ;wCAAE6C,QAAQA,OAAOrC,GAAG;oCAAC;gCAC/B;0CAEA,cAAA,KAACsC;oCAAK7B,WAAWnB,OAAOiD,QAAQ;8CAAG,CAAC,EAAEF,OAAOpC,QAAQ,CAAC,EAAE,EAAEoC,OAAOrC,GAAG,CAAC,CAAC,CAAC;;+BALlEqC,OAAOrC,GAAG;wBAQrB;;;;;;AAKV,EAAC;AAED,OAAO,MAAMwC,sCAAwBvD,KAAKM,eAAc"}
+{"version":3,"sources":["../../../../../src/ui/Compose/hooks/menu/TranslateMenu.tsx"],"sourcesContent":["import locales from 'locale-codes'\nimport React, { memo, useEffect, useRef, useState } from 'react'\n\nimport { useInstructions } from '../../../../providers/InstructionsProvider/useInstructions.js'\nimport { Item } from './Item.js'\nimport { Translate } from './items.js'\nimport styles from './menu.module.scss'\n\ndeclare global {\n  interface Window {\n    __AI_MENU_INTERACTIVE?: boolean\n  }\n}\n\nexport const TranslateMenu = ({ onClick }: { onClick: (data: { locale: string }) => void }) => {\n  const [show, setShow] = useState(false)\n  const closeTimeoutRef = useRef<NodeJS.Timeout | null>(null)\n\n  const { enabledLanguages = [] } = useInstructions()\n\n  let filteredLocales = locales.all.filter((a) => {\n    return a.tag && a.location\n  })\n\n  if (enabledLanguages?.length) {\n    filteredLocales = filteredLocales.filter((a) => enabledLanguages?.includes(a.tag))\n  }\n\n  const [languages, setLanguages] = useState(filteredLocales)\n  const [inputFocus, setInputFocus] = useState(false)\n\n  useEffect(() => {\n    if (!show) {\n      if (typeof window !== 'undefined') {\n        window.__AI_MENU_INTERACTIVE = false\n      }\n    }\n    return () => {\n      if (closeTimeoutRef.current) {\n        clearTimeout(closeTimeoutRef.current)\n      }\n      if (show && typeof window !== 'undefined') {\n        window.__AI_MENU_INTERACTIVE = false\n      }\n    }\n  }, [show])\n\n  return (\n    <div\n      className={`${styles.menu} ai-interactive-menu`}\n      data-ai-interactive=\"true\"\n      onBlur={(e) => {\n        // Only clear if focus moves outside the menu container\n        if (!e.currentTarget.contains(e.relatedTarget as Node)) {\n          if (typeof window !== 'undefined') window.__AI_MENU_INTERACTIVE = false\n        }\n      }}\n      onFocus={() => {\n        if (typeof window !== 'undefined') window.__AI_MENU_INTERACTIVE = true\n      }}\n      onMouseEnter={() => {\n        if (closeTimeoutRef.current) {\n          clearTimeout(closeTimeoutRef.current)\n          closeTimeoutRef.current = null\n        }\n        if (typeof window !== 'undefined') window.__AI_MENU_INTERACTIVE = true\n      }}\n      onMouseLeave={() => {\n        if (typeof window !== 'undefined') window.__AI_MENU_INTERACTIVE = false\n        if (!inputFocus) {\n          closeTimeoutRef.current = setTimeout(() => {\n            setShow(false)\n          }, 400)\n        }\n      }}\n    >\n      <Translate\n        isActive={show}\n        isMenu\n        onClick={() => {\n          setShow(!show)\n        }}\n      />\n      <div className={styles.hoverMenu} data-show={show}>\n        <div\n          className={`${styles.menu} ${styles.subMenu}`}\n          style={{\n            background: 'var(--popup-bg)',\n            // minHeight: '300px',\n          }}\n        >\n          <Item\n            onClick={() => {}}\n            style={{\n              background: 'transparent',\n              padding: '0 0 5px 0',\n              position: 'sticky',\n              top: 0,\n            }}\n          >\n            <input\n              className={`${styles.menuInput} ai-interactive-menu`}\n              data-ai-interactive=\"true\"\n              onBlur={() => setInputFocus(false)}\n              onChange={(event) => {\n                const value = event.target.value\n                setLanguages(\n                  filteredLocales.filter((l) => {\n                    const lowerCaseValue = value.toLowerCase()\n                    return (\n                      l.name.toLowerCase().startsWith(lowerCaseValue) ||\n                      (l.location && l.location.toLowerCase().startsWith(lowerCaseValue)) ||\n                      l.tag.toLowerCase().startsWith(lowerCaseValue)\n                    )\n                  }),\n                )\n              }}\n              onFocus={() => setInputFocus(true)}\n              placeholder=\"Search...\"\n            />\n          </Item>\n          {languages.map((locale) => {\n            return (\n              <Item\n                className=\"ai-interactive-menu\"\n                data-ai-interactive=\"true\"\n                key={locale.tag}\n                onClick={() => {\n                  onClick({ locale: locale.tag })\n                }}\n              >\n                <span className={styles.ellipsis}>{`${locale.location} (${locale.tag})`}</span>\n              </Item>\n            )\n          })}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport const MemoizedTranslateMenu = memo(TranslateMenu)\n"],"names":["locales","React","memo","useEffect","useRef","useState","useInstructions","Item","Translate","styles","TranslateMenu","onClick","show","setShow","closeTimeoutRef","enabledLanguages","filteredLocales","all","filter","a","tag","location","length","includes","languages","setLanguages","inputFocus","setInputFocus","window","__AI_MENU_INTERACTIVE","current","clearTimeout","div","className","menu","data-ai-interactive","onBlur","e","currentTarget","contains","relatedTarget","onFocus","onMouseEnter","onMouseLeave","setTimeout","isActive","isMenu","hoverMenu","data-show","subMenu","style","background","padding","position","top","input","menuInput","onChange","event","value","target","l","lowerCaseValue","toLowerCase","name","startsWith","placeholder","map","locale","span","ellipsis","MemoizedTranslateMenu"],"mappings":";AAAA,OAAOA,aAAa,eAAc;AAClC,OAAOC,SAASC,IAAI,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,QAAO;AAEhE,SAASC,eAAe,QAAQ,gEAA+D;AAC/F,SAASC,IAAI,QAAQ,YAAW;AAChC,SAASC,SAAS,QAAQ,aAAY;AACtC,OAAOC,YAAY,qBAAoB;AAQvC,OAAO,MAAMC,gBAAgB,CAAC,EAAEC,OAAO,EAAmD;IACxF,MAAM,CAACC,MAAMC,QAAQ,GAAGR,SAAS;IACjC,MAAMS,kBAAkBV,OAA8B;IAEtD,MAAM,EAAEW,mBAAmB,EAAE,EAAE,GAAGT;IAElC,IAAIU,kBAAkBhB,QAAQiB,GAAG,CAACC,MAAM,CAAC,CAACC;QACxC,OAAOA,EAAEC,GAAG,IAAID,EAAEE,QAAQ;IAC5B;IAEA,IAAIN,kBAAkBO,QAAQ;QAC5BN,kBAAkBA,gBAAgBE,MAAM,CAAC,CAACC,IAAMJ,kBAAkBQ,SAASJ,EAAEC,GAAG;IAClF;IAEA,MAAM,CAACI,WAAWC,aAAa,GAAGpB,SAASW;IAC3C,MAAM,CAACU,YAAYC,cAAc,GAAGtB,SAAS;IAE7CF,UAAU;QACR,IAAI,CAACS,MAAM;YACT,IAAI,OAAOgB,WAAW,aAAa;gBACjCA,OAAOC,qBAAqB,GAAG;YACjC;QACF;QACA,OAAO;YACL,IAAIf,gBAAgBgB,OAAO,EAAE;gBAC3BC,aAAajB,gBAAgBgB,OAAO;YACtC;YACA,IAAIlB,QAAQ,OAAOgB,WAAW,aAAa;gBACzCA,OAAOC,qBAAqB,GAAG;YACjC;QACF;IACF,GAAG;QAACjB;KAAK;IAET,qBACE,MAACoB;QACCC,WAAW,CAAC,EAAExB,OAAOyB,IAAI,CAAC,oBAAoB,CAAC;QAC/CC,uBAAoB;QACpBC,QAAQ,CAACC;YACP,uDAAuD;YACvD,IAAI,CAACA,EAAEC,aAAa,CAACC,QAAQ,CAACF,EAAEG,aAAa,GAAW;gBACtD,IAAI,OAAOZ,WAAW,aAAaA,OAAOC,qBAAqB,GAAG;YACpE;QACF;QACAY,SAAS;YACP,IAAI,OAAOb,WAAW,aAAaA,OAAOC,qBAAqB,GAAG;QACpE;QACAa,cAAc;YACZ,IAAI5B,gBAAgBgB,OAAO,EAAE;gBAC3BC,aAAajB,gBAAgBgB,OAAO;gBACpChB,gBAAgBgB,OAAO,GAAG;YAC5B;YACA,IAAI,OAAOF,WAAW,aAAaA,OAAOC,qBAAqB,GAAG;QACpE;QACAc,cAAc;YACZ,IAAI,OAAOf,WAAW,aAAaA,OAAOC,qBAAqB,GAAG;YAClE,IAAI,CAACH,YAAY;gBACfZ,gBAAgBgB,OAAO,GAAGc,WAAW;oBACnC/B,QAAQ;gBACV,GAAG;YACL;QACF;;0BAEA,KAACL;gBACCqC,UAAUjC;gBACVkC,MAAM;gBACNnC,SAAS;oBACPE,QAAQ,CAACD;gBACX;;0BAEF,KAACoB;gBAAIC,WAAWxB,OAAOsC,SAAS;gBAAEC,aAAWpC;0BAC3C,cAAA,MAACoB;oBACCC,WAAW,CAAC,EAAExB,OAAOyB,IAAI,CAAC,CAAC,EAAEzB,OAAOwC,OAAO,CAAC,CAAC;oBAC7CC,OAAO;wBACLC,YAAY;oBAEd;;sCAEA,KAAC5C;4BACCI,SAAS,KAAO;4BAChBuC,OAAO;gCACLC,YAAY;gCACZC,SAAS;gCACTC,UAAU;gCACVC,KAAK;4BACP;sCAEA,cAAA,KAACC;gCACCtB,WAAW,CAAC,EAAExB,OAAO+C,SAAS,CAAC,oBAAoB,CAAC;gCACpDrB,uBAAoB;gCACpBC,QAAQ,IAAMT,cAAc;gCAC5B8B,UAAU,CAACC;oCACT,MAAMC,QAAQD,MAAME,MAAM,CAACD,KAAK;oCAChClC,aACET,gBAAgBE,MAAM,CAAC,CAAC2C;wCACtB,MAAMC,iBAAiBH,MAAMI,WAAW;wCACxC,OACEF,EAAEG,IAAI,CAACD,WAAW,GAAGE,UAAU,CAACH,mBAC/BD,EAAExC,QAAQ,IAAIwC,EAAExC,QAAQ,CAAC0C,WAAW,GAAGE,UAAU,CAACH,mBACnDD,EAAEzC,GAAG,CAAC2C,WAAW,GAAGE,UAAU,CAACH;oCAEnC;gCAEJ;gCACArB,SAAS,IAAMd,cAAc;gCAC7BuC,aAAY;;;wBAGf1C,UAAU2C,GAAG,CAAC,CAACC;4BACd,qBACE,KAAC7D;gCACC0B,WAAU;gCACVE,uBAAoB;gCAEpBxB,SAAS;oCACPA,QAAQ;wCAAEyD,QAAQA,OAAOhD,GAAG;oCAAC;gCAC/B;0CAEA,cAAA,KAACiD;oCAAKpC,WAAWxB,OAAO6D,QAAQ;8CAAG,CAAC,EAAEF,OAAO/C,QAAQ,CAAC,EAAE,EAAE+C,OAAOhD,GAAG,CAAC,CAAC,CAAC;;+BALlEgD,OAAOhD,GAAG;wBAQrB;;;;;;AAKV,EAAC;AAED,OAAO,MAAMmD,sCAAwBrE,KAAKQ,eAAc"}

package/dist/ui/Compose/hooks/menu/TranslateMenu.jsx

@@ -1,11 +1,12 @@
 import locales from 'locale-codes';
-import React, { memo, useState } from 'react';
+import React, { memo, useEffect, useRef, useState } from 'react';
 import { useInstructions } from '../../../../providers/InstructionsProvider/useInstructions.js';
 import { Item } from './Item.js';
 import { Translate } from './items.js';
 import styles from './menu.module.scss';
 export const TranslateMenu = ({ onClick }) => {
     const [show, setShow] = useState(false);
+    const closeTimeoutRef = useRef(null);
     const { enabledLanguages = [] } = useInstructions();
     let filteredLocales = locales.all.filter((a) => {
         return a.tag && a.location;
@@ -15,9 +16,44 @@ export const TranslateMenu = ({ onClick }) => {
     }
     const [languages, setLanguages] = useState(filteredLocales);
     const [inputFocus, setInputFocus] = useState(false);
-    return (<div className={styles.menu} onMouseLeave={() => {
+    useEffect(() => {
+        if (!show) {
+            if (typeof window !== 'undefined') {
+                window.__AI_MENU_INTERACTIVE = false;
+            }
+        }
+        return () => {
+            if (closeTimeoutRef.current) {
+                clearTimeout(closeTimeoutRef.current);
+            }
+            if (show && typeof window !== 'undefined') {
+                window.__AI_MENU_INTERACTIVE = false;
+            }
+        };
+    }, [show]);
+    return (<div className={`${styles.menu} ai-interactive-menu`} data-ai-interactive="true" onBlur={(e) => {
+            // Only clear if focus moves outside the menu container
+            if (!e.currentTarget.contains(e.relatedTarget)) {
+                if (typeof window !== 'undefined')
+                    window.__AI_MENU_INTERACTIVE = false;
+            }
+        }} onFocus={() => {
+            if (typeof window !== 'undefined')
+                window.__AI_MENU_INTERACTIVE = true;
+        }} onMouseEnter={() => {
+            if (closeTimeoutRef.current) {
+                clearTimeout(closeTimeoutRef.current);
+                closeTimeoutRef.current = null;
+            }
+            if (typeof window !== 'undefined')
+                window.__AI_MENU_INTERACTIVE = true;
+        }} onMouseLeave={() => {
+            if (typeof window !== 'undefined')
+                window.__AI_MENU_INTERACTIVE = false;
             if (!inputFocus) {
-                setShow(false);
+                closeTimeoutRef.current = setTimeout(() => {
+                    setShow(false);
+                }, 400);
             }
         }}>
       <Translate isActive={show} isMenu onClick={() => {
@@ -34,7 +70,7 @@ export const TranslateMenu = ({ onClick }) => {
             position: 'sticky',
             top: 0,
         }}>
-            <input className={styles.menuInput} onBlur={() => setInputFocus(false)} onChange={(event) => {
+            <input className={`${styles.menuInput} ai-interactive-menu`} data-ai-interactive="true" onBlur={() => setInputFocus(false)} onChange={(event) => {
             const value = event.target.value;
             setLanguages(filteredLocales.filter((l) => {
                 const lowerCaseValue = value.toLowerCase();
@@ -45,7 +81,7 @@ export const TranslateMenu = ({ onClick }) => {
         }} onFocus={() => setInputFocus(true)} placeholder="Search..."/>
           </Item>
           {languages.map((locale) => {
-            return (<Item key={locale.tag} onClick={() => {
+            return (<Item className="ai-interactive-menu" data-ai-interactive="true" key={locale.tag} onClick={() => {
                     onClick({ locale: locale.tag });
                 }}>
                 <span className={styles.ellipsis}>{`${locale.location} (${locale.tag})`}</span>

package/dist/ui/Compose/hooks/menu/itemsMap.js

@@ -5,7 +5,8 @@ export const menuItemsMap = [
         name: 'Proofread',
         component: Proofread,
         excludedFor: [
-            'upload'
+            'upload',
+            'array'
         ],
         loadingText: 'Proofreading'
     },
@@ -13,7 +14,8 @@ export const menuItemsMap = [
         name: 'Rephrase',
         component: Rephrase,
         excludedFor: [
-            'upload'
+            'upload',
+            'array'
         ],
         loadingText: 'Rephrasing'
     },
@@ -21,7 +23,8 @@ export const menuItemsMap = [
         name: 'Translate',
         component: MemoizedTranslateMenu,
         excludedFor: [
-            'upload'
+            'upload',
+            'array'
         ],
         loadingText: 'Translating'
     },
@@ -30,7 +33,8 @@ export const menuItemsMap = [
         component: Expand,
         excludedFor: [
             'upload',
-            'text'
+            'text',
+            'array'
         ],
         loadingText: 'Expanding'
     },
@@ -41,7 +45,8 @@ export const menuItemsMap = [
         excludedFor: [
             'upload',
             'text',
-            'richText'
+            'richText',
+            'array'
         ],
         loadingText: 'Summarizing'
     },
@@ -49,7 +54,8 @@ export const menuItemsMap = [
         name: 'Simplify',
         component: Simplify,
         excludedFor: [
-            'upload'
+            'upload',
+            'array'
         ],
         loadingText: 'Simplifying'
     },

package/dist/ui/Compose/hooks/menu/itemsMap.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/ui/Compose/hooks/menu/itemsMap.ts"],"sourcesContent":["import type React from 'react'\n\nimport type { ActionMenuItems, BaseItemProps } from '../../../../types.js'\n\nimport { Compose, Expand, Proofread, Rephrase, Settings, Simplify, Summarize } from './items.js'\nimport { MemoizedTranslateMenu, TranslateMenu } from './TranslateMenu.js'\n\ntype MenuItemsMapType = {\n  component: React.FC<BaseItemProps>\n  excludedFor?: string[]\n  loadingText?: string\n  name: ActionMenuItems\n}\n\nexport const menuItemsMap: MenuItemsMapType[] = [\n  { name: 'Proofread', component: Proofread, excludedFor: ['upload'], loadingText: 'Proofreading' },\n  { name: 'Rephrase', component: Rephrase, excludedFor: ['upload'], loadingText: 'Rephrasing' },\n  {\n    name: 'Translate',\n    component: MemoizedTranslateMenu,\n    excludedFor: ['upload'],\n    loadingText: 'Translating',\n  },\n  { name: 'Expand', component: Expand, excludedFor: ['upload', 'text'], loadingText: 'Expanding' },\n  {\n    // Turned off - WIP\n    name: 'Summarize',\n    component: Summarize,\n    excludedFor: ['upload', 'text', 'richText'],\n    loadingText: 'Summarizing',\n  },\n  { name: 'Simplify', component: Simplify, excludedFor: ['upload'], loadingText: 'Simplifying' },\n  { name: 'Compose', component: Compose, loadingText: 'Composing' },\n  { name: 'Settings', component: Settings },\n]\n"],"names":["Compose","Expand","Proofread","Rephrase","Settings","Simplify","Summarize","MemoizedTranslateMenu","menuItemsMap","name","component","excludedFor","loadingText"],"mappings":"AAIA,SAASA,OAAO,EAAEC,MAAM,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,SAAS,QAAQ,aAAY;AAChG,SAASC,qBAAqB,QAAuB,qBAAoB;AASzE,OAAO,MAAMC,eAAmC;IAC9C;QAAEC,MAAM;QAAaC,WAAWR;QAAWS,aAAa;YAAC;SAAS;QAAEC,aAAa;IAAe;IAChG;QAAEH,MAAM;QAAYC,WAAWP;QAAUQ,aAAa;YAAC;SAAS;QAAEC,aAAa;IAAa;IAC5F;QACEH,MAAM;QACNC,WAAWH;QACXI,aAAa;YAAC;SAAS;QACvBC,aAAa;IACf;IACA;QAAEH,MAAM;QAAUC,WAAWT;QAAQU,aAAa;YAAC;YAAU;SAAO;QAAEC,aAAa;IAAY;IAC/F;QACE,mBAAmB;QACnBH,MAAM;QACNC,WAAWJ;QACXK,aAAa;YAAC;YAAU;YAAQ;SAAW;QAC3CC,aAAa;IACf;IACA;QAAEH,MAAM;QAAYC,WAAWL;QAAUM,aAAa;YAAC;SAAS;QAAEC,aAAa;IAAc;IAC7F;QAAEH,MAAM;QAAWC,WAAWV;QAASY,aAAa;IAAY;IAChE;QAAEH,MAAM;QAAYC,WAAWN;IAAS;CACzC,CAAA"}
+{"version":3,"sources":["../../../../../src/ui/Compose/hooks/menu/itemsMap.ts"],"sourcesContent":["import type React from 'react'\n\nimport type { ActionMenuItems, BaseItemProps } from '../../../../types.js'\n\nimport { Compose, Expand, Proofread, Rephrase, Settings, Simplify, Summarize } from './items.js'\nimport { MemoizedTranslateMenu, TranslateMenu } from './TranslateMenu.js'\n\ntype MenuItemsMapType = {\n  component: React.FC<BaseItemProps>\n  excludedFor?: string[]\n  loadingText?: string\n  name: ActionMenuItems\n}\n\nexport const menuItemsMap: MenuItemsMapType[] = [\n  { name: 'Proofread', component: Proofread, excludedFor: ['upload', 'array'], loadingText: 'Proofreading' },\n  { name: 'Rephrase', component: Rephrase, excludedFor: ['upload', 'array'], loadingText: 'Rephrasing' },\n  {\n    name: 'Translate',\n    component: MemoizedTranslateMenu,\n    excludedFor: ['upload', 'array'],\n    loadingText: 'Translating',\n  },\n  { name: 'Expand', component: Expand, excludedFor: ['upload', 'text', 'array'], loadingText: 'Expanding' },\n  {\n    // Turned off - WIP\n    name: 'Summarize',\n    component: Summarize,\n    excludedFor: ['upload', 'text', 'richText', 'array'],\n    loadingText: 'Summarizing',\n  },\n  { name: 'Simplify', component: Simplify, excludedFor: ['upload', 'array'], loadingText: 'Simplifying' },\n  { name: 'Compose', component: Compose, loadingText: 'Composing' },\n  { name: 'Settings', component: Settings },\n]\n"],"names":["Compose","Expand","Proofread","Rephrase","Settings","Simplify","Summarize","MemoizedTranslateMenu","menuItemsMap","name","component","excludedFor","loadingText"],"mappings":"AAIA,SAASA,OAAO,EAAEC,MAAM,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,SAAS,QAAQ,aAAY;AAChG,SAASC,qBAAqB,QAAuB,qBAAoB;AASzE,OAAO,MAAMC,eAAmC;IAC9C;QAAEC,MAAM;QAAaC,WAAWR;QAAWS,aAAa;YAAC;YAAU;SAAQ;QAAEC,aAAa;IAAe;IACzG;QAAEH,MAAM;QAAYC,WAAWP;QAAUQ,aAAa;YAAC;YAAU;SAAQ;QAAEC,aAAa;IAAa;IACrG;QACEH,MAAM;QACNC,WAAWH;QACXI,aAAa;YAAC;YAAU;SAAQ;QAChCC,aAAa;IACf;IACA;QAAEH,MAAM;QAAUC,WAAWT;QAAQU,aAAa;YAAC;YAAU;YAAQ;SAAQ;QAAEC,aAAa;IAAY;IACxG;QACE,mBAAmB;QACnBH,MAAM;QACNC,WAAWJ;QACXK,aAAa;YAAC;YAAU;YAAQ;YAAY;SAAQ;QACpDC,aAAa;IACf;IACA;QAAEH,MAAM;QAAYC,WAAWL;QAAUM,aAAa;YAAC;YAAU;SAAQ;QAAEC,aAAa;IAAc;IACtG;QAAEH,MAAM;QAAWC,WAAWV;QAASY,aAAa;IAAY;IAChE;QAAEH,MAAM;QAAYC,WAAWN;IAAS;CACzC,CAAA"}

package/dist/ui/Compose/hooks/menu/menu.module.scss

@@ -26,6 +26,8 @@
 }
 
 .menu {
+  --popup-width: 150px;
+
   display: flex;
   gap: 1px;
   flex-direction: column;
@@ -49,7 +51,7 @@
 
 .subMenu {
   position: absolute;
-  left: calc(var(--popup-width) + 12px);
+  left: calc(var(--popup-width) + 20px);
   width: calc(var(--popup-width) + 12px);
   top: 10px;
   height: calc(100% - 16px);
@@ -85,6 +87,7 @@
   color: var(--theme-elevation-800);
   border-radius: 0;
   -webkit-appearance: none;
+  appearance: none;
 
   font-size: inherit !important;
   height: auto !important;

package/dist/ui/Compose/hooks/menu/useMenu.js

@@ -1,6 +1,7 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useField } from '@payloadcms/ui';
+import { useForm } from '@payloadcms/ui';
+import { getSiblingData } from 'payload/shared';
 import React, { useEffect, useMemo, useState } from 'react';
 import { useFieldProps } from '../../../../providers/FieldProvider/useFieldProps.js';
 import { Compose, Proofread, Rephrase } from './items.js';
@@ -19,14 +20,27 @@ const getActiveComponent = (ac)=>{
     }
 };
 export const useMenu = (menuEvents, options)=>{
-    const { field: { type: fieldType } = {}, path: pathFromContext } = useFieldProps();
-    const field = useField({
-        path: pathFromContext ?? ''
-    });
+    const { field: { type: fieldType } = {}, path } = useFieldProps();
+    const { getData } = useForm();
     const [activeComponent, setActiveComponent] = useState('Rephrase');
-    const { initialValue, value } = field;
+    // Check value once on mount or when path/type changes
     useEffect(()=>{
-        if (!value) {
+        let hasValue = false;
+        try {
+            const data = getData();
+            if (path) {
+                const val = getSiblingData(data, path);
+                hasValue = val !== undefined && val !== null;
+                // For richTextFields, we might need a more robust check (e.g. check for root.children.length > 0)
+                // But for now, simple truthiness covers most cases or at least defaults safely
+                if (fieldType === 'richText' && val && typeof val === 'object' && 'root' in val) {
+                // Basic lexical check could go here if needed
+                }
+            }
+        } catch (e) {
+        // ignore
+        }
+        if (!hasValue) {
             setActiveComponent('Compose');
             return;
         }
@@ -34,15 +48,12 @@ export const useMenu = (menuEvents, options)=>{
             setActiveComponent('Compose');
             return;
         }
-        if (typeof value === 'string' && value !== initialValue) {
-            setActiveComponent('Proofread');
-        } else {
-            setActiveComponent('Rephrase');
-        }
+        // Default to Rephrase if value exists
+        setActiveComponent('Rephrase');
     }, [
-        initialValue,
-        value,
-        fieldType
+        fieldType,
+        getData,
+        path
     ]);
     const MemoizedActiveComponent = useMemo(()=>{
         return ({ isLoading, loadingLabel, stop })=>{

package/dist/ui/Compose/hooks/menu/useMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/ui/Compose/hooks/menu/useMenu.tsx"],"sourcesContent":["'use client'\n\nimport { useField } from '@payloadcms/ui'\nimport React, { useEffect, useMemo, useState } from 'react'\n\nimport type { ActionMenuItems, UseMenuEvents, UseMenuOptions } from '../../../../types.js'\n\nimport { useFieldProps } from '../../../../providers/FieldProvider/useFieldProps.js'\nimport { Compose, Proofread, Rephrase } from './items.js'\nimport { menuItemsMap } from './itemsMap.js'\nimport styles from './menu.module.scss'\n\nconst getActiveComponent = (ac: ActionMenuItems) => {\n  switch (ac) {\n    case 'Compose':\n      return Compose\n    case 'Proofread':\n      return Proofread\n    case 'Rephrase':\n      return Rephrase\n    default:\n      return Rephrase\n  }\n}\n\nexport const useMenu = (menuEvents: UseMenuEvents, options: UseMenuOptions) => {\n  const { field:{ type: fieldType } = {}, path: pathFromContext } = useFieldProps()\n  const field = useField({ path: pathFromContext ?? '' })\n  const [activeComponent, setActiveComponent] = useState<ActionMenuItems>('Rephrase')\n\n  const { initialValue, value } = field\n\n  useEffect(() => {\n    if (!value) {\n      setActiveComponent('Compose')\n      return\n    }\n\n    if (menuItemsMap.some((i) => i.excludedFor?.includes(fieldType ?? ''))) {\n      setActiveComponent('Compose')\n      return\n    }\n\n    if (typeof value === 'string' && value !== initialValue) {\n      setActiveComponent('Proofread')\n    } else {\n      setActiveComponent('Rephrase')\n    }\n  }, [initialValue, value, fieldType])\n\n  const MemoizedActiveComponent = useMemo(() => {\n    return ({ isLoading, loadingLabel, stop }: { isLoading: boolean; loadingLabel?: string; stop: () => void }) => {\n      const ActiveComponent = getActiveComponent(activeComponent)\n      const activeItem = menuItemsMap.find((i) => i.name === activeComponent)!\n      return (\n        <ActiveComponent\n          hideIcon\n          onClick={(data: unknown) => {\n            if (!isLoading) {\n              const trigger = menuEvents[`on${activeComponent}`]\n              if (typeof trigger === 'function') {\n                trigger(data)\n              } else {\n                console.error('No trigger found for', activeComponent)\n              }\n            } else {\n              stop()\n            }\n          }}\n          title={isLoading ? 'Click to stop' : activeItem.name}\n        >\n          {isLoading && (loadingLabel ?? activeItem.loadingText)}\n        </ActiveComponent>\n      )\n    }\n  }, [activeComponent, menuEvents])\n\n  const filteredMenuItems = useMemo(\n    () =>\n      menuItemsMap.filter((i) => {\n        if (i.name === 'Settings' && !options.isConfigAllowed) {\n          return false\n        } // Disable settings if a user role is not permitted\n        return i.name !== activeComponent && !i.excludedFor?.includes(fieldType ?? '')\n      }),\n    [activeComponent, fieldType, options.isConfigAllowed],\n  )\n\n  const MemoizedMenu = useMemo(() => {\n    return ({ isLoading, onClose }: { isLoading: boolean; onClose: () => void }) => (\n      <div className={styles.menu}>\n        {filteredMenuItems.map((i) => {\n          const Action = i.component\n          return (\n            <Action\n              disabled={isLoading}\n              key={i.name}\n              onClick={(data: unknown) => {\n                if (i.name !== 'Settings') {\n                  setActiveComponent(i.name)\n                }\n\n                menuEvents[`on${i.name}`]?.(data)\n                onClose()\n              }}\n            >\n              {isLoading && i.loadingText}\n            </Action>\n          )\n        })}\n      </div>\n    )\n  }, [filteredMenuItems, menuEvents])\n\n  return {\n    ActiveComponent: MemoizedActiveComponent,\n    Menu: MemoizedMenu,\n  }\n}\n"],"names":["useField","React","useEffect","useMemo","useState","useFieldProps","Compose","Proofread","Rephrase","menuItemsMap","styles","getActiveComponent","ac","useMenu","menuEvents","options","field","type","fieldType","path","pathFromContext","activeComponent","setActiveComponent","initialValue","value","some","i","excludedFor","includes","MemoizedActiveComponent","isLoading","loadingLabel","stop","ActiveComponent","activeItem","find","name","hideIcon","onClick","data","trigger","console","error","title","loadingText","filteredMenuItems","filter","isConfigAllowed","MemoizedMenu","onClose","div","className","menu","map","Action","component","disabled","Menu"],"mappings":"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"}
+{"version":3,"sources":["../../../../../src/ui/Compose/hooks/menu/useMenu.tsx"],"sourcesContent":["'use client'\n\nimport { useForm } from '@payloadcms/ui'\nimport { getSiblingData } from 'payload/shared'\nimport React, { useEffect, useMemo, useState } from 'react'\n\nimport type { ActionMenuItems, UseMenuEvents, UseMenuOptions } from '../../../../types.js'\n\nimport { useFieldProps } from '../../../../providers/FieldProvider/useFieldProps.js'\nimport { Compose, Proofread, Rephrase } from './items.js'\nimport { menuItemsMap } from './itemsMap.js'\nimport styles from './menu.module.scss'\n\nconst getActiveComponent = (ac: ActionMenuItems) => {\n  switch (ac) {\n    case 'Compose':\n      return Compose\n    case 'Proofread':\n      return Proofread\n    case 'Rephrase':\n      return Rephrase\n    default:\n      return Rephrase\n  }\n}\n\nexport const useMenu = (menuEvents: UseMenuEvents, options: UseMenuOptions) => {\n  const { field: { type: fieldType } = {}, path } = useFieldProps()\n  const { getData } = useForm()\n  const [activeComponent, setActiveComponent] = useState<ActionMenuItems>('Rephrase')\n\n  // Check value once on mount or when path/type changes\n  useEffect(() => {\n    let hasValue = false\n\n    try {\n      const data = getData()\n      if (path) {\n        const val = getSiblingData(data, path)\n        hasValue = val !== undefined && val !== null\n        // For richTextFields, we might need a more robust check (e.g. check for root.children.length > 0)\n        // But for now, simple truthiness covers most cases or at least defaults safely\n        if (fieldType === 'richText' && val && typeof val === 'object' && 'root' in val) {\n           // Basic lexical check could go here if needed\n        }\n      }\n    } catch (e) {\n      // ignore\n    }\n\n    if (!hasValue) {\n      setActiveComponent('Compose')\n      return\n    }\n\n    if (menuItemsMap.some((i) => i.excludedFor?.includes(fieldType ?? ''))) {\n      setActiveComponent('Compose')\n      return\n    }\n\n    // Default to Rephrase if value exists\n    setActiveComponent('Rephrase')\n  }, [fieldType, getData, path])\n\n  const MemoizedActiveComponent = useMemo(() => {\n    return ({ isLoading, loadingLabel, stop }: { isLoading: boolean; loadingLabel?: string; stop: () => void }) => {\n      const ActiveComponent = getActiveComponent(activeComponent)\n      const activeItem = menuItemsMap.find((i) => i.name === activeComponent)!\n      return (\n        <ActiveComponent\n          hideIcon\n          onClick={(data: unknown) => {\n            if (!isLoading) {\n              const trigger = menuEvents[`on${activeComponent}`]\n              if (typeof trigger === 'function') {\n                trigger(data)\n              } else {\n                console.error('No trigger found for', activeComponent)\n              }\n            } else {\n              stop()\n            }\n          }}\n          title={isLoading ? 'Click to stop' : activeItem.name}\n        >\n          {isLoading && (loadingLabel ?? activeItem.loadingText)}\n        </ActiveComponent>\n      )\n    }\n  }, [activeComponent, menuEvents])\n\n  const filteredMenuItems = useMemo(\n    () =>\n      menuItemsMap.filter((i) => {\n        if (i.name === 'Settings' && !options.isConfigAllowed) {\n          return false\n        } // Disable settings if a user role is not permitted\n        return i.name !== activeComponent && !i.excludedFor?.includes(fieldType ?? '')\n      }),\n    [activeComponent, fieldType, options.isConfigAllowed],\n  )\n\n  const MemoizedMenu = useMemo(() => {\n    return ({ isLoading, onClose }: { isLoading: boolean; onClose: () => void }) => (\n      <div className={styles.menu}>\n        {filteredMenuItems.map((i) => {\n          const Action = i.component\n          return (\n            <Action\n              disabled={isLoading}\n              key={i.name}\n              onClick={(data: unknown) => {\n                if (i.name !== 'Settings') {\n                  setActiveComponent(i.name)\n                }\n\n                menuEvents[`on${i.name}`]?.(data)\n                onClose()\n              }}\n            >\n              {isLoading && i.loadingText}\n            </Action>\n          )\n        })}\n      </div>\n    )\n  }, [filteredMenuItems, menuEvents])\n\n  return {\n    ActiveComponent: MemoizedActiveComponent,\n    Menu: MemoizedMenu,\n  }\n}\n\n"],"names":["useForm","getSiblingData","React","useEffect","useMemo","useState","useFieldProps","Compose","Proofread","Rephrase","menuItemsMap","styles","getActiveComponent","ac","useMenu","menuEvents","options","field","type","fieldType","path","getData","activeComponent","setActiveComponent","hasValue","data","val","undefined","e","some","i","excludedFor","includes","MemoizedActiveComponent","isLoading","loadingLabel","stop","ActiveComponent","activeItem","find","name","hideIcon","onClick","trigger","console","error","title","loadingText","filteredMenuItems","filter","isConfigAllowed","MemoizedMenu","onClose","div","className","menu","map","Action","component","disabled","Menu"],"mappings":"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"}

package/dist/ui/Compose/hooks/menu/useMenu.jsx

@@ -1,5 +1,6 @@
 'use client';
-import { useField } from '@payloadcms/ui';
+import { useForm } from '@payloadcms/ui';
+import { getSiblingData } from 'payload/shared';
 import React, { useEffect, useMemo, useState } from 'react';
 import { useFieldProps } from '../../../../providers/FieldProvider/useFieldProps.js';
 import { Compose, Proofread, Rephrase } from './items.js';
@@ -18,12 +19,28 @@ const getActiveComponent = (ac) => {
     }
 };
 export const useMenu = (menuEvents, options) => {
-    const { field: { type: fieldType } = {}, path: pathFromContext } = useFieldProps();
-    const field = useField({ path: pathFromContext ?? '' });
+    const { field: { type: fieldType } = {}, path } = useFieldProps();
+    const { getData } = useForm();
     const [activeComponent, setActiveComponent] = useState('Rephrase');
-    const { initialValue, value } = field;
+    // Check value once on mount or when path/type changes
     useEffect(() => {
-        if (!value) {
+        let hasValue = false;
+        try {
+            const data = getData();
+            if (path) {
+                const val = getSiblingData(data, path);
+                hasValue = val !== undefined && val !== null;
+                // For richTextFields, we might need a more robust check (e.g. check for root.children.length > 0)
+                // But for now, simple truthiness covers most cases or at least defaults safely
+                if (fieldType === 'richText' && val && typeof val === 'object' && 'root' in val) {
+                    // Basic lexical check could go here if needed
+                }
+            }
+        }
+        catch (e) {
+            // ignore
+        }
+        if (!hasValue) {
             setActiveComponent('Compose');
             return;
         }
@@ -31,13 +48,9 @@ export const useMenu = (menuEvents, options) => {
             setActiveComponent('Compose');
             return;
         }
-        if (typeof value === 'string' && value !== initialValue) {
-            setActiveComponent('Proofread');
-        }
-        else {
-            setActiveComponent('Rephrase');
-        }
-    }, [initialValue, value, fieldType]);
+        // Default to Rephrase if value exists
+        setActiveComponent('Rephrase');
+    }, [fieldType, getData, path]);
     const MemoizedActiveComponent = useMemo(() => {
         return ({ isLoading, loadingLabel, stop }) => {
             const ActiveComponent = getActiveComponent(activeComponent);

package/dist/ui/Compose/hooks/useActiveFieldTracking.js

@@ -15,6 +15,8 @@ const fieldTypeCache = new WeakMap();
 let pointerDownThrottleTimer = null;
 let focusDebounceTimer = null;
 let currentContainer = null;
+let lastContainer = null // Track last valid container to restore if needed
+;
 let rafId = null // Track RAF to cancel if needed
 ;
 /**
@@ -106,6 +108,8 @@ let rafId = null // Track RAF to cancel if needed
     currentContainer?.classList.remove('ai-plugin-active');
     if (next) {
         next.classList.add('ai-plugin-active');
+        lastContainer = next // Update last known valid container
+        ;
     }
     currentContainer = next;
 };
@@ -113,6 +117,7 @@ const clearActiveContainer = ()=>{
     if (currentContainer) {
         currentContainer.classList.remove('ai-plugin-active');
         currentContainer = null;
+    // Note: We do NOT clear lastContainer here, allowing restoration
     }
     // Cancel any pending RAF
     if (rafId !== null) {
@@ -147,6 +152,23 @@ const isInteractiveElement = (element)=>{
     }
     return false;
 };
+// Helper for interactive menu check
+const checkInteractiveMenu = (e)=>{
+    // Check global flag first (most reliable for mouse/hover interactions)
+    if (typeof window !== 'undefined' && window.__AI_MENU_INTERACTIVE) {
+        return true;
+    }
+    const target = e.target;
+    // Check target directly
+    if (target && target instanceof Element && (target.classList.contains('ai-interactive-menu') || target.hasAttribute('data-ai-interactive'))) {
+        return true;
+    }
+    // Fallback: Check DOM path (for keyboard or specific events)
+    const path = e.composedPath();
+    return path.some((el)=>{
+        return el instanceof Element && (el.classList.contains('ai-interactive-menu') || el.hasAttribute('data-ai-interactive'));
+    });
+};
 /**
  * Handle focus events - only activate if focus is on an interactive element within .field-type
  * Performance: Debounced by 10ms to handle rapid focus changes
@@ -163,6 +185,14 @@ const isInteractiveElement = (element)=>{
     if (!isInteractiveElement(target)) {
         return;
     }
+    // Check for interactive menu elements using composedPath for robustness
+    if (typeof window !== 'undefined' && window.__AI_MENU_INTERACTIVE || checkInteractiveMenu(e)) {
+        // If we lost the active state (e.g. due to pointerDown clearing it), restore it
+        if (!currentContainer && lastContainer?.isConnected) {
+            setActiveContainer(lastContainer);
+        }
+        return;
+    }
     // Clear any pending debounce
     if (focusDebounceTimer !== null) {
         clearTimeout(focusDebounceTimer);
@@ -182,6 +212,10 @@ const isInteractiveElement = (element)=>{
     if (!(target instanceof HTMLElement)) {
         return;
     }
+    // Check for interactive menu elements using composedPath
+    if (typeof window !== 'undefined' && window.__AI_MENU_INTERACTIVE || checkInteractiveMenu(e)) {
+        return;
+    }
     // Early exit if clicking within current container
     if (currentContainer?.isConnected && currentContainer.contains(target)) {
         return;

package/dist/ui/Compose/hooks/useActiveFieldTracking.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/ui/Compose/hooks/useActiveFieldTracking.ts"],"sourcesContent":["'use client'\n\nimport { useEffect } from 'react'\n\n/**\n * Allowed field type classes that should show the active state\n */\nconst ALLOWED_FIELD_TYPES = ['upload', 'text', 'textarea', 'rich-text-lexical']\n\n// Performance optimization: Cache container and field type lookups\nconst containerCache = new WeakMap<HTMLElement, HTMLElement | null>()\nconst fieldTypeCache = new WeakMap<HTMLElement, boolean>()\n\n// Performance optimization: Throttle/debounce timers\nlet pointerDownThrottleTimer: null | number = null\nlet focusDebounceTimer: null | number = null\n\nlet currentContainer: HTMLElement | null = null\nlet rafId: null | number = null // Track RAF to cancel if needed\n\n/**\n * Safely escape CSS selector values\n */\nconst cssEscape = (value: string): string => {\n  if (typeof CSS !== 'undefined' && typeof CSS.escape === 'function') {\n    return CSS.escape(value)\n  }\n  return value.replace(/([ #;?%&,.+*~':\"!^$[\\]()=>|/@])/g, '\\\\$1')\n}\n\n/**\n * Find container from React Select dropdown elements\n * Performance: Early exit if not in a listbox/option element\n */\nconst findContainerFromReactSelect = (target: HTMLElement): HTMLElement | null => {\n  // Early exit if element doesn't have role indicator for React Select\n  const role = target.getAttribute('role')\n  if (!role || !['listbox', 'option'].includes(role)) {\n    return null\n  }\n\n  const listbox = target.closest<HTMLElement>('[role=\"listbox\"]')\n  if (!listbox?.id) {\n    return null\n  }\n\n  const id = cssEscape(listbox.id)\n  const selector = `[aria-controls=\"${id}\"], [aria-owns=\"${id}\"]`\n  const control = document.querySelector<HTMLElement>(selector)\n\n  return control?.closest<HTMLElement>('.field-type') ?? null\n}\n\n/**\n * Check if a container has one of the allowed field type classes\n * Performance: Uses WeakMap cache to avoid repeated class list checks\n */\nconst isAllowedFieldType = (container: HTMLElement): boolean => {\n  // Check cache first\n  if (fieldTypeCache.has(container)) {\n    return fieldTypeCache.get(container)!\n  }\n\n  // Compute and cache result\n  const result = ALLOWED_FIELD_TYPES.some(\n    (type) =>\n      container.classList.contains(type) || container.classList.contains(`field-type-${type}`),\n  )\n\n  fieldTypeCache.set(container, result)\n  return result\n}\n\n/**\n * Resolve the .field-type container for a given event target\n * Only returns containers that match allowed field types\n * Performance: Uses WeakMap cache to avoid repeated DOM traversals\n */\nconst resolveContainerFromTarget = (target: EventTarget | null): HTMLElement | null => {\n  if (!(target instanceof HTMLElement)) {\n    return null\n  }\n\n  // Check cache first\n  if (containerCache.has(target)) {\n    const cached = containerCache.get(target)!\n    // Validate cache entry is still in DOM\n    if (!cached || cached.isConnected) {\n      return cached\n    }\n    // Invalidate stale cache entry\n    containerCache.delete(target)\n  }\n\n  // Perform lookup\n  let container = target.closest<HTMLElement>('.field-type')\n\n  // Fall back to React Select logic if needed\n  if (!container) {\n    container = findContainerFromReactSelect(target)\n  }\n\n  // Validate field type and cache result\n  const result = container && isAllowedFieldType(container) ? container : null\n  containerCache.set(target, result)\n\n  return result\n}\n\n/**\n * Update the active container and toggle CSS class\n * - Avoids acting on disconnected nodes\n * - Avoids redundant class work\n */\nconst setActiveContainer = (next: HTMLElement | null): void => {\n  // Normalize both references against disconnected nodes\n  if (currentContainer && !currentContainer.isConnected) {\n    currentContainer = null\n  }\n  if (next && !next.isConnected) {\n    next = null\n  }\n\n  if (currentContainer === next) {\n    return\n  }\n\n  currentContainer?.classList.remove('ai-plugin-active')\n  if (next) {\n    next.classList.add('ai-plugin-active')\n  }\n  currentContainer = next\n}\n\nconst clearActiveContainer = (): void => {\n  if (currentContainer) {\n    currentContainer.classList.remove('ai-plugin-active')\n    currentContainer = null\n  }\n\n  // Cancel any pending RAF\n  if (rafId !== null) {\n    cancelAnimationFrame(rafId)\n    rafId = null\n  }\n}\n\nconst isInteractiveElement = (element: HTMLElement): boolean => {\n  const tagName = element.tagName.toLowerCase()\n  const interactiveTags = ['input', 'textarea', 'select', 'button']\n\n  if (interactiveTags.includes(tagName)) {\n    return true\n  }\n\n  // Check for contenteditable\n  if (element.isContentEditable) {\n    return true\n  }\n\n  // Check for elements with role=\"textbox\" or role=\"combobox\" (React Select)\n  const role = element.getAttribute('role')\n  if (role && ['combobox', 'listbox', 'searchbox', 'textbox'].includes(role)) {\n    return true\n  }\n\n  return false\n}\n\n/**\n * Handle focus events - only activate if focus is on an interactive element within .field-type\n * Performance: Debounced by 10ms to handle rapid focus changes\n */\nconst onFocusIn = (e: FocusEvent): void => {\n  const target = e.target\n  if (!(target instanceof HTMLElement)) {\n    return\n  }\n\n  // Early exit if we're already inside the current container\n  if (currentContainer?.isConnected && currentContainer.contains(target)) {\n    return\n  }\n\n  // Only activate if the focused element is actually interactive\n  if (!isInteractiveElement(target)) {\n    return\n  }\n\n  // Clear any pending debounce\n  if (focusDebounceTimer !== null) {\n    clearTimeout(focusDebounceTimer)\n  }\n\n  // Debounce to reduce work during rapid focus changes (e.g., fast tabbing)\n  focusDebounceTimer = window.setTimeout(() => {\n    focusDebounceTimer = null\n    const container = resolveContainerFromTarget(target)\n    setActiveContainer(container)\n  }, 10)\n}\n\n/**\n * Handle pointer/mouse events - only switch when clicking a different .field-type\n * Performance: Early exit for non-field clicks + 50ms throttling\n */\nconst onPointerDown = (e: PointerEvent): void => {\n  const target = e.target\n  if (!(target instanceof HTMLElement)) {\n    return\n  }\n\n  // Early exit if clicking within current container\n  if (currentContainer?.isConnected && currentContainer.contains(target)) {\n    return\n  }\n\n  // Performance: Quick check before expensive traversal\n  // If click is nowhere near a field, just clear active state\n  if (!target.closest('.field-type')) {\n    if (currentContainer) {\n      setActiveContainer(null)\n    }\n    return\n  }\n\n  // Throttle to prevent excessive work on rapid clicking\n  if (pointerDownThrottleTimer !== null) {\n    return\n  }\n\n  const container = resolveContainerFromTarget(target)\n  setActiveContainer(container)\n\n  // Set throttle timer for 50ms\n  pointerDownThrottleTimer = window.setTimeout(() => {\n    pointerDownThrottleTimer = null\n  }, 50)\n}\n\n/**\n * Handle keyboard navigation (Tab key)\n */\nconst onKeyDown = (e: KeyboardEvent): void => {\n  if (e.key !== 'Tab') {\n    return\n  }\n\n  // Cancel any pending RAF to prevent queuing\n  if (rafId !== null) {\n    cancelAnimationFrame(rafId)\n  }\n\n  // Defer until after focus has shifted\n  rafId = requestAnimationFrame(() => {\n    rafId = null\n    const container = resolveContainerFromTarget(document.activeElement)\n    setActiveContainer(container)\n  })\n}\n\n/**\n * Handle visibility changes to properly cleanup when page is hidden\n */\nconst onVisibilityChange = (): void => {\n  if (typeof document !== 'undefined' && document.hidden) {\n    // Clear active state and cancel pending operations\n    clearActiveContainer()\n  }\n}\n\n/**\n * Initialize document-level listeners to track the active field container.\n * When a container is active, it receives the 'ai-plugin-active' class.\n */\nexport const useActiveFieldTracking = (): void => {\n  useEffect(() => {\n    if (typeof window === 'undefined') {\n      return\n    }\n\n    const pluginWindow = window as {\n      __aiComposeTracking?: boolean\n      __aiComposeTrackingController?: AbortController\n      __aiComposeTrackingCount?: number\n    } & Window\n\n    // Track number of mounted users of the hook\n    pluginWindow.__aiComposeTrackingCount = (pluginWindow.__aiComposeTrackingCount ?? 0) + 1\n\n    // Initialize listeners only once\n    if (!pluginWindow.__aiComposeTracking) {\n      const controller = new AbortController()\n      pluginWindow.__aiComposeTrackingController = controller\n\n      // Use capture for early handling\n      document.addEventListener('focusin', onFocusIn, {\n        capture: true,\n        signal: controller.signal,\n      })\n      document.addEventListener('pointerdown', onPointerDown, {\n        capture: true,\n        passive: true,\n        signal: controller.signal,\n      })\n      document.addEventListener('keydown', onKeyDown, {\n        capture: true,\n        signal: controller.signal,\n      })\n      document.addEventListener('visibilitychange', onVisibilityChange, {\n        signal: controller.signal,\n      })\n\n      pluginWindow.__aiComposeTracking = true\n    }\n\n    return () => {\n      // Decrement and cleanup when the last user unmounts\n      pluginWindow.__aiComposeTrackingCount = (pluginWindow.__aiComposeTrackingCount ?? 1) - 1\n\n      if ((pluginWindow.__aiComposeTrackingCount ?? 0) <= 0) {\n        // Atomically remove all listeners\n        pluginWindow.__aiComposeTrackingController?.abort()\n        pluginWindow.__aiComposeTrackingController = undefined\n\n        // Clear active state and cancel pending operations\n        clearActiveContainer()\n\n        // Reset all state\n        pluginWindow.__aiComposeTracking = false\n        pluginWindow.__aiComposeTrackingCount = 0\n      }\n    }\n  }, [])\n}\n"],"names":["useEffect","ALLOWED_FIELD_TYPES","containerCache","WeakMap","fieldTypeCache","pointerDownThrottleTimer","focusDebounceTimer","currentContainer","rafId","cssEscape","value","CSS","escape","replace","findContainerFromReactSelect","target","role","getAttribute","includes","listbox","closest","id","selector","control","document","querySelector","isAllowedFieldType","container","has","get","result","some","type","classList","contains","set","resolveContainerFromTarget","HTMLElement","cached","isConnected","delete","setActiveContainer","next","remove","add","clearActiveContainer","cancelAnimationFrame","isInteractiveElement","element","tagName","toLowerCase","interactiveTags","isContentEditable","onFocusIn","e","clearTimeout","window","setTimeout","onPointerDown","onKeyDown","key","requestAnimationFrame","activeElement","onVisibilityChange","hidden","useActiveFieldTracking","pluginWindow","__aiComposeTrackingCount","__aiComposeTracking","controller","AbortController","__aiComposeTrackingController","addEventListener","capture","signal","passive","abort","undefined"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/ui/Compose/hooks/useActiveFieldTracking.ts"],"sourcesContent":["'use client'\n\nimport { useEffect } from 'react'\n\n/**\n * Allowed field type classes that should show the active state\n */\nconst ALLOWED_FIELD_TYPES = ['upload', 'text', 'textarea', 'rich-text-lexical']\n\n// Performance optimization: Cache container and field type lookups\nconst containerCache = new WeakMap<HTMLElement, HTMLElement | null>()\nconst fieldTypeCache = new WeakMap<HTMLElement, boolean>()\n\n// Performance optimization: Throttle/debounce timers\nlet pointerDownThrottleTimer: null | number = null\nlet focusDebounceTimer: null | number = null\n\nlet currentContainer: HTMLElement | null = null\nlet lastContainer: HTMLElement | null = null // Track last valid container to restore if needed\nlet rafId: null | number = null // Track RAF to cancel if needed\n\n/**\n * Safely escape CSS selector values\n */\nconst cssEscape = (value: string): string => {\n  if (typeof CSS !== 'undefined' && typeof CSS.escape === 'function') {\n    return CSS.escape(value)\n  }\n  return value.replace(/([ #;?%&,.+*~':\"!^$[\\]()=>|/@])/g, '\\\\$1')\n}\n\n/**\n * Find container from React Select dropdown elements\n * Performance: Early exit if not in a listbox/option element\n */\nconst findContainerFromReactSelect = (target: HTMLElement): HTMLElement | null => {\n  // Early exit if element doesn't have role indicator for React Select\n  const role = target.getAttribute('role')\n  if (!role || !['listbox', 'option'].includes(role)) {\n    return null\n  }\n\n  const listbox = target.closest<HTMLElement>('[role=\"listbox\"]')\n  if (!listbox?.id) {\n    return null\n  }\n\n  const id = cssEscape(listbox.id)\n  const selector = `[aria-controls=\"${id}\"], [aria-owns=\"${id}\"]`\n  const control = document.querySelector<HTMLElement>(selector)\n\n  return control?.closest<HTMLElement>('.field-type') ?? null\n}\n\n/**\n * Check if a container has one of the allowed field type classes\n * Performance: Uses WeakMap cache to avoid repeated class list checks\n */\nconst isAllowedFieldType = (container: HTMLElement): boolean => {\n  // Check cache first\n  if (fieldTypeCache.has(container)) {\n    return fieldTypeCache.get(container)!\n  }\n\n  // Compute and cache result\n  const result = ALLOWED_FIELD_TYPES.some(\n    (type) =>\n      container.classList.contains(type) || container.classList.contains(`field-type-${type}`),\n  )\n\n  fieldTypeCache.set(container, result)\n  return result\n}\n\n/**\n * Resolve the .field-type container for a given event target\n * Only returns containers that match allowed field types\n * Performance: Uses WeakMap cache to avoid repeated DOM traversals\n */\nconst resolveContainerFromTarget = (target: EventTarget | null): HTMLElement | null => {\n  if (!(target instanceof HTMLElement)) {\n    return null\n  }\n\n  // Check cache first\n  if (containerCache.has(target)) {\n    const cached = containerCache.get(target)!\n    // Validate cache entry is still in DOM\n    if (!cached || cached.isConnected) {\n      return cached\n    }\n    // Invalidate stale cache entry\n    containerCache.delete(target)\n  }\n\n  // Perform lookup\n  let container = target.closest<HTMLElement>('.field-type')\n\n  // Fall back to React Select logic if needed\n  if (!container) {\n    container = findContainerFromReactSelect(target)\n  }\n\n  // Validate field type and cache result\n  const result = container && isAllowedFieldType(container) ? container : null\n  containerCache.set(target, result)\n\n  return result\n}\n\n/**\n * Update the active container and toggle CSS class\n * - Avoids acting on disconnected nodes\n * - Avoids redundant class work\n */\nconst setActiveContainer = (next: HTMLElement | null): void => {\n  // Normalize both references against disconnected nodes\n  if (currentContainer && !currentContainer.isConnected) {\n    currentContainer = null\n  }\n  if (next && !next.isConnected) {\n    next = null\n  }\n\n  if (currentContainer === next) {\n    return\n  }\n\n  currentContainer?.classList.remove('ai-plugin-active')\n  if (next) {\n    next.classList.add('ai-plugin-active')\n    lastContainer = next // Update last known valid container\n  }\n  currentContainer = next\n}\n\nconst clearActiveContainer = (): void => {\n  if (currentContainer) {\n    currentContainer.classList.remove('ai-plugin-active')\n    currentContainer = null\n    // Note: We do NOT clear lastContainer here, allowing restoration\n  }\n\n  // Cancel any pending RAF\n  if (rafId !== null) {\n    cancelAnimationFrame(rafId)\n    rafId = null\n  }\n}\n\nconst isInteractiveElement = (element: HTMLElement): boolean => {\n  const tagName = element.tagName.toLowerCase()\n  const interactiveTags = ['input', 'textarea', 'select', 'button']\n\n  if (interactiveTags.includes(tagName)) {\n    return true\n  }\n\n  // Check for contenteditable\n  if (element.isContentEditable) {\n    return true\n  }\n\n  // Check for elements with role=\"textbox\" or role=\"combobox\" (React Select)\n  const role = element.getAttribute('role')\n  if (role && ['combobox', 'listbox', 'searchbox', 'textbox'].includes(role)) {\n    return true\n  }\n\n  return false\n}\n\n// Helper for interactive menu check\nconst checkInteractiveMenu = (e: Event): boolean => {\n  // Check global flag first (most reliable for mouse/hover interactions)\n  if (typeof window !== 'undefined' && window.__AI_MENU_INTERACTIVE) {\n    return true\n  }\n\n  const target = e.target as Element\n\n  // Check target directly\n  if (\n    target &&\n    target instanceof Element &&\n    (target.classList.contains('ai-interactive-menu') || target.hasAttribute('data-ai-interactive'))\n  ) {\n    return true\n  }\n\n  // Fallback: Check DOM path (for keyboard or specific events)\n  const path = e.composedPath()\n  return path.some((el) => {\n    return (\n      el instanceof Element &&\n      (el.classList.contains('ai-interactive-menu') || el.hasAttribute('data-ai-interactive'))\n    )\n  })\n}\n\n/**\n * Handle focus events - only activate if focus is on an interactive element within .field-type\n * Performance: Debounced by 10ms to handle rapid focus changes\n */\nconst onFocusIn = (e: FocusEvent): void => {\n  const target = e.target\n  if (!(target instanceof HTMLElement)) {\n    return\n  }\n\n  // Early exit if we're already inside the current container\n  if (currentContainer?.isConnected && currentContainer.contains(target)) {\n    return\n  }\n\n  // Only activate if the focused element is actually interactive\n  if (!isInteractiveElement(target)) {\n    return\n  }\n\n  // Check for interactive menu elements using composedPath for robustness\n  if (typeof window !== 'undefined' && window.__AI_MENU_INTERACTIVE || checkInteractiveMenu(e)) {\n    // If we lost the active state (e.g. due to pointerDown clearing it), restore it\n    if (!currentContainer && lastContainer?.isConnected) {\n       setActiveContainer(lastContainer)\n    }\n    return\n  }\n\n  // Clear any pending debounce\n  if (focusDebounceTimer !== null) {\n    clearTimeout(focusDebounceTimer)\n  }\n\n  // Debounce to reduce work during rapid focus changes (e.g., fast tabbing)\n  focusDebounceTimer = window.setTimeout(() => {\n    focusDebounceTimer = null\n    const container = resolveContainerFromTarget(target)\n    setActiveContainer(container)\n  }, 10)\n}\n\n/**\n * Handle pointer/mouse events - only switch when clicking a different .field-type\n * Performance: Early exit for non-field clicks + 50ms throttling\n */\nconst onPointerDown = (e: PointerEvent): void => {\n  const target = e.target\n  if (!(target instanceof HTMLElement)) {\n    return\n  }\n\n  // Check for interactive menu elements using composedPath\n  if (typeof window !== 'undefined' && window.__AI_MENU_INTERACTIVE || checkInteractiveMenu(e)) {\n    return\n  }\n\n  // Early exit if clicking within current container\n  if (currentContainer?.isConnected && currentContainer.contains(target)) {\n    return\n  }\n\n  // Performance: Quick check before expensive traversal\n  // If click is nowhere near a field, just clear active state\n  if (!target.closest('.field-type')) {\n    if (currentContainer) {\n      setActiveContainer(null)\n    }\n    return\n  }\n\n  // Throttle to prevent excessive work on rapid clicking\n  if (pointerDownThrottleTimer !== null) {\n    return\n  }\n\n  const container = resolveContainerFromTarget(target)\n  setActiveContainer(container)\n\n  // Set throttle timer for 50ms\n  pointerDownThrottleTimer = window.setTimeout(() => {\n    pointerDownThrottleTimer = null\n  }, 50)\n}\n\n/**\n * Handle keyboard navigation (Tab key)\n */\nconst onKeyDown = (e: KeyboardEvent): void => {\n  if (e.key !== 'Tab') {\n    return\n  }\n\n  // Cancel any pending RAF to prevent queuing\n  if (rafId !== null) {\n    cancelAnimationFrame(rafId)\n  }\n\n  // Defer until after focus has shifted\n  rafId = requestAnimationFrame(() => {\n    rafId = null\n    const container = resolveContainerFromTarget(document.activeElement)\n    setActiveContainer(container)\n  })\n}\n\n/**\n * Handle visibility changes to properly cleanup when page is hidden\n */\nconst onVisibilityChange = (): void => {\n  if (typeof document !== 'undefined' && document.hidden) {\n    // Clear active state and cancel pending operations\n    clearActiveContainer()\n  }\n}\n\n/**\n * Initialize document-level listeners to track the active field container.\n * When a container is active, it receives the 'ai-plugin-active' class.\n */\nexport const useActiveFieldTracking = (): void => {\n  useEffect(() => {\n    if (typeof window === 'undefined') {\n      return\n    }\n\n    const pluginWindow = window as {\n      __aiComposeTracking?: boolean\n      __aiComposeTrackingController?: AbortController\n      __aiComposeTrackingCount?: number\n    } & Window\n\n    // Track number of mounted users of the hook\n    pluginWindow.__aiComposeTrackingCount = (pluginWindow.__aiComposeTrackingCount ?? 0) + 1\n\n    // Initialize listeners only once\n    if (!pluginWindow.__aiComposeTracking) {\n      const controller = new AbortController()\n      pluginWindow.__aiComposeTrackingController = controller\n\n      // Use capture for early handling\n      document.addEventListener('focusin', onFocusIn, {\n        capture: true,\n        signal: controller.signal,\n      })\n      document.addEventListener('pointerdown', onPointerDown, {\n        capture: true,\n        passive: true,\n        signal: controller.signal,\n      })\n      document.addEventListener('keydown', onKeyDown, {\n        capture: true,\n        signal: controller.signal,\n      })\n      document.addEventListener('visibilitychange', onVisibilityChange, {\n        signal: controller.signal,\n      })\n\n      pluginWindow.__aiComposeTracking = true\n    }\n\n    return () => {\n      // Decrement and cleanup when the last user unmounts\n      pluginWindow.__aiComposeTrackingCount = (pluginWindow.__aiComposeTrackingCount ?? 1) - 1\n\n      if ((pluginWindow.__aiComposeTrackingCount ?? 0) <= 0) {\n        // Atomically remove all listeners\n        pluginWindow.__aiComposeTrackingController?.abort()\n        pluginWindow.__aiComposeTrackingController = undefined\n\n        // Clear active state and cancel pending operations\n        clearActiveContainer()\n\n        // Reset all state\n        pluginWindow.__aiComposeTracking = false\n        pluginWindow.__aiComposeTrackingCount = 0\n      }\n    }\n  }, [])\n}\n"],"names":["useEffect","ALLOWED_FIELD_TYPES","containerCache","WeakMap","fieldTypeCache","pointerDownThrottleTimer","focusDebounceTimer","currentContainer","lastContainer","rafId","cssEscape","value","CSS","escape","replace","findContainerFromReactSelect","target","role","getAttribute","includes","listbox","closest","id","selector","control","document","querySelector","isAllowedFieldType","container","has","get","result","some","type","classList","contains","set","resolveContainerFromTarget","HTMLElement","cached","isConnected","delete","setActiveContainer","next","remove","add","clearActiveContainer","cancelAnimationFrame","isInteractiveElement","element","tagName","toLowerCase","interactiveTags","isContentEditable","checkInteractiveMenu","e","window","__AI_MENU_INTERACTIVE","Element","hasAttribute","path","composedPath","el","onFocusIn","clearTimeout","setTimeout","onPointerDown","onKeyDown","key","requestAnimationFrame","activeElement","onVisibilityChange","hidden","useActiveFieldTracking","pluginWindow","__aiComposeTrackingCount","__aiComposeTracking","controller","AbortController","__aiComposeTrackingController","addEventListener","capture","signal","passive","abort","undefined"],"mappings":"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"}