@pinia/colada-plugin-delay 0.1.5 → 0.2.1

package/dist/index.d.mts

@@ -7,26 +7,87 @@ import { PiniaColadaPlugin } from "@pinia/colada";
  */
 interface PiniaColadaDelayOptions {
   /**
-   * Delay in milliseconds to wait before letting the `asyncStatus` become `'loading'`. Set to `false` or 0 to disable. Requires the {@link PiniaColadaDelay} plugin.
+   * Delay in milliseconds to wait before letting the `asyncStatus` become `'loading'`. Set to `false` or 0 to disable.
+   *
    * @default 200
    */
   delay?: number | false;
+  /**
+   * Query-specific delay override. Overrides the top-level `delay` for queries
+   * only.
+   */
+  query?: {
+    delay?: number | false;
+  };
+  /**
+   * Mutation-specific delay override. Overrides the top-level `delay` for
+   * mutations only.
+   */
+  mutations?: {
+    delay?: number | false;
+  };
 }
 /**
- * Delays the `asyncStatus` of a query by a certain amount of time to avoid flickering between refreshes.
- * @param options - Pinia Colada Delay Loading plugin options
+ * Delays the `asyncStatus` of queries by a certain amount of time to avoid
+ * flickering between refreshes.
+ *
+ * @param options - Plugin options
+ */
+declare function PiniaColadaDelayQuery(options?: Pick<PiniaColadaDelayOptions, 'delay'>): PiniaColadaPlugin;
+/**
+ * Delays the `asyncStatus` of mutations by a certain amount of time to avoid
+ * flickering.
+ *
+ * @param options - Plugin options
+ */
+declare function PiniaColadaDelayMutations(options?: Pick<PiniaColadaDelayOptions, 'delay'>): PiniaColadaPlugin;
+/**
+ * Delays the `asyncStatus` of both queries and mutations by a certain amount
+ * of time to avoid flickering. Options apply to both, with optional `query`
+ * and `mutations` nested overrides.
+ *
+ * @param options - Plugin options
  */
 declare function PiniaColadaDelay(options?: PiniaColadaDelayOptions): PiniaColadaPlugin;
 declare module '@pinia/colada' {
-  interface UseQueryOptions<TData, TError, TDataInitial> extends PiniaColadaDelayOptions {}
-  interface UseQueryOptionsGlobal extends PiniaColadaDelayOptions {}
+  interface UseQueryOptions<TData, TError, TDataInitial> extends Pick<PiniaColadaDelayOptions, 'delay'> {}
+  interface UseQueryOptionsGlobal extends Pick<PiniaColadaDelayOptions, 'delay'> {}
   interface UseQueryEntryExtensions<TData, TError, TDataInitial> {
     /**
-     * Returns whether the query is currently delaying its `asyncStatus` from becoming `'loading'`. Requires the {@link PiniaColadaDelay} plugin.
+     * Returns whether the query is currently delaying its `asyncStatus` from
+     * becoming `'loading'`. Requires the {@link PiniaColadaDelay} plugin.
+     */
+    isDelaying: ShallowRef<boolean>;
+  }
+  interface UseMutationOptions<TData, TVars, TError, TContext> {
+    /**
+     * Delay in milliseconds to wait before letting the `asyncStatus` become
+     * `'loading'`. Set to `false` or 0 to disable. Requires the
+     * {@link PiniaColadaDelay} or {@link PiniaColadaDelayMutations} plugin.
+     *
+     * @default 200
+     */
+    delay?: number | false;
+  }
+  interface UseMutationOptionsGlobal {
+    /**
+     * Delay in milliseconds to wait before letting the `asyncStatus` become
+     * `'loading'`. Set to `false` or 0 to disable. Requires the
+     * {@link PiniaColadaDelay} or {@link PiniaColadaDelayMutations} plugin.
+     *
+     * @default 200
+     */
+    delay?: number | false;
+  }
+  interface UseMutationEntryExtensions<TData, TVars, TError, TContext> {
+    /**
+     * Returns whether the mutation is currently delaying its `asyncStatus`
+     * from becoming `'loading'`. Requires the {@link PiniaColadaDelay} or
+     * {@link PiniaColadaDelayMutations} plugin.
      */
     isDelaying: ShallowRef<boolean>;
   }
 }
 //#endregion
-export { PiniaColadaDelay };
+export { PiniaColadaDelay, PiniaColadaDelayMutations, type PiniaColadaDelayOptions, PiniaColadaDelayQuery };
 //# sourceMappingURL=index.d.mts.map

package/dist/index.mjs

@@ -1,11 +1,44 @@
 import { customRef, shallowRef } from "vue";
-
+import { useMutationCache } from "@pinia/colada";
 //#region src/delay.ts
 /**
-* Delays the `asyncStatus` of a query by a certain amount of time to avoid flickering between refreshes.
-* @param options - Pinia Colada Delay Loading plugin options
+* Creates a delayed `asyncStatus` customRef that waits before switching to
+* `'loading'`.
 */
-function PiniaColadaDelay(options) {
+function createDelayedAsyncStatus(initialValue, delay, isDelaying) {
+	return customRef((track, trigger) => {
+		let value = initialValue;
+		let timeout;
+		return {
+			get() {
+				track();
+				return value;
+			},
+			set(newValue) {
+				clearTimeout(timeout);
+				if (newValue === "loading") {
+					isDelaying.value = true;
+					timeout = setTimeout(() => {
+						isDelaying.value = false;
+						value = newValue;
+						trigger();
+					}, delay);
+				} else {
+					isDelaying.value = false;
+					value = newValue;
+					trigger();
+				}
+			}
+		};
+	});
+}
+/**
+* Delays the `asyncStatus` of queries by a certain amount of time to avoid
+* flickering between refreshes.
+*
+* @param options - Plugin options
+*/
+function PiniaColadaDelayQuery(options) {
 	return ({ queryCache, scope }) => {
 		queryCache.$onAction(({ name, args }) => {
 			if (name === "extend") {
@@ -16,37 +49,51 @@ function PiniaColadaDelay(options) {
 					entry.ext.isDelaying = isDelaying;
 					if (!delay) return;
 					const initialValue = entry.asyncStatus.value;
-					entry.asyncStatus = customRef((track, trigger) => {
-						let value = initialValue;
-						let timeout;
-						return {
-							get() {
-								track();
-								return value;
-							},
-							set(newValue) {
-								clearTimeout(timeout);
-								if (newValue === "loading") {
-									isDelaying.value = true;
-									timeout = setTimeout(() => {
-										isDelaying.value = false;
-										value = newValue;
-										trigger();
-									}, delay);
-								} else {
-									isDelaying.value = false;
-									value = newValue;
-									trigger();
-								}
-							}
-						};
-					});
+					entry.asyncStatus = createDelayedAsyncStatus(initialValue, delay, isDelaying);
 				});
 			}
 		});
 	};
 }
-
+/**
+* Delays the `asyncStatus` of mutations by a certain amount of time to avoid
+* flickering.
+*
+* @param options - Plugin options
+*/
+function PiniaColadaDelayMutations(options) {
+	return ({ pinia, scope }) => {
+		useMutationCache(pinia).$onAction(({ name, args }) => {
+			if (name === "extend") {
+				const [entry] = args;
+				const delay = entry.options?.delay ?? options?.delay ?? 200;
+				scope.run(() => {
+					const isDelaying = shallowRef(false);
+					entry.ext.isDelaying = isDelaying;
+					if (!delay) return;
+					const initialValue = entry.asyncStatus.value;
+					entry.asyncStatus = createDelayedAsyncStatus(initialValue, delay, isDelaying);
+				});
+			}
+		});
+	};
+}
+/**
+* Delays the `asyncStatus` of both queries and mutations by a certain amount
+* of time to avoid flickering. Options apply to both, with optional `query`
+* and `mutations` nested overrides.
+*
+* @param options - Plugin options
+*/
+function PiniaColadaDelay(options) {
+	const removeQueryDelays = PiniaColadaDelayQuery({ delay: options?.query?.delay ?? options?.delay });
+	const removeMutationDelays = PiniaColadaDelayMutations({ delay: options?.mutations?.delay ?? options?.delay });
+	return (context) => {
+		removeQueryDelays(context);
+		removeMutationDelays(context);
+	};
+}
 //#endregion
