@descope-ui/common 0.0.2 → 0.0.3

package/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [0.0.3](https://github.com/descope/web-components-ui/compare/@descope-ui/common-0.0.2...@descope-ui/common-0.0.3) (2025-02-04)
+
 ## [0.0.2](https://github.com/descope/web-components-ui/compare/@descope-ui/common-0.0.1...@descope-ui/common-0.0.2) (2025-01-28)
 
 ## 0.0.1 (2025-01-28)

package/package.json

@@ -1,9 +1,10 @@
 {
   "name": "@descope-ui/common",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "dependencies": {
     "element-internals-polyfill": "^1.3.9",
     "color": "^4.2.3",
+    "lodash.debounce": "4.0.8",
     "lodash.merge": "4.6.2"
   },
   "exports": {

package/src/utils/asyncDebounce.js

@@ -0,0 +1,58 @@
+import debounce from 'lodash.debounce';
+
+/**
+ * Creates a debounced version of an async function that manages multiple pending promises and ensures proper error handling.
+ * When multiple calls are made within the wait period, all pending promises will be resolved/rejected with the result/error
+ * of the most recent call.
+ *
+ * @param {Function} func - The async function to debounce.
+ * @param {number} wait - The number of milliseconds to delay before calling the function.
+ * @returns {Function} A debounced version of the input function that returns a promise which will resolve/reject based on
+ *                    the most recent call's result.
+ *
+ * @example
+ * const debouncedSearch = asyncDebounce(async (query) => {
+ *   const results = await api.search(query);
+ *   return results;
+ * }, 300);
+ *
+ * // Multiple calls within 300ms will all resolve with the results from the last call
+ * const promise1 = debouncedSearch('search');
+ * const promise2 = debouncedSearch('search term');
+ * // Both promises will resolve with results from 'search term'
+ *
+ * // If the last call throws an error, all pending promises will be rejected
+ * try {
+ *   await debouncedSearch('error term');
+ * } catch (error) {
+ *   // Handle error
+ * }
+ */
+export const asyncDebounce = (func, wait) => {
+  let currentId = 0;
+  const resolveSet = new Set();
+  const rejectSet = new Set();
+
+  const debounced = debounce((args, requestId) => {
+    func(...args)
+      .then((result) => {
+        if (requestId === currentId) {
+          resolveSet.forEach((resolve) => resolve(result));
+          resolveSet.clear();
+        }
+      })
+      .catch((error) => {
+        rejectSet.forEach((reject) => reject(error));
+        rejectSet.clear();
+      });
+  }, wait);
+
+  return (...args) => {
+    currentId++; // Increment for new request
+    return new Promise((resolve, reject) => {
+      resolveSet.add(resolve);
+      rejectSet.add(reject);
+      debounced(args, currentId);
+    });
+  };
+};

package/src/utils/index.js

@@ -1,10 +1,13 @@
+export { asyncDebounce } from './asyncDebounce';
+
 export const kebabCase = (str) =>
   str
     .replace(/([a-z])([A-Z])/g, '$1-$2')
     .replace(/[\s_.]+/g, '-')
     .toLowerCase();
 
-export const kebabCaseJoin = (...args) => kebabCase(args.filter((arg) => !!arg).join('-'));
+export const kebabCaseJoin = (...args) =>
+  kebabCase(args.filter((arg) => !!arg).join('-'));
 
 export const upperFirst = (str) => str.charAt(0).toUpperCase() + str.slice(1);