@canonical/utils 0.2.0-experimental.0

package/README.md

@@ -0,0 +1,7 @@
+## Canonical Web Team Utils
+
+This package contains a collection of utilities that are used across the Canonical Web Team's projects.
+
+### Utils list
+- [debounce](./src/debounce/README.md)
+- [throttle](./src/throttle/README.md)

package/dist/esm/debounce.js

@@ -0,0 +1,46 @@
+/**
+ * Creates a debounced version of a function, ensuring it is called only after a specified
+ * delay from the last invocation.
+ *
+ * @template F The type of the function to debounce
+ * @param fn - The function to debounce.
+ * @param delay - The time in milliseconds to wait before calling the function after the last call.
+ * @returns A debounced version of the function that returns a promise.
+ *
+ * @example
+ * // Example usage of the debounce function
+ * const debouncedFetchData = debounce(async (query: string) => {
+ *   const response = await fetch(`/api/search?q=${query}`);
+ *   return response.json();
+ * }, 300);
+ *
+ * // Calling the debounced function multiple times
+ * debouncedFetchData("hello").then(console.log); // Will only call fetch once after 300ms delay
+ * debouncedFetchData("world").then(console.log); // Will cancel the previous call and make a new one
+ */
+export default function debounce(fn, delay) {
+    let timeoutId = null;
+    let promiseReject = null;
+    return (...args) => {
+        // Timer already exists, clear it and reject the promise
+        if (timeoutId) {
+            clearTimeout(timeoutId);
+            if (promiseReject) {
+                promiseReject();
+            }
+        }
+        return new Promise((resolve, reject) => {
+            promiseReject = reject;
+            timeoutId = setTimeout(async () => {
+                // Timer hasn't been cancelled, call the function
+                try {
+                    resolve(fn(...args));
+                }
+                catch (error) {
+                    reject(error);
+                }
+            }, delay);
+        });
+    };
+}
+//# sourceMappingURL=debounce.js.map

package/dist/esm/debounce.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"debounce.js","sourceRoot":"","sources":["../../src/debounce.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,CAAC,OAAO,UAAU,QAAQ,CAE9B,EAAK,EAAE,KAAa;IACpB,IAAI,SAAS,GAAyC,IAAI,CAAC;IAC3D,IAAI,aAAa,GAAuC,IAAI,CAAC;IAE7D,OAAO,CAAC,GAAG,IAAmB,EAA0B,EAAE;QACxD,wDAAwD;QACxD,IAAI,SAAS,EAAE,CAAC;YACd,YAAY,CAAC,SAAS,CAAC,CAAC;YACxB,IAAI,aAAa,EAAE,CAAC;gBAClB,aAAa,EAAE,CAAC;YAClB,CAAC;QACH,CAAC;QAED,OAAO,IAAI,OAAO,CAAgB,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;YACpD,aAAa,GAAG,MAAM,CAAC;YACvB,SAAS,GAAG,UAAU,CAAC,KAAK,IAAI,EAAE;gBAChC,iDAAiD;gBACjD,IAAI,CAAC;oBACH,OAAO,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC;gBACvB,CAAC;gBAAC,OAAO,KAAK,EAAE,CAAC;oBACf,MAAM,CAAC,KAAK,CAAC,CAAC;gBAChB,CAAC;YACH,CAAC,EAAE,KAAK,CAAC,CAAC;QACZ,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;AACJ,CAAC"}

package/dist/esm/index.js

@@ -0,0 +1,3 @@
+export { default as debounce } from "./debounce.js";
+export { default as throttle } from "./throttle.js";
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAC"}

package/dist/esm/throttle.js

@@ -0,0 +1,29 @@
+/**
+ * Throttles a function invocation to at most once every `wait` milliseconds.
+ * @template T The type of the function to throttle
+ * @param func - The function to throttle
+ * @param wait - The time in milliseconds to wait between invocations
+ * @returns A throttled version of the function
+ * @see Throttling function calls, by Remy Sharp
+ *  http://remysharp.com/2010/07/21/throttling-function-calls/
+ *
+ * @example
+ *
+ * window.addEventListener(
+ *   'resize',
+ *   throttle(() => {
+ *     console.log("window was resized!");
+ *   }, 500)
+ * );
+ */
+export default function throttle(func, wait) {
+    let timer = null;
+    return function (...args) {
+        if (timer)
+            clearTimeout(timer);
+        timer = setTimeout(() => {
+            func.apply(this, args);
+        }, wait);
+    };
+}
+//# sourceMappingURL=throttle.js.map

