@pushwoosh/kit-helpers 4.12.6 → 4.12.7

package/hooks/usePersistentFunction.d.ts

@@ -7,6 +7,9 @@
  * Unlike using plain `useCallback`, this approach ensures that the latest version of the
  * callback is always used, even if the reference remains stable.
  *
+ * The stored callback is refreshed at commit, so a render prop that calls the returned function while
+ * rendering (Slate's `renderElement`) runs the previous render's callback; handlers are unaffected.
+ *
  * @param callback - The function that should be persisted
  * @returns A stable function reference that will always call the most recent version of the provided callback
  *
@@ -43,5 +46,19 @@
  *
  *   return <div>...</div>;
  * };
+ *
+ * @example
+ * // Render props run during render, so they see the previous render's callback
+ * const MyEditor = () => {
+ *   const [active, setActive] = useState(true);
+ *
+ *   const renderElement = usePersistentFunction((props) => (
+ *     <Element {...props} onDelete={() => setActive(false)} />
+ *   ));
+ *
+ *   // Fine here: the callback closes over `setActive`, which React keeps stable.
+ *   // Reading `active` inside it would give the previous render's value instead.
+ *   return <Editable renderElement={renderElement} />;
+ * };
  */
 export default function usePersistentFunction<Args extends unknown[], Return>(callback: (...args: Args) => Return): (...args: Args) => Return;

package/hooks/usePersistentFunction.js

@@ -8,6 +8,9 @@ import { useInsertionEffect, useRef } from 'react';
  * Unlike using plain `useCallback`, this approach ensures that the latest version of the
  * callback is always used, even if the reference remains stable.
  *
+ * The stored callback is refreshed at commit, so a render prop that calls the returned function while
+ * rendering (Slate's `renderElement`) runs the previous render's callback; handlers are unaffected.
+ *
  * @param callback - The function that should be persisted
  * @returns A stable function reference that will always call the most recent version of the provided callback
  *
@@ -44,6 +47,20 @@ import { useInsertionEffect, useRef } from 'react';
  *
  *   return <div>...</div>;
  * };
+ *
+ * @example
+ * // Render props run during render, so they see the previous render's callback
+ * const MyEditor = () => {
+ *   const [active, setActive] = useState(true);
+ *
+ *   const renderElement = usePersistentFunction((props) => (
+ *     <Element {...props} onDelete={() => setActive(false)} />
+ *   ));
+ *
+ *   // Fine here: the callback closes over `setActive`, which React keeps stable.
+ *   // Reading `active` inside it would give the previous render's value instead.
+ *   return <Editable renderElement={renderElement} />;
+ * };
  */
 export default function usePersistentFunction(callback) {
   const holderRef = useRef(null);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pushwoosh/kit-helpers",
-  "version": "4.12.6",
+  "version": "4.12.7",
   "description": "React component for build Pushwoosh products",
   "main": "index.js",
   "module": "index.js",