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

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

@@ -1,17 +1,17 @@
 'use client';
-import { useDocumentInfo, useField } from '@payloadcms/ui';
+import { useDocumentInfo, useForm } from '@payloadcms/ui';
 import { useCallback, useEffect, useRef } from 'react';
+import { getSiblingData } from 'payload/shared';
 import { PLUGIN_NAME } from '../../../defaults.js';
 import { useFieldProps } from '../../../providers/FieldProvider/useFieldProps.js';
 const STORAGE_KEY = `${PLUGIN_NAME}-fields-history`;
+const MAX_HISTORY_SIZE = 50;
 // Global cache to prevent synchronous localStorage reads on every render
 let globalHistoryCache = null;
 export const useHistory = ()=>{
     const { id } = useDocumentInfo();
-    const { path: pathFromContext, schemaPath } = useFieldProps();
-    const { value: currentFieldValue } = useField({
-        path: pathFromContext ?? ''
-    });
+    const { path, schemaPath } = useFieldProps();
+    const { getData } = useForm();
     const fieldKey = `${id}.${schemaPath}`;
     const getLatestHistory = useCallback(()=>{
         // Return cache if available
@@ -43,21 +43,29 @@ export const useHistory = ()=>{
         if (saveTimerRef.current) {
             clearTimeout(saveTimerRef.current);
         }
-        // Debounce the save operation by 300ms
+        // Debounce the save operation by 500ms
         saveTimerRef.current = setTimeout(()=>{
             // Use requestIdleCallback if available to avoid blocking the main thread
             if (typeof requestIdleCallback !== 'undefined') {
                 requestIdleCallback(()=>{
-                    localStorage.setItem(STORAGE_KEY, JSON.stringify(newGlobalHistory));
+                    try {
+                        localStorage.setItem(STORAGE_KEY, JSON.stringify(newGlobalHistory));
+                    } catch (e) {
+                        console.warn('Failed to save history to localStorage', e);
+                    }
                 }, {
                     timeout: 2000
                 });
             } else {
                 // Fallback for browsers without requestIdleCallback
-                localStorage.setItem(STORAGE_KEY, JSON.stringify(newGlobalHistory));
+                try {
+                    localStorage.setItem(STORAGE_KEY, JSON.stringify(newGlobalHistory));
+                } catch (e) {
+                    console.warn('Failed to save history to localStorage', e);
+                }
             }
             saveTimerRef.current = null;
-        }, 300);
+        }, 500);
     }, []);
     // Sync with other tabs
     useEffect(()=>{
@@ -80,15 +88,18 @@ export const useHistory = ()=>{
         const latestHistory = {
             ...getLatestHistory()
         };
+        let hasChanges = false;
         Object.keys(latestHistory).forEach((k)=>{
             if (!k.startsWith(id?.toString() ?? '')) {
                 delete latestHistory[k];
+                hasChanges = true;
             }
         });
-        saveToLocalStorage(latestHistory);
+        if (hasChanges) {
+            saveToLocalStorage(latestHistory);
+        }
     }, [
         id,
-        fieldKey,
         getLatestHistory,
         saveToLocalStorage
     ]);
@@ -101,22 +112,46 @@ export const useHistory = ()=>{
             history: []
         };
         let newIndex = currentIndex;
+        let historyUpdated = false;
+        const newHistoryArray = [
+            ...history
+        ];
         if (currentIndex == -1) {
             newIndex = 0;
-            if (currentFieldValue) {
-                history[newIndex] = currentFieldValue;
+            // Get initial value from form data instead of subscribing to useField
+            // This implementation avoids re-rendering on every keystroke
+            try {
+                const data = getData();
+                // We need to resolve the value from the data object using the path
+                // path might be 'group.subgroup.field'
+                if (path) {
+                    const value = getSiblingData(data, path);
+                    if (value) {
+                        newHistoryArray[newIndex] = value;
+                        historyUpdated = true;
+                    }
+                }
+            } catch (e) {
+            // If we can't get the data, just ignore
             }
         }
-        const newGlobalHistory = {
-            ...latestHistory,
-            [fieldKey]: {
-                currentIndex: newIndex,
-                history
-            }
-        };
-        saveToLocalStorage(newGlobalHistory);
+        if (historyUpdated) {
+            const newGlobalHistory = {
+                ...latestHistory,
+                [fieldKey]: {
+                    currentIndex: newIndex,
+                    history: newHistoryArray
+                }
+            };
+            saveToLocalStorage(newGlobalHistory);
+        }
     }, [
-        fieldKey
+        fieldKey,
+        getData,
+        path,
+        clearHistory,
+        getLatestHistory,
+        saveToLocalStorage
     ]);
     const set = useCallback((data)=>{
         const latestHistory = getLatestHistory();
@@ -124,10 +159,15 @@ export const useHistory = ()=>{
             currentIndex: -1,
             history: []
         };
-        const newHistory = [
+        // Create new history array slice, appending new data
+        let newHistory = [
             ...history.slice(0, currentIndex + 1),
             data
         ];
+        // Enforce Max History Size
+        if (newHistory.length > MAX_HISTORY_SIZE) {
+            newHistory = newHistory.slice(newHistory.length - MAX_HISTORY_SIZE);
+        }
         const newGlobalHistory = {
             ...latestHistory,
             [fieldKey]: {
@@ -205,11 +245,11 @@ export const useHistory = ()=>{
     const fieldHistory = getLatestFieldHistory();
     const canUndo = fieldHistory.currentIndex > 0;
     const canRedo = fieldHistory.currentIndex < fieldHistory.history.length - 1;
-    const currentValue = fieldHistory.history[fieldHistory.currentIndex];
+    // Note: We deliberately do not return currentValue to avoid subscription re-renders
+    // The consumers of this hook (UndoRedoActions) didn't use it anyway.
     return {
         canRedo,
         canUndo,
-        currentValue,
         redo,
         set,
         undo

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/ui/Compose/hooks/useHistory.ts"],"sourcesContent":["'use client'\n\nimport { useDocumentInfo, useField } from '@payloadcms/ui'\nimport { useCallback, useEffect, useRef } from 'react'\n\nimport { PLUGIN_NAME } from '../../../defaults.js'\nimport { useFieldProps } from '../../../providers/FieldProvider/useFieldProps.js'\n\nconst STORAGE_KEY = `${PLUGIN_NAME}-fields-history`\n\ninterface HistoryState {\n  [path: string]: {\n    currentIndex: number\n    history: any[]\n  }\n}\n\n// Global cache to prevent synchronous localStorage reads on every render\nlet globalHistoryCache: HistoryState | null = null\n\nexport const useHistory = () => {\n  const { id } = useDocumentInfo()\n  const { path: pathFromContext, schemaPath } = useFieldProps()\n  const { value: currentFieldValue } = useField<string>({\n    path: pathFromContext ?? '',\n  })\n\n  const fieldKey = `${id}.${schemaPath}`\n\n  const getLatestHistory = useCallback((): HistoryState => {\n    // Return cache if available\n    if (globalHistoryCache) {\n      return globalHistoryCache\n    }\n\n    try {\n      if (typeof localStorage !== 'undefined') {\n        // Read once, cache it\n        const stored = localStorage.getItem(STORAGE_KEY)\n        globalHistoryCache = stored ? JSON.parse(stored) : {}\n        return globalHistoryCache!\n      }\n      return {}\n    } catch (e) {\n      console.error('Error parsing history:', e)\n      return {}\n    }\n  }, [])\n\n  // Debounce timer ref to prevent excessive localStorage writes\n  const saveTimerRef = useRef<null | ReturnType<typeof setTimeout>>(null)\n\n  const saveToLocalStorage = useCallback((newGlobalHistory: HistoryState) => {\n    // Update cache immediately\n    globalHistoryCache = newGlobalHistory\n\n    if (typeof localStorage === 'undefined') {\n      return\n    }\n\n    // Clear any pending save\n    if (saveTimerRef.current) {\n      clearTimeout(saveTimerRef.current)\n    }\n\n    // Debounce the save operation by 300ms\n    saveTimerRef.current = setTimeout(() => {\n      // Use requestIdleCallback if available to avoid blocking the main thread\n      if (typeof requestIdleCallback !== 'undefined') {\n        requestIdleCallback(\n          () => {\n            localStorage.setItem(STORAGE_KEY, JSON.stringify(newGlobalHistory))\n          },\n          { timeout: 2000 },\n        )\n      } else {\n        // Fallback for browsers without requestIdleCallback\n        localStorage.setItem(STORAGE_KEY, JSON.stringify(newGlobalHistory))\n      }\n      saveTimerRef.current = null\n    }, 300)\n  }, [])\n\n  // Sync with other tabs\n  useEffect(() => {\n    const handleStorageChange = (e: StorageEvent) => {\n      if (e.key === STORAGE_KEY && e.newValue) {\n        try {\n          globalHistoryCache = JSON.parse(e.newValue)\n        } catch (err) {\n          // ignore parse error\n        }\n      }\n    }\n\n    window.addEventListener('storage', handleStorageChange)\n    return () => {\n      window.removeEventListener('storage', handleStorageChange)\n    }\n  }, [])\n\n  // Clear previous history\n  const clearHistory = useCallback(() => {\n    const latestHistory = { ...getLatestHistory() }\n    Object.keys(latestHistory).forEach((k) => {\n      if (!k.startsWith(id?.toString() ?? '')) {\n        delete latestHistory[k]\n      }\n    })\n    saveToLocalStorage(latestHistory)\n  }, [id, fieldKey, getLatestHistory, saveToLocalStorage])\n\n  useEffect(() => {\n    // This is applied to clear out the document history which is not currently in use\n    clearHistory()\n\n    const latestHistory = getLatestHistory()\n    const { currentIndex, history } = latestHistory[fieldKey] || {\n      currentIndex: -1,\n      history: [],\n    }\n\n    let newIndex = currentIndex\n    if (currentIndex == -1) {\n      newIndex = 0\n      if (currentFieldValue) {\n        history[newIndex] = currentFieldValue\n      }\n    }\n\n    const newGlobalHistory = {\n      ...latestHistory,\n      [fieldKey]: { currentIndex: newIndex, history },\n    }\n\n    saveToLocalStorage(newGlobalHistory)\n  }, [fieldKey])\n\n  const set = useCallback(\n    (data: any) => {\n      const latestHistory = getLatestHistory()\n      const { currentIndex, history } = latestHistory[fieldKey] || {\n        currentIndex: -1,\n        history: [],\n      }\n      const newHistory = [...history.slice(0, currentIndex + 1), data]\n      const newGlobalHistory = {\n        ...latestHistory,\n        [fieldKey]: { currentIndex: newHistory.length - 1, history: newHistory },\n      }\n      saveToLocalStorage(newGlobalHistory)\n      return data\n    },\n    [fieldKey, getLatestHistory, saveToLocalStorage],\n  )\n\n  const undo = useCallback(() => {\n    const latestHistory = getLatestHistory()\n    const { currentIndex, history } = latestHistory[fieldKey] || { currentIndex: -1, history: [] }\n    if (currentIndex > 0) {\n      const newIndex = currentIndex - 1\n      const newValue = history[newIndex]\n      const newGlobalHistory = {\n        ...latestHistory,\n        [fieldKey]: { currentIndex: newIndex, history },\n      }\n      saveToLocalStorage(newGlobalHistory)\n      return newValue\n    }\n    return undefined\n  }, [fieldKey, getLatestHistory, saveToLocalStorage])\n\n  const redo = useCallback(() => {\n    const latestHistory = getLatestHistory()\n    const { currentIndex, history } = latestHistory[fieldKey] || { currentIndex: -1, history: [] }\n    if (currentIndex < history.length - 1) {\n      const newIndex = currentIndex + 1\n      const newValue = history[newIndex]\n      const newGlobalHistory = {\n        ...latestHistory,\n        [fieldKey]: { currentIndex: newIndex, history },\n      }\n      saveToLocalStorage(newGlobalHistory)\n      return newValue\n    }\n    return undefined\n  }, [fieldKey, getLatestHistory, saveToLocalStorage])\n\n  const getLatestFieldHistory = useCallback(() => {\n    const latestHistory = getLatestHistory()\n    return latestHistory[fieldKey] || { currentIndex: -1, history: [] }\n  }, [getLatestHistory, fieldKey])\n\n  const fieldHistory = getLatestFieldHistory()\n\n  const canUndo = fieldHistory.currentIndex > 0\n  const canRedo = fieldHistory.currentIndex < fieldHistory.history.length - 1\n  const currentValue = fieldHistory.history[fieldHistory.currentIndex]\n\n  return {\n    canRedo,\n    canUndo,\n    currentValue,\n    redo,\n    set,\n    undo,\n  }\n}\n"],"names":["useDocumentInfo","useField","useCallback","useEffect","useRef","PLUGIN_NAME","useFieldProps","STORAGE_KEY","globalHistoryCache","useHistory","id","path","pathFromContext","schemaPath","value","currentFieldValue","fieldKey","getLatestHistory","localStorage","stored","getItem","JSON","parse","e","console","error","saveTimerRef","saveToLocalStorage","newGlobalHistory","current","clearTimeout","setTimeout","requestIdleCallback","setItem","stringify","timeout","handleStorageChange","key","newValue","err","window","addEventListener","removeEventListener","clearHistory","latestHistory","Object","keys","forEach","k","startsWith","toString","currentIndex","history","newIndex","set","data","newHistory","slice","length","undo","undefined","redo","getLatestFieldHistory","fieldHistory","canUndo","canRedo","currentValue"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/ui/Compose/hooks/useHistory.ts"],"sourcesContent":["'use client'\n\nimport { useDocumentInfo, useForm } from '@payloadcms/ui'\nimport { useCallback, useEffect, useRef } from 'react'\nimport { getSiblingData } from 'payload/shared'\n\nimport { PLUGIN_NAME } from '../../../defaults.js'\nimport { useFieldProps } from '../../../providers/FieldProvider/useFieldProps.js'\n\nconst STORAGE_KEY = `${PLUGIN_NAME}-fields-history`\nconst MAX_HISTORY_SIZE = 50\n\ninterface HistoryState {\n  [path: string]: {\n    currentIndex: number\n    history: any[]\n  }\n}\n\n// Global cache to prevent synchronous localStorage reads on every render\nlet globalHistoryCache: HistoryState | null = null\n\nexport const useHistory = () => {\n  const { id } = useDocumentInfo()\n  const { path, schemaPath } = useFieldProps()\n  const { getData } = useForm()\n\n  const fieldKey = `${id}.${schemaPath}`\n\n  const getLatestHistory = useCallback((): HistoryState => {\n    // Return cache if available\n    if (globalHistoryCache) {\n      return globalHistoryCache\n    }\n\n    try {\n      if (typeof localStorage !== 'undefined') {\n        // Read once, cache it\n        const stored = localStorage.getItem(STORAGE_KEY)\n        globalHistoryCache = stored ? JSON.parse(stored) : {}\n        return globalHistoryCache!\n      }\n      return {}\n    } catch (e) {\n      console.error('Error parsing history:', e)\n      return {}\n    }\n  }, [])\n\n  // Debounce timer ref to prevent excessive localStorage writes\n  const saveTimerRef = useRef<null | ReturnType<typeof setTimeout>>(null)\n\n  const saveToLocalStorage = useCallback((newGlobalHistory: HistoryState) => {\n    // Update cache immediately\n    globalHistoryCache = newGlobalHistory\n\n    if (typeof localStorage === 'undefined') {\n      return\n    }\n\n    // Clear any pending save\n    if (saveTimerRef.current) {\n      clearTimeout(saveTimerRef.current)\n    }\n\n    // Debounce the save operation by 500ms\n    saveTimerRef.current = setTimeout(() => {\n      // Use requestIdleCallback if available to avoid blocking the main thread\n      if (typeof requestIdleCallback !== 'undefined') {\n        requestIdleCallback(\n          () => {\n            try {\n              localStorage.setItem(STORAGE_KEY, JSON.stringify(newGlobalHistory))\n            } catch (e) {\n              console.warn('Failed to save history to localStorage', e)\n            }\n          },\n          { timeout: 2000 },\n        )\n      } else {\n        // Fallback for browsers without requestIdleCallback\n        try {\n          localStorage.setItem(STORAGE_KEY, JSON.stringify(newGlobalHistory))\n        } catch (e) {\n          console.warn('Failed to save history to localStorage', e)\n        }\n      }\n      saveTimerRef.current = null\n    }, 500)\n  }, [])\n\n  // Sync with other tabs\n  useEffect(() => {\n    const handleStorageChange = (e: StorageEvent) => {\n      if (e.key === STORAGE_KEY && e.newValue) {\n        try {\n          globalHistoryCache = JSON.parse(e.newValue)\n        } catch (err) {\n          // ignore parse error\n        }\n      }\n    }\n\n    window.addEventListener('storage', handleStorageChange)\n    return () => {\n      window.removeEventListener('storage', handleStorageChange)\n    }\n  }, [])\n\n  // Clear previous history\n  const clearHistory = useCallback(() => {\n    const latestHistory = { ...getLatestHistory() }\n    let hasChanges = false\n    Object.keys(latestHistory).forEach((k) => {\n      if (!k.startsWith(id?.toString() ?? '')) {\n        delete latestHistory[k]\n        hasChanges = true\n      }\n    })\n    \n    if (hasChanges) {\n      saveToLocalStorage(latestHistory)\n    }\n  }, [id, getLatestHistory, saveToLocalStorage])\n\n  useEffect(() => {\n    // This is applied to clear out the document history which is not currently in use\n    clearHistory()\n\n    const latestHistory = getLatestHistory()\n    const { currentIndex, history } = latestHistory[fieldKey] || {\n      currentIndex: -1,\n      history: [],\n    }\n\n    let newIndex = currentIndex\n    let historyUpdated = false\n    const newHistoryArray = [...history]\n\n    if (currentIndex == -1) {\n      newIndex = 0\n      \n      // Get initial value from form data instead of subscribing to useField\n      // This implementation avoids re-rendering on every keystroke\n      try {\n        const data = getData()\n        // We need to resolve the value from the data object using the path\n        // path might be 'group.subgroup.field'\n        if (path) {\n          const value = getSiblingData(data, path)\n          if (value) {\n            newHistoryArray[newIndex] = value\n            historyUpdated = true\n          }\n        }\n      } catch (e) {\n        // If we can't get the data, just ignore\n      }\n    }\n\n    if (historyUpdated) {\n      const newGlobalHistory = {\n        ...latestHistory,\n        [fieldKey]: { currentIndex: newIndex, history: newHistoryArray },\n      }\n      saveToLocalStorage(newGlobalHistory)\n    }\n  }, [fieldKey, getData, path, clearHistory, getLatestHistory, saveToLocalStorage])\n\n  const set = useCallback(\n    (data: any) => {\n      const latestHistory = getLatestHistory()\n      const { currentIndex, history } = latestHistory[fieldKey] || {\n        currentIndex: -1,\n        history: [],\n      }\n      \n      // Create new history array slice, appending new data\n      let newHistory = [...history.slice(0, currentIndex + 1), data]\n      \n      // Enforce Max History Size\n      if (newHistory.length > MAX_HISTORY_SIZE) {\n        newHistory = newHistory.slice(newHistory.length - MAX_HISTORY_SIZE)\n      }\n      \n      const newGlobalHistory = {\n        ...latestHistory,\n        [fieldKey]: { currentIndex: newHistory.length - 1, history: newHistory },\n      }\n      saveToLocalStorage(newGlobalHistory)\n      return data\n    },\n    [fieldKey, getLatestHistory, saveToLocalStorage],\n  )\n\n  const undo = useCallback(() => {\n    const latestHistory = getLatestHistory()\n    const { currentIndex, history } = latestHistory[fieldKey] || { currentIndex: -1, history: [] }\n    if (currentIndex > 0) {\n      const newIndex = currentIndex - 1\n      const newValue = history[newIndex]\n      const newGlobalHistory = {\n        ...latestHistory,\n        [fieldKey]: { currentIndex: newIndex, history },\n      }\n      saveToLocalStorage(newGlobalHistory)\n      return newValue\n    }\n    return undefined\n  }, [fieldKey, getLatestHistory, saveToLocalStorage])\n\n  const redo = useCallback(() => {\n    const latestHistory = getLatestHistory()\n    const { currentIndex, history } = latestHistory[fieldKey] || { currentIndex: -1, history: [] }\n    if (currentIndex < history.length - 1) {\n      const newIndex = currentIndex + 1\n      const newValue = history[newIndex]\n      const newGlobalHistory = {\n        ...latestHistory,\n        [fieldKey]: { currentIndex: newIndex, history },\n      }\n      saveToLocalStorage(newGlobalHistory)\n      return newValue\n    }\n    return undefined\n  }, [fieldKey, getLatestHistory, saveToLocalStorage])\n\n  const getLatestFieldHistory = useCallback(() => {\n    const latestHistory = getLatestHistory()\n    return latestHistory[fieldKey] || { currentIndex: -1, history: [] }\n  }, [getLatestHistory, fieldKey])\n\n  const fieldHistory = getLatestFieldHistory()\n\n  const canUndo = fieldHistory.currentIndex > 0\n  const canRedo = fieldHistory.currentIndex < fieldHistory.history.length - 1\n  \n  // Note: We deliberately do not return currentValue to avoid subscription re-renders\n  // The consumers of this hook (UndoRedoActions) didn't use it anyway.\n\n  return {\n    canRedo,\n    canUndo,\n    redo,\n    set,\n    undo,\n  }\n}\n"],"names":["useDocumentInfo","useForm","useCallback","useEffect","useRef","getSiblingData","PLUGIN_NAME","useFieldProps","STORAGE_KEY","MAX_HISTORY_SIZE","globalHistoryCache","useHistory","id","path","schemaPath","getData","fieldKey","getLatestHistory","localStorage","stored","getItem","JSON","parse","e","console","error","saveTimerRef","saveToLocalStorage","newGlobalHistory","current","clearTimeout","setTimeout","requestIdleCallback","setItem","stringify","warn","timeout","handleStorageChange","key","newValue","err","window","addEventListener","removeEventListener","clearHistory","latestHistory","hasChanges","Object","keys","forEach","k","startsWith","toString","currentIndex","history","newIndex","historyUpdated","newHistoryArray","data","value","set","newHistory","slice","length","undo","undefined","redo","getLatestFieldHistory","fieldHistory","canUndo","canRedo"],"mappings":"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"}

package/dist/ui/Compose/hooks/useStreamingUpdate.d.ts

@@ -0,0 +1,8 @@
+import type { LexicalEditor } from 'lexical';
+type UseStreamingUpdateParams = {
+    editor: LexicalEditor;
+    isLoading: boolean;
+    object: any;
+};
+export declare const useStreamingUpdate: ({ editor, isLoading, object }: UseStreamingUpdateParams) => void;
+export {};

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

@@ -0,0 +1,48 @@
+import { useForm } from '@payloadcms/ui';
+import { useEffect, useRef } from 'react';
+import { useFieldProps } from '../../../providers/FieldProvider/useFieldProps.js';
+import { setSafeLexicalState } from '../../../utilities/setSafeLexicalState.js';
+export const useStreamingUpdate = ({ editor, isLoading, object })=>{
+    const { field, path: pathFromContext } = useFieldProps();
+    const { dispatchFields } = useForm();
+    // Ref for latest object to avoid effect re-runs during high-frequency streaming
+    const objectRef = useRef(object);
+    objectRef.current = object;
+    useEffect(()=>{
+        // Only run the animation loop while loading (streaming)
+        if (!isLoading) {
+            return;
+        }
+        let reqId;
+        const loop = ()=>{
+            const currentObject = objectRef.current;
+            if (currentObject) {
+                if (field?.type === 'richText') {
+                    setSafeLexicalState(currentObject, editor);
+                } else if (field && 'name' in field && currentObject[field.name]) {
+                    // Use dispatchFields for high-frequency streaming updates to avoid re-renders
+                    dispatchFields({
+                        type: 'UPDATE',
+                        path: pathFromContext ?? '',
+                        value: currentObject[field.name]
+                    });
+                }
+            }
+            // Continue loop
+            reqId = requestAnimationFrame(loop);
+        };
+        // Start loop
+        loop();
+        return ()=>{
+            cancelAnimationFrame(reqId);
+        };
+    }, [
+        isLoading,
+        editor,
+        field,
+        dispatchFields,
+        pathFromContext
+    ]);
+};
+
+//# sourceMappingURL=useStreamingUpdate.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/ui/Compose/hooks/useStreamingUpdate.ts"],"sourcesContent":["import type { LexicalEditor } from 'lexical'\n\nimport { useForm } from '@payloadcms/ui'\nimport { useEffect, useRef } from 'react'\n\nimport { useFieldProps } from '../../../providers/FieldProvider/useFieldProps.js'\nimport { setSafeLexicalState } from '../../../utilities/setSafeLexicalState.js'\n\ntype UseStreamingUpdateParams = {\n  editor: LexicalEditor\n  isLoading: boolean\n  object: any\n}\n\nexport const useStreamingUpdate = ({ editor, isLoading, object }: UseStreamingUpdateParams) => {\n  const { field, path: pathFromContext } = useFieldProps()\n  const { dispatchFields } = useForm()\n\n  // Ref for latest object to avoid effect re-runs during high-frequency streaming\n  const objectRef = useRef(object)\n  objectRef.current = object\n\n  useEffect(() => {\n    // Only run the animation loop while loading (streaming)\n    if (!isLoading) {\n      return\n    }\n\n    let reqId: number\n\n    const loop = () => {\n      const currentObject = objectRef.current\n\n      if (currentObject) {\n        if (field?.type === 'richText') {\n          setSafeLexicalState(currentObject, editor)\n        } else if (field && 'name' in field && currentObject[field.name]) {\n          // Use dispatchFields for high-frequency streaming updates to avoid re-renders\n          dispatchFields({\n            type: 'UPDATE',\n            path: pathFromContext ?? '',\n            value: currentObject[field.name],\n          } as any)\n        }\n      }\n\n      // Continue loop\n      reqId = requestAnimationFrame(loop)\n    }\n\n    // Start loop\n    loop()\n\n    return () => {\n      cancelAnimationFrame(reqId)\n    }\n  }, [isLoading, editor, field, dispatchFields, pathFromContext])\n}\n"],"names":["useForm","useEffect","useRef","useFieldProps","setSafeLexicalState","useStreamingUpdate","editor","isLoading","object","field","path","pathFromContext","dispatchFields","objectRef","current","reqId","loop","currentObject","type","name","value","requestAnimationFrame","cancelAnimationFrame"],"mappings":"AAEA,SAASA,OAAO,QAAQ,iBAAgB;AACxC,SAASC,SAAS,EAAEC,MAAM,QAAQ,QAAO;AAEzC,SAASC,aAAa,QAAQ,oDAAmD;AACjF,SAASC,mBAAmB,QAAQ,4CAA2C;AAQ/E,OAAO,MAAMC,qBAAqB,CAAC,EAAEC,MAAM,EAAEC,SAAS,EAAEC,MAAM,EAA4B;IACxF,MAAM,EAAEC,KAAK,EAAEC,MAAMC,eAAe,EAAE,GAAGR;IACzC,MAAM,EAAES,cAAc,EAAE,GAAGZ;IAE3B,gFAAgF;IAChF,MAAMa,YAAYX,OAAOM;IACzBK,UAAUC,OAAO,GAAGN;IAEpBP,UAAU;QACR,wDAAwD;QACxD,IAAI,CAACM,WAAW;YACd;QACF;QAEA,IAAIQ;QAEJ,MAAMC,OAAO;YACX,MAAMC,gBAAgBJ,UAAUC,OAAO;YAEvC,IAAIG,eAAe;gBACjB,IAAIR,OAAOS,SAAS,YAAY;oBAC9Bd,oBAAoBa,eAAeX;gBACrC,OAAO,IAAIG,SAAS,UAAUA,SAASQ,aAAa,CAACR,MAAMU,IAAI,CAAC,EAAE;oBAChE,8EAA8E;oBAC9EP,eAAe;wBACbM,MAAM;wBACNR,MAAMC,mBAAmB;wBACzBS,OAAOH,aAAa,CAACR,MAAMU,IAAI,CAAC;oBAClC;gBACF;YACF;YAEA,gBAAgB;YAChBJ,QAAQM,sBAAsBL;QAChC;QAEA,aAAa;QACbA;QAEA,OAAO;YACLM,qBAAqBP;QACvB;IACF,GAAG;QAACR;QAAWD;QAAQG;QAAOG;QAAgBD;KAAgB;AAChE,EAAC"}

package/dist/ui/ConfigDashboard/index.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const ConfigDashboard: React.FC;

package/dist/ui/ConfigDashboard/index.js

@@ -0,0 +1,224 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, toast, useConfig } from '@payloadcms/ui';
+// @ts-expect-error - Next.js types are not resolving correctly with nodenext but runtime is fine
+import { useRouter } from 'next/navigation';
+import React, { use, useEffect, useState } from 'react';
+import { excludeCollections } from '../../defaults.js';
+import { InstructionsContext } from '../../providers/InstructionsProvider/context.js';
+export const ConfigDashboard = ()=>{
+    const { config: { collections, routes: { admin: adminRoute, api: apiRoute } } } = useConfig();
+    const router = useRouter();
+    const { refresh, setEnabledCollections: setEnabledCollectionsInContext } = use(InstructionsContext);
+    const [enabledCollections, setEnabledCollections] = useState([]);
+    const [isLoading, setIsLoading] = useState(true);
+    const [isSaving, setIsSaving] = useState(false);
+    const availableCollections = collections.filter((c)=>!excludeCollections.includes(c.slug) && !c.admin?.hidden);
+    useEffect(()=>{
+        const fetchSettings = async ()=>{
+            try {
+                const response = await fetch(`${apiRoute}/globals/ai-providers`);
+                if (response.ok) {
+                    const data = await response.json();
+                    // Handle both simple array and object wrapper if Payload wraps it
+                    const storedEnabled = data.enabledCollections || [];
+                    setEnabledCollections(Array.isArray(storedEnabled) ? storedEnabled : []);
+                }
+            } catch (error) {
+                console.error('Failed to fetch AI settings:', error);
+            } finally{
+                setIsLoading(false);
+            }
+        };
+        fetchSettings().catch((e)=>{
+            console.log(e);
+        });
+    }, [
+        apiRoute
+    ]);
+    const handleToggle = (slug)=>{
+        setEnabledCollections((prev)=>{
+            if (prev.includes(slug)) {
+                return prev.filter((s)=>s !== slug);
+            }
+            return [
+                ...prev,
+                slug
+            ];
+        });
+    };
+    const handleSave = async ()=>{
+        setIsSaving(true);
+        try {
+            // First fetch current settings to get ID or just rely on global update behavior
+            // We need to adhere to Payload's global update API
+            const response = await fetch(`${apiRoute}/globals/ai-providers`, {
+                body: JSON.stringify({
+                    enabledCollections
+                }),
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                method: 'POST'
+            });
+            if (response.ok) {
+                toast.success('Settings saved successfully');
+                if (setEnabledCollectionsInContext) {
+                    setEnabledCollectionsInContext(enabledCollections);
+                }
+                if (refresh) {
+                    await refresh();
+                }
+                router.refresh();
+            } else {
+                toast.error('Failed to save settings');
+            }
+        } catch (error) {
+            console.error('Error saving settings:', error);
+            toast.error('Error saving settings');
+        } finally{
+            setIsSaving(false);
+        }
+    };
+    if (isLoading) {
+        return /*#__PURE__*/ _jsx("div", {
+            style: {
+                padding: '20px',
+                textAlign: 'center'
+            },
+            children: "Loading configuration..."
+        });
+    }
+    return /*#__PURE__*/ _jsxs("div", {
+        style: {
+            background: 'var(--theme-elevation-50)',
+            // border: '1px solid var(--theme-elevation-150)',
+            // borderRadius: '8px',
+            // borderBottom: '1px solid var(--theme-elevation-150)',
+            // borderTop: '1px solid var(--theme-elevation-150)',
+            marginBottom: '20px',
+            overflow: 'hidden'
+        },
+        children: [
+            /*#__PURE__*/ _jsxs("div", {
+                style: {
+                    alignItems: 'center',
+                    borderBottom: '1px solid var(--theme-elevation-150)',
+                    display: 'flex',
+                    justifyContent: 'space-between',
+                    padding: '8px var(--gutter-h)'
+                },
+                children: [
+                    /*#__PURE__*/ _jsxs("div", {
+                        children: [
+                            /*#__PURE__*/ _jsx("h2", {
+                                style: {
+                                    margin: '0 0 5px 0'
+                                },
+                                children: "Let's configure your AI Plugin"
+                            }),
+                            /*#__PURE__*/ _jsx("p", {
+                                style: {
+                                    color: 'var(--theme-elevation-500)',
+                                    fontSize: '14px',
+                                    margin: '0'
+                                },
+                                children: "Set up the provider → Choose the content → Refine the behavior."
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs("div", {
+                        style: {
+                            display: 'flex',
+                            gap: '10px'
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsx(Button, {
+                                buttonStyle: "secondary",
+                                el: "link",
+                                to: `${adminRoute}/globals/ai-providers`,
+                                children: "Providers"
+                            }),
+                            /*#__PURE__*/ _jsx(Button, {
+                                disabled: isSaving,
+                                onClick: handleSave,
+                                children: isSaving ? 'Saving...' : 'Save Changes'
+                            })
+                        ]
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsxs("div", {
+                style: {
+                    padding: '24px var(--gutter-h)'
+                },
+                children: [
+                    /*#__PURE__*/ _jsx("h5", {
+                        style: {
+                            marginBottom: '15px'
+                        },
+                        children: "Select the collections where AI features should be available, toggle them on or off, and save your changes."
+                    }),
+                    /*#__PURE__*/ _jsx("div", {
+                        style: {
+                            display: 'grid',
+                            gap: '15px',
+                            gridTemplateColumns: 'repeat(auto-fill, minmax(250px, 1fr))'
+                        },
+                        children: availableCollections.map((collection)=>{
+                            const isEnabled = enabledCollections.includes(collection.slug);
+                            return /*#__PURE__*/ _jsxs("button", {
+                                onClick: ()=>handleToggle(collection.slug),
+                                style: {
+                                    alignItems: 'center',
+                                    background: isEnabled ? 'var(--theme-elevation-100)' : 'var(--theme-elevation-50)',
+                                    border: `1px solid ${isEnabled ? 'var(--theme-text-success)' : 'var(--theme-elevation-200)'}`,
+                                    borderRadius: '6px',
+                                    cursor: 'pointer',
+                                    display: 'flex',
+                                    gap: '10px',
+                                    padding: '10px 15px',
+                                    textAlign: 'left',
+                                    transition: 'all 0.2s ease',
+                                    width: '100%'
+                                },
+                                type: "button",
+                                children: [
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            alignItems: 'center',
+                                            background: isEnabled ? 'var(--theme-text-success)' : 'var(--theme-elevation-200)',
+                                            borderRadius: '12px',
+                                            display: 'flex',
+                                            height: '24px',
+                                            justifyContent: isEnabled ? 'flex-end' : 'flex-start',
+                                            padding: '2px',
+                                            transition: 'all 0.2s ease',
+                                            width: '44px'
+                                        },
+                                        children: /*#__PURE__*/ _jsx("div", {
+                                            style: {
+                                                background: 'white',
+                                                borderRadius: '50%',
+                                                height: '20px',
+                                                width: '20px'
+                                            }
+                                        })
+                                    }),
+                                    /*#__PURE__*/ _jsx("span", {
+                                        style: {
+                                            fontWeight: 500
+                                        },
+                                        children: typeof collection.labels?.singular === 'string' ? collection.labels.singular : collection.labels?.singular?.en || collection.slug
+                                    })
+                                ]
+                            }, collection.slug);
+                        })
+                    })
+                ]
+            })
+        ]
+    });
+};
+
+//# sourceMappingURL=index.js.map

package/dist/ui/ConfigDashboard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/ConfigDashboard/index.tsx"],"sourcesContent":["'use client'\n\nimport { Button, toast, useConfig } from '@payloadcms/ui'\n// @ts-expect-error - Next.js types are not resolving correctly with nodenext but runtime is fine\nimport { useRouter } from 'next/navigation'\nimport React, { use, useEffect, useState } from 'react'\n\nimport { excludeCollections } from '../../defaults.js'\nimport { InstructionsContext } from '../../providers/InstructionsProvider/context.js'\n\nexport const ConfigDashboard: React.FC = () => {\n  const {\n    config: {\n      collections,\n      routes: { admin: adminRoute, api: apiRoute },\n    },\n  } = useConfig()\n  const router = useRouter()\n  const { refresh, setEnabledCollections: setEnabledCollectionsInContext } =\n    use(InstructionsContext)\n\n  const [enabledCollections, setEnabledCollections] = useState<string[]>([])\n  const [isLoading, setIsLoading] = useState(true)\n  const [isSaving, setIsSaving] = useState(false)\n\n  const availableCollections = collections.filter(\n    (c) =>\n      !excludeCollections.includes(c.slug) &&\n      !(c.admin as unknown as { hidden?: ((args: any) => boolean) | boolean })?.hidden,\n  )\n\n  useEffect(() => {\n    const fetchSettings = async () => {\n      try {\n        const response = await fetch(`${apiRoute}/globals/ai-providers`)\n        if (response.ok) {\n          const data = await response.json()\n          // Handle both simple array and object wrapper if Payload wraps it\n          const storedEnabled = data.enabledCollections || []\n          setEnabledCollections(Array.isArray(storedEnabled) ? storedEnabled : [])\n        }\n      } catch (error) {\n        console.error('Failed to fetch AI settings:', error)\n      } finally {\n        setIsLoading(false)\n      }\n    }\n\n    fetchSettings().catch((e) => {\n      console.log(e)\n    })\n  }, [apiRoute])\n\n  const handleToggle = (slug: string) => {\n    setEnabledCollections((prev) => {\n      if (prev.includes(slug)) {\n        return prev.filter((s) => s !== slug)\n      }\n      return [...prev, slug]\n    })\n  }\n\n  const handleSave = async () => {\n    setIsSaving(true)\n    try {\n      // First fetch current settings to get ID or just rely on global update behavior\n      // We need to adhere to Payload's global update API\n      const response = await fetch(`${apiRoute}/globals/ai-providers`, {\n        body: JSON.stringify({\n          enabledCollections,\n        }),\n        headers: {\n          'Content-Type': 'application/json',\n        },\n        method: 'POST',\n      })\n\n      if (response.ok) {\n        toast.success('Settings saved successfully')\n        if (setEnabledCollectionsInContext) {\n          setEnabledCollectionsInContext(enabledCollections)\n        }\n        if (refresh) {\n          await refresh()\n        }\n        router.refresh()\n      } else {\n        toast.error('Failed to save settings')\n      }\n    } catch (error) {\n      console.error('Error saving settings:', error)\n      toast.error('Error saving settings')\n    } finally {\n      setIsSaving(false)\n    }\n  }\n\n  if (isLoading) {\n    return <div style={{ padding: '20px', textAlign: 'center' }}>Loading configuration...</div>\n  }\n\n  return (\n    <div\n      style={{\n        background: 'var(--theme-elevation-50)',\n        // border: '1px solid var(--theme-elevation-150)',\n        // borderRadius: '8px',\n        // borderBottom: '1px solid var(--theme-elevation-150)',\n        // borderTop: '1px solid var(--theme-elevation-150)',\n        marginBottom: '20px',\n        overflow: 'hidden',\n      }}\n    >\n      <div\n        style={{\n          alignItems: 'center',\n          borderBottom: '1px solid var(--theme-elevation-150)',\n          display: 'flex',\n          justifyContent: 'space-between',\n          padding: '8px var(--gutter-h)',\n        }}\n      >\n        <div>\n          <h2 style={{ margin: '0 0 5px 0' }}>Let's configure your AI Plugin</h2>\n          <p style={{ color: 'var(--theme-elevation-500)', fontSize: '14px', margin: '0' }}>\n            Set up the provider → Choose the content → Refine the behavior.\n          </p>\n        </div>\n        <div style={{ display: 'flex', gap: '10px' }}>\n          <Button buttonStyle=\"secondary\" el=\"link\" to={`${adminRoute}/globals/ai-providers`}>\n            Providers\n          </Button>\n          <Button disabled={isSaving} onClick={handleSave}>\n            {isSaving ? 'Saving...' : 'Save Changes'}\n          </Button>\n        </div>\n      </div>\n\n      <div style={{ padding: '24px var(--gutter-h)' }}>\n        <h5 style={{ marginBottom: '15px' }}>\n          Select the collections where AI features should be available, toggle them on or off, and\n          save your changes.\n        </h5>\n        <div\n          style={{\n            display: 'grid',\n            gap: '15px',\n            gridTemplateColumns: 'repeat(auto-fill, minmax(250px, 1fr))',\n          }}\n        >\n          {availableCollections.map((collection) => {\n            const isEnabled = enabledCollections.includes(collection.slug)\n            return (\n              <button\n                key={collection.slug}\n                onClick={() => handleToggle(collection.slug)}\n                style={{\n                  alignItems: 'center',\n                  background: isEnabled\n                    ? 'var(--theme-elevation-100)'\n                    : 'var(--theme-elevation-50)',\n                  border: `1px solid ${isEnabled ? 'var(--theme-text-success)' : 'var(--theme-elevation-200)'}`,\n                  borderRadius: '6px',\n                  cursor: 'pointer',\n                  display: 'flex',\n                  gap: '10px',\n                  padding: '10px 15px',\n                  textAlign: 'left',\n                  transition: 'all 0.2s ease',\n                  width: '100%',\n                }}\n                type=\"button\"\n              >\n                <div\n                  style={{\n                    alignItems: 'center',\n                    background: isEnabled\n                      ? 'var(--theme-text-success)'\n                      : 'var(--theme-elevation-200)',\n                    borderRadius: '12px',\n                    display: 'flex',\n                    height: '24px',\n                    justifyContent: isEnabled ? 'flex-end' : 'flex-start',\n                    padding: '2px',\n                    transition: 'all 0.2s ease',\n                    width: '44px',\n                  }}\n                >\n                  <div\n                    style={{\n                      background: 'white',\n                      borderRadius: '50%',\n                      height: '20px',\n                      width: '20px',\n                    }}\n                  />\n                </div>\n                <span style={{ fontWeight: 500 }}>\n                  {typeof collection.labels?.singular === 'string'\n                    ? collection.labels.singular\n                    : collection.labels?.singular?.en || collection.slug}\n                </span>\n              </button>\n            )\n          })}\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"names":["Button","toast","useConfig","useRouter","React","use","useEffect","useState","excludeCollections","InstructionsContext","ConfigDashboard","config","collections","routes","admin","adminRoute","api","apiRoute","router","refresh","setEnabledCollections","setEnabledCollectionsInContext","enabledCollections","isLoading","setIsLoading","isSaving","setIsSaving","availableCollections","filter","c","includes","slug","hidden","fetchSettings","response","fetch","ok","data","json","storedEnabled","Array","isArray","error","console","catch","e","log","handleToggle","prev","s","handleSave","body","JSON","stringify","headers","method","success","div","style","padding","textAlign","background","marginBottom","overflow","alignItems","borderBottom","display","justifyContent","h2","margin","p","color","fontSize","gap","buttonStyle","el","to","disabled","onClick","h5","gridTemplateColumns","map","collection","isEnabled","button","border","borderRadius","cursor","transition","width","type","height","span","fontWeight","labels","singular","en"],"mappings":"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"}