-export { PiniaColadaDelay };
+export { PiniaColadaDelay, PiniaColadaDelayMutations, PiniaColadaDelayQuery };
+
 //# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../src/delay.ts"],"sourcesContent":["/**\n * Pinia Colada Delay Loading plugin.\n *\n * Allows delaying the `loading` value for `asyncStatus` to improve _perceived performance_.\n *\n * @module @pinia/colada-plugin-delay\n */\n\nimport type { ShallowRef } from 'vue'\nimport { customRef, shallowRef } from 'vue'\nimport type { PiniaColadaPlugin, AsyncStatus } from '@pinia/colada'\n\n/**\n * Options for the {@link PiniaColadaDelay} plugin.\n */\ninterface PiniaColadaDelayOptions {\n  /**\n   * Delay in milliseconds to wait before letting the `asyncStatus` become `'loading'`. Set to `false` or 0 to disable. Requires the {@link PiniaColadaDelay} plugin.\n   * @default 200\n   */\n  delay?: number | false\n}\n\n/**\n * Delays the `asyncStatus` of a query by a certain amount of time to avoid flickering between refreshes.\n * @param options - Pinia Colada Delay Loading plugin options\n */\nexport function PiniaColadaDelay(options?: PiniaColadaDelayOptions): PiniaColadaPlugin {\n  return ({ queryCache, scope }) => {\n    queryCache.$onAction(({ name, args }) => {\n      if (name === 'extend') {\n        const [entry] = args\n        const delay = entry.options?.delay ?? options?.delay ?? 200\n        scope.run(() => {\n          const isDelaying = shallowRef(false)\n          entry.ext.isDelaying = isDelaying\n          if (!delay) return\n\n          const initialValue = entry.asyncStatus.value\n          entry.asyncStatus = customRef<AsyncStatus>((track, trigger) => {\n            let value = initialValue\n            let timeout: ReturnType<typeof setTimeout> | undefined\n            return {\n              get() {\n                track()\n                return value\n              },\n              set(newValue) {\n                clearTimeout(timeout)\n                if (newValue === 'loading') {\n                  isDelaying.value = true\n                  timeout = setTimeout(() => {\n                    isDelaying.value = false\n                    value = newValue\n                    trigger()\n                  }, delay)\n                } else {\n                  isDelaying.value = false\n                  value = newValue\n                  trigger()\n                }\n              },\n            }\n          })\n        })\n      }\n    })\n  }\n}\n\ndeclare module '@pinia/colada' {\n  // eslint-disable-next-line unused-imports/no-unused-vars\n  interface UseQueryOptions<TData, TError, TDataInitial> extends PiniaColadaDelayOptions {}\n\n  interface UseQueryOptionsGlobal extends PiniaColadaDelayOptions {}\n\n  // eslint-disable-next-line unused-imports/no-unused-vars\n  interface UseQueryEntryExtensions<TData, TError, TDataInitial> {\n    /**\n     * Returns whether the query is currently delaying its `asyncStatus` from becoming `'loading'`. Requires the {@link PiniaColadaDelay} plugin.\n     */\n    isDelaying: ShallowRef<boolean>\n  }\n}\n"],"mappings":";;;;;;;AA2BA,SAAgB,iBAAiB,SAAsD;AACrF,SAAQ,EAAE,YAAY,YAAY;AAChC,aAAW,WAAW,EAAE,MAAM,WAAW;AACvC,OAAI,SAAS,UAAU;IACrB,MAAM,CAAC,SAAS;IAChB,MAAM,QAAQ,MAAM,SAAS,SAAS,SAAS,SAAS;AACxD,UAAM,UAAU;KACd,MAAM,aAAa,WAAW,MAAM;AACpC,WAAM,IAAI,aAAa;AACvB,SAAI,CAAC,MAAO;KAEZ,MAAM,eAAe,MAAM,YAAY;AACvC,WAAM,cAAc,WAAwB,OAAO,YAAY;MAC7D,IAAI,QAAQ;MACZ,IAAI;AACJ,aAAO;OACL,MAAM;AACJ,eAAO;AACP,eAAO;;OAET,IAAI,UAAU;AACZ,qBAAa,QAAQ;AACrB,YAAI,aAAa,WAAW;AAC1B,oBAAW,QAAQ;AACnB,mBAAU,iBAAiB;AACzB,qBAAW,QAAQ;AACnB,kBAAQ;AACR,mBAAS;YACR,MAAM;eACJ;AACL,oBAAW,QAAQ;AACnB,iBAAQ;AACR,kBAAS;;;OAGd;OACD;MACF;;IAEJ"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../src/delay.ts"],"sourcesContent":["/**\n * Pinia Colada Delay Loading plugin.\n *\n * Allows delaying the `loading` value for `asyncStatus` to improve _perceived performance_.\n *\n * @module @pinia/colada-plugin-delay\n */\n\nimport type { ShallowRef } from 'vue'\nimport { customRef, shallowRef } from 'vue'\nimport type { PiniaColadaPlugin, AsyncStatus } from '@pinia/colada'\nimport { useMutationCache } from '@pinia/colada'\n\n/**\n * Options for the {@link PiniaColadaDelay} plugin.\n */\nexport interface PiniaColadaDelayOptions {\n  /**\n   * Delay in milliseconds to wait before letting the `asyncStatus` become `'loading'`. Set to `false` or 0 to disable.\n   *\n   * @default 200\n   */\n  delay?: number | false\n\n  /**\n   * Query-specific delay override. Overrides the top-level `delay` for queries\n   * only.\n   */\n  query?: { delay?: number | false }\n\n  /**\n   * Mutation-specific delay override. Overrides the top-level `delay` for\n   * mutations only.\n   */\n  mutations?: { delay?: number | false }\n}\n\n/**\n * Creates a delayed `asyncStatus` customRef that waits before switching to\n * `'loading'`.\n */\nfunction createDelayedAsyncStatus(\n  initialValue: AsyncStatus,\n  delay: number,\n  isDelaying: ShallowRef<boolean>,\n) {\n  return customRef<AsyncStatus>((track, trigger) => {\n    let value = initialValue\n    let timeout: ReturnType<typeof setTimeout> | undefined\n    return {\n      get() {\n        track()\n        return value\n      },\n      set(newValue) {\n        clearTimeout(timeout)\n        if (newValue === 'loading') {\n          isDelaying.value = true\n          timeout = setTimeout(() => {\n            isDelaying.value = false\n            value = newValue\n            trigger()\n          }, delay)\n        } else {\n          isDelaying.value = false\n          value = newValue\n          trigger()\n        }\n      },\n    }\n  })\n}\n\n/**\n * Delays the `asyncStatus` of queries by a certain amount of time to avoid\n * flickering between refreshes.\n *\n * @param options - Plugin options\n */\nexport function PiniaColadaDelayQuery(\n  options?: Pick<PiniaColadaDelayOptions, 'delay'>,\n): PiniaColadaPlugin {\n  return ({ queryCache, scope }) => {\n    queryCache.$onAction(({ name, args }) => {\n      if (name === 'extend') {\n        const [entry] = args\n        const delay = entry.options?.delay ?? options?.delay ?? 200\n        scope.run(() => {\n          const isDelaying = shallowRef(false)\n          entry.ext.isDelaying = isDelaying\n          if (!delay) return\n\n          const initialValue = entry.asyncStatus.value\n          entry.asyncStatus = createDelayedAsyncStatus(initialValue, delay, isDelaying)\n        })\n      }\n    })\n  }\n}\n\n/**\n * Delays the `asyncStatus` of mutations by a certain amount of time to avoid\n * flickering.\n *\n * @param options - Plugin options\n */\nexport function PiniaColadaDelayMutations(\n  options?: Pick<PiniaColadaDelayOptions, 'delay'>,\n): PiniaColadaPlugin {\n  return ({ pinia, scope }) => {\n    const mutationCache = useMutationCache(pinia)\n    mutationCache.$onAction(({ name, args }) => {\n      if (name === 'extend') {\n        const [entry] = args\n        const delay = entry.options?.delay ?? options?.delay ?? 200\n        scope.run(() => {\n          const isDelaying = shallowRef(false)\n          entry.ext.isDelaying = isDelaying\n          if (!delay) return\n\n          const initialValue = entry.asyncStatus.value\n          entry.asyncStatus = createDelayedAsyncStatus(initialValue, delay, isDelaying)\n        })\n      }\n    })\n  }\n}\n\n/**\n * Delays the `asyncStatus` of both queries and mutations by a certain amount\n * of time to avoid flickering. Options apply to both, with optional `query`\n * and `mutations` nested overrides.\n *\n * @param options - Plugin options\n */\nexport function PiniaColadaDelay(options?: PiniaColadaDelayOptions): PiniaColadaPlugin {\n  const removeQueryDelays = PiniaColadaDelayQuery({\n    delay: options?.query?.delay ?? options?.delay,\n  })\n  const removeMutationDelays = PiniaColadaDelayMutations({\n    delay: options?.mutations?.delay ?? options?.delay,\n  })\n  return (context) => {\n    removeQueryDelays(context)\n    removeMutationDelays(context)\n  }\n}\n\ndeclare module '@pinia/colada' {\n  // eslint-disable-next-line unused-imports/no-unused-vars\n  interface UseQueryOptions<TData, TError, TDataInitial> extends Pick<\n    PiniaColadaDelayOptions,\n    'delay'\n  > {}\n\n  interface UseQueryOptionsGlobal extends Pick<PiniaColadaDelayOptions, 'delay'> {}\n\n  // eslint-disable-next-line unused-imports/no-unused-vars\n  interface UseQueryEntryExtensions<TData, TError, TDataInitial> {\n    /**\n     * Returns whether the query is currently delaying its `asyncStatus` from\n     * becoming `'loading'`. Requires the {@link PiniaColadaDelay} plugin.\n     */\n    isDelaying: ShallowRef<boolean>\n  }\n\n  // eslint-disable-next-line unused-imports/no-unused-vars\n  interface UseMutationOptions<TData, TVars, TError, TContext> {\n    /**\n     * Delay in milliseconds to wait before letting the `asyncStatus` become\n     * `'loading'`. Set to `false` or 0 to disable. Requires the\n     * {@link PiniaColadaDelay} or {@link PiniaColadaDelayMutations} plugin.\n     *\n     * @default 200\n     */\n    delay?: number | false\n  }\n\n  interface UseMutationOptionsGlobal {\n    /**\n     * Delay in milliseconds to wait before letting the `asyncStatus` become\n     * `'loading'`. Set to `false` or 0 to disable. Requires the\n     * {@link PiniaColadaDelay} or {@link PiniaColadaDelayMutations} plugin.\n     *\n     * @default 200\n     */\n    delay?: number | false\n  }\n\n  // eslint-disable-next-line unused-imports/no-unused-vars\n  interface UseMutationEntryExtensions<TData, TVars, TError, TContext> {\n    /**\n     * Returns whether the mutation is currently delaying its `asyncStatus`\n     * from becoming `'loading'`. Requires the {@link PiniaColadaDelay} or\n     * {@link PiniaColadaDelayMutations} plugin.\n     */\n    isDelaying: ShallowRef<boolean>\n  }\n}\n"],"mappings":";;;;;;;AAyCA,SAAS,yBACP,cACA,OACA,YACA;AACA,QAAO,WAAwB,OAAO,YAAY;EAChD,IAAI,QAAQ;EACZ,IAAI;AACJ,SAAO;GACL,MAAM;AACJ,WAAO;AACP,WAAO;;GAET,IAAI,UAAU;AACZ,iBAAa,QAAQ;AACrB,QAAI,aAAa,WAAW;AAC1B,gBAAW,QAAQ;AACnB,eAAU,iBAAiB;AACzB,iBAAW,QAAQ;AACnB,cAAQ;AACR,eAAS;QACR,MAAM;WACJ;AACL,gBAAW,QAAQ;AACnB,aAAQ;AACR,cAAS;;;GAGd;GACD;;;;;;;;AASJ,SAAgB,sBACd,SACmB;AACnB,SAAQ,EAAE,YAAY,YAAY;AAChC,aAAW,WAAW,EAAE,MAAM,WAAW;AACvC,OAAI,SAAS,UAAU;IACrB,MAAM,CAAC,SAAS;IAChB,MAAM,QAAQ,MAAM,SAAS,SAAS,SAAS,SAAS;AACxD,UAAM,UAAU;KACd,MAAM,aAAa,WAAW,MAAM;AACpC,WAAM,IAAI,aAAa;AACvB,SAAI,CAAC,MAAO;KAEZ,MAAM,eAAe,MAAM,YAAY;AACvC,WAAM,cAAc,yBAAyB,cAAc,OAAO,WAAW;MAC7E;;IAEJ;;;;;;;;;AAUN,SAAgB,0BACd,SACmB;AACnB,SAAQ,EAAE,OAAO,YAAY;AACL,mBAAiB,MAAM,CAC/B,WAAW,EAAE,MAAM,WAAW;AAC1C,OAAI,SAAS,UAAU;IACrB,MAAM,CAAC,SAAS;IAChB,MAAM,QAAQ,MAAM,SAAS,SAAS,SAAS,SAAS;AACxD,UAAM,UAAU;KACd,MAAM,aAAa,WAAW,MAAM;AACpC,WAAM,IAAI,aAAa;AACvB,SAAI,CAAC,MAAO;KAEZ,MAAM,eAAe,MAAM,YAAY;AACvC,WAAM,cAAc,yBAAyB,cAAc,OAAO,WAAW;MAC7E;;IAEJ;;;;;;;;;;AAWN,SAAgB,iBAAiB,SAAsD;CACrF,MAAM,oBAAoB,sBAAsB,EAC9C,OAAO,SAAS,OAAO,SAAS,SAAS,OAC1C,CAAC;CACF,MAAM,uBAAuB,0BAA0B,EACrD,OAAO,SAAS,WAAW,SAAS,SAAS,OAC9C,CAAC;AACF,SAAQ,YAAY;AAClB,oBAAkB,QAAQ;AAC1B,uBAAqB,QAAQ"}

package/package.json

@@ -4,7 +4,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.1.5",
+  "version": "0.2.1",
   "description": "Delay async status in Pinia Colada",
   "author": {
     "name": "Eduardo San Martin Morote",
@@ -46,10 +46,10 @@
     "dist"
   ],
   "peerDependencies": {
-    "@pinia/colada": ">=0.21.5"
+    "@pinia/colada": ">=1.1.0"
   },
   "devDependencies": {
-    "@pinia/colada": "^0.21.5"
+    "@pinia/colada": "^1.1.0"
   },
   "scripts": {
     "build": "tsdown",