package/dist/esm/throttle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"throttle.js","sourceRoot":"","sources":["../../src/throttle.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,CAAC,OAAO,UAAU,QAAQ,CAE9B,IAAO,EAAE,IAAY;IACrB,IAAI,KAAK,GAA0B,IAAI,CAAC;IACxC,OAAO,UAAyB,GAAG,IAAmB;QACpD,IAAI,KAAK;YAAE,YAAY,CAAC,KAAK,CAAC,CAAC;QAC/B,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE;YACtB,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;QACzB,CAAC,EAAE,IAAI,CAAC,CAAC;IACX,CAAC,CAAC;AACJ,CAAC"}

package/dist/types/debounce.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Creates a debounced version of a function, ensuring it is called only after a specified
+ * delay from the last invocation.
+ *
+ * @template F The type of the function to debounce
+ * @param fn - The function to debounce.
+ * @param delay - The time in milliseconds to wait before calling the function after the last call.
+ * @returns A debounced version of the function that returns a promise.
+ *
+ * @example
+ * // Example usage of the debounce function
+ * const debouncedFetchData = debounce(async (query: string) => {
+ *   const response = await fetch(`/api/search?q=${query}`);
+ *   return response.json();
+ * }, 300);
+ *
+ * // Calling the debounced function multiple times
+ * debouncedFetchData("hello").then(console.log); // Will only call fetch once after 300ms delay
+ * debouncedFetchData("world").then(console.log); // Will cancel the previous call and make a new one
+ */
+export default function debounce<F extends (...args: Parameters<F>) => ReturnType<F>>(fn: F, delay: number): (...args: Parameters<F>) => Promise<ReturnType<F>>;
+//# sourceMappingURL=debounce.d.ts.map

package/dist/types/debounce.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"debounce.d.ts","sourceRoot":"","sources":["../../src/debounce.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,CAAC,OAAO,UAAU,QAAQ,CAC9B,CAAC,SAAS,CAAC,GAAG,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,UAAU,CAAC,CAAC,CAAC,EACnD,EAAE,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,CAAC,GAAG,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAyB1E"}

package/dist/types/index.d.ts

@@ -0,0 +1,3 @@
+export { default as debounce } from "./debounce.js";
+export { default as throttle } from "./throttle.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAC"}

package/dist/types/throttle.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Throttles a function invocation to at most once every `wait` milliseconds.
+ * @template T The type of the function to throttle
+ * @param func - The function to throttle
+ * @param wait - The time in milliseconds to wait between invocations
+ * @returns A throttled version of the function
+ * @see Throttling function calls, by Remy Sharp
+ *  http://remysharp.com/2010/07/21/throttling-function-calls/
+ *
+ * @example
+ *
+ * window.addEventListener(
+ *   'resize',
+ *   throttle(() => {
+ *     console.log("window was resized!");
+ *   }, 500)
+ * );
+ */
+export default function throttle<T extends (...args: Parameters<T>) => ReturnType<T>>(func: T, wait: number): (...args: Parameters<T>) => void;
+//# sourceMappingURL=throttle.d.ts.map

package/dist/types/throttle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"throttle.d.ts","sourceRoot":"","sources":["../../src/throttle.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,CAAC,OAAO,UAAU,QAAQ,CAC9B,CAAC,SAAS,CAAC,GAAG,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,UAAU,CAAC,CAAC,CAAC,EACnD,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,GAAG,CAAC,GAAG,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,CAQzD"}

package/package.json

@@ -0,0 +1,39 @@
+{
+  "name": "@canonical/utils",
+  "description": "Standard utility functions for Canonical's Web Engineering team",
+  "version": "0.2.0-experimental.0",
+  "type": "module",
+  "module": "dist/esm/index.js",
+  "types": "dist/types/index.d.ts",
+  "files": ["dist"],
+  "author": {
+    "email": "webteam@canonical.com",
+    "name": "Canonical Webteam"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/canonical/ds25"
+  },
+  "license": "LGPL-3.0",
+  "bugs": {
+    "url": "https://github.com/canonical/ds25/issues"
+  },
+  "homepage": "https://github.com/canonical/ds25#readme",
+  "scripts": {
+    "build": "tsc -p tsconfig.build.json",
+    "lint": "biome lint src/*.{ts,tsx}",
+    "format": "bun run format:biome",
+    "format:biome": "biome format src/*.{ts,tsx}",
+    "check": "bun run check:biome && bun run check:ts",
+    "check:fix": "bun run check:biome:fix",
+    "check:biome": "biome check src/* *.json",
+    "check:biome:fix": "biome check --write src/* *.json",
+    "check:ts": "tsc --noEmit"
+  },
+  "devDependencies": {
+    "@biomejs/biome": "^1.9.2",
+    "@canonical/biome-config": "^0.1.0-experimental.0",
+    "@canonical/typescript-config-base": "^0.2.0-experimental.0",
+    "typescript": "^5.5.3"
+  }
+}