swup 4.4.0 → 4.4.2

package/src/Swup.ts

@@ -1,27 +1,27 @@
-import { DelegateEvent } from 'delegate-it';
+import { type DelegateEvent } from 'delegate-it';
 
 import version from './config/version.js';
 
 import { delegateEvent, getCurrentUrl, Location, updateHistoryRecord } from './helpers.js';
-import { DelegateEventUnsubscribe } from './helpers/delegateEvent.js';
+import { type DelegateEventUnsubscribe } from './helpers/delegateEvent.js';
 
 import { Cache } from './modules/Cache.js';
 import { Classes } from './modules/Classes.js';
-import { Visit, createVisit } from './modules/Visit.js';
+import { type Visit, createVisit } from './modules/Visit.js';
 import { Hooks } from './modules/Hooks.js';
 import { getAnchorElement } from './modules/getAnchorElement.js';
 import { awaitAnimations } from './modules/awaitAnimations.js';
-import { navigate, performNavigation, NavigationToSelfAction } from './modules/navigate.js';
+import { navigate, performNavigation, type NavigationToSelfAction } from './modules/navigate.js';
 import { fetchPage } from './modules/fetchPage.js';
 import { animatePageOut } from './modules/animatePageOut.js';
 import { replaceContent } from './modules/replaceContent.js';
 import { scrollToContent } from './modules/scrollToContent.js';
 import { animatePageIn } from './modules/animatePageIn.js';
 import { renderPage } from './modules/renderPage.js';
-import { use, unuse, findPlugin, Plugin } from './modules/plugins.js';
+import { use, unuse, findPlugin, type Plugin } from './modules/plugins.js';
 import { isSameResolvedUrl, resolveUrl } from './modules/resolveUrl.js';
 import { nextTick } from './utils.js';
-import { HistoryState } from './helpers/createHistoryRecord.js';
+import { type HistoryState } from './helpers/createHistoryRecord.js';
 
 /** Options for customizing swup's behavior. */
 export type Options = {
@@ -96,6 +96,8 @@ export default class Swup {
 	protected currentHistoryIndex: number;
 	/** Delegated event subscription handle */
 	protected clickDelegate?: DelegateEventUnsubscribe;
+	/** Navigation status */
+	protected navigating: boolean = false;
 
 	/** Install a plugin */
 	use = use;
@@ -257,6 +259,12 @@ export default class Swup {
 			return;
 		}
 
+		// Ignore if swup is currently navigating towards the link's URL
+		if (this.navigating && url === this.visit.to.url) {
+			event.preventDefault();
+			return;
+		}
+
 		this.visit = this.createVisit({ to: url, hash, el, event });
 
 		// Exit early if control key pressed

package/src/helpers/delegateEvent.ts

@@ -1,5 +1,9 @@
-import delegate, { DelegateEventHandler, DelegateOptions, EventType } from 'delegate-it';
-import { ParseSelector } from 'typed-query-selector/parser.js';
+import delegate, {
+	type DelegateEventHandler,
+	type DelegateOptions,
+	type EventType
+} from 'delegate-it';
+import type { ParseSelector } from 'typed-query-selector/parser.js';
 
 export type DelegateEventUnsubscribe = {
 	destroy: () => void;

package/src/helpers/matchPath.ts

@@ -8,7 +8,7 @@ import type {
 	MatchFunction
 } from 'path-to-regexp';
 
-export { Path };
+export { type Path };
 
 /** Create a match function from a path pattern that checks if a URLs matches it. */
 export const matchPath = <P extends object = object>(

package/src/helpers/updateHistoryRecord.ts

@@ -1,4 +1,4 @@
-import { HistoryState } from './createHistoryRecord.js';
+import type { HistoryState } from './createHistoryRecord.js';
 import { getCurrentUrl } from './getCurrentUrl.js';
 
 /** Update the current history record with a custom swup identifier. */

package/src/index.ts

@@ -14,12 +14,14 @@ import type {
 	VisitHistory
 } from './modules/Visit.js';
 import type {
-	HookArguments,
-	HookDefinitions,
 	HookName,
+	HookDefinitions,
+	HookArguments,
+	HookReturnValues,
+	HookHandler,
+	HookDefaultHandler,
 	HookOptions,
-	HookUnregister,
-	Handler
+	HookUnregister
 } from './modules/Hooks.js';
 import type { Plugin } from './modules/plugins.js';
 
@@ -32,19 +34,22 @@ export type {
 	Plugin,
 	CacheData,
 	PageData,
+	Path,
 	Visit,
 	VisitFrom,
 	VisitTo,
 	VisitAnimation,
 	VisitScroll,
 	VisitHistory,
-	HookArguments,
-	HookDefinitions,
 	HookName,
+	HookDefinitions,
+	HookArguments,
+	HookReturnValues,
+	HookHandler,
+	HookHandler as Handler, // backwards compatibility
+	HookDefaultHandler,
 	HookOptions,
 	HookUnregister,
-	Handler,
-	Path,
 	DelegateEvent,
 	DelegateEventHandler,
 	DelegateEventUnsubscribe

package/src/modules/Cache.ts

@@ -1,6 +1,6 @@
-import Swup from '../Swup.js';
+import type Swup from '../Swup.js';
 import { Location } from '../helpers.js';
-import { PageData } from './fetchPage.js';
+import { type PageData } from './fetchPage.js';
 
 export interface CacheData extends PageData {}
 

package/src/modules/Classes.ts

@@ -1,4 +1,4 @@
-import Swup from '../Swup.js';
+import type Swup from '../Swup.js';
 import { queryAll } from '../utils.js';
 
 export class Classes {

package/src/modules/Hooks.ts

@@ -1,9 +1,9 @@
-import { DelegateEvent } from 'delegate-it';
+import type { DelegateEvent } from 'delegate-it';
 
-import Swup from '../Swup.js';
+import type Swup from '../Swup.js';
 import { isPromise, runAsPromise } from '../utils.js';
-import { Visit } from './Visit.js';
-import { FetchOptions, PageData } from './fetchPage.js';
+import type { Visit } from './Visit.js';
+import type { FetchOptions, PageData } from './fetchPage.js';
 
 export interface HookDefinitions {
 	'animation:out:start': undefined;
@@ -50,7 +50,7 @@ export type HookArguments<T extends HookName> = HookDefinitions[T];
 export type HookName = keyof HookDefinitions;
 
 /** A generic hook handler. */
-export type Handler<T extends HookName> = (
+export type HookHandler<T extends HookName> = (
 	/** Context about the current visit. */
 	visit: Visit,
 	/** Local arguments passed into the handler. */
@@ -58,17 +58,17 @@ export type Handler<T extends HookName> = (
 ) => Promise<unknown> | unknown;
 
 /** A default hook handler with an expected return type. */
-export type DefaultHandler<T extends HookName> = (
+export type HookDefaultHandler<T extends HookName> = (
 	/** Context about the current visit. */
 	visit: Visit,
 	/** Local arguments passed into the handler. */
 	args: HookArguments<T>,
 	/** Default handler to be executed. Available if replacing an internal hook handler. */
-	defaultHandler?: DefaultHandler<T>
+	defaultHandler?: HookDefaultHandler<T>
 ) => T extends keyof HookReturnValues ? HookReturnValues[T] : Promise<unknown> | unknown;
 
 export type Handlers = {
-	[K in HookName]: Handler<K>[];
+	[K in HookName]: HookHandler<K>[];
 };
 
 /** Unregister a previously registered hook handler. */
@@ -88,15 +88,15 @@ export type HookOptions = {
 
 export type HookRegistration<
 	T extends HookName,
-	H extends Handler<T> | DefaultHandler<T> = Handler<T>
+	H extends HookHandler<T> | HookDefaultHandler<T> = HookHandler<T>
 > = {
 	id: number;
 	hook: T;
 	handler: H;
-	defaultHandler?: DefaultHandler<T>;
+	defaultHandler?: HookDefaultHandler<T>;
 } & HookOptions;
 
-type HookLedger<T extends HookName> = Map<Handler<T>, HookRegistration<T>>;
+type HookLedger<T extends HookName> = Map<HookHandler<T>, HookRegistration<T>>;
 
 interface HookRegistry extends Map<HookName, HookLedger<HookName>> {
 	get<K extends HookName>(key: K): HookLedger<K> | undefined;
@@ -209,15 +209,15 @@ export class Hooks {
 	 */
 
 	// Overload: replacing default handler
-	on<T extends HookName, O extends HookOptions>(hook: T, handler: DefaultHandler<T>, options: O & { replace: true }): HookUnregister; // prettier-ignore
+	on<T extends HookName, O extends HookOptions>(hook: T, handler: HookDefaultHandler<T>, options: O & { replace: true }): HookUnregister; // prettier-ignore
 	// Overload: passed in handler options
-	on<T extends HookName, O extends HookOptions>(hook: T, handler: Handler<T>, options: O): HookUnregister; // prettier-ignore
+	on<T extends HookName, O extends HookOptions>(hook: T, handler: HookHandler<T>, options: O): HookUnregister; // prettier-ignore
 	// Overload: no handler options
-	on<T extends HookName>(hook: T, handler: Handler<T>): HookUnregister; // prettier-ignore
+	on<T extends HookName>(hook: T, handler: HookHandler<T>): HookUnregister; // prettier-ignore
 	// Implementation
 	on<T extends HookName, O extends HookOptions>(
 		hook: T,
-		handler: O['replace'] extends true ? DefaultHandler<T> : Handler<T>,
+		handler: O['replace'] extends true ? HookDefaultHandler<T> : HookHandler<T>,
 		options: Partial<O> = {}
 	): HookUnregister {
 		const ledger = this.get(hook);
@@ -243,13 +243,13 @@ export class Hooks {
 	 * @see on
 	 */
 	// Overload: passed in handler options
-	before<T extends HookName>(hook: T, handler: Handler<T>, options: HookOptions): HookUnregister;
+	before<T extends HookName>(hook: T, handler: HookHandler<T>, options: HookOptions): HookUnregister; // prettier-ignore
 	// Overload: no handler options
-	before<T extends HookName>(hook: T, handler: Handler<T>): HookUnregister;
+	before<T extends HookName>(hook: T, handler: HookHandler<T>): HookUnregister;
 	// Implementation
 	before<T extends HookName>(
 		hook: T,
-		handler: Handler<T>,
+		handler: HookHandler<T>,
 		options: HookOptions = {}
 	): HookUnregister {
 		return this.on(hook, handler, { ...options, before: true });
@@ -265,13 +265,13 @@ export class Hooks {
 	 * @see on
 	 */
 	// Overload: passed in handler options
-	replace<T extends HookName>(hook: T, handler: DefaultHandler<T>, options: HookOptions): HookUnregister; // prettier-ignore
+	replace<T extends HookName>(hook: T, handler: HookDefaultHandler<T>, options: HookOptions): HookUnregister; // prettier-ignore
 	// Overload: no handler options
-	replace<T extends HookName>(hook: T, handler: DefaultHandler<T>): HookUnregister; // prettier-ignore
+	replace<T extends HookName>(hook: T, handler: HookDefaultHandler<T>): HookUnregister; // prettier-ignore
 	// Implementation
 	replace<T extends HookName>(
 		hook: T,
-		handler: DefaultHandler<T>,
+		handler: HookDefaultHandler<T>,
 		options: HookOptions = {}
 	): HookUnregister {
 		return this.on(hook, handler, { ...options, replace: true });
@@ -286,13 +286,13 @@ export class Hooks {
 	 * @see on
 	 */
 	// Overload: passed in handler options
-	once<T extends HookName>(hook: T, handler: Handler<T>, options: HookOptions): HookUnregister;
+	once<T extends HookName>(hook: T, handler: HookHandler<T>, options: HookOptions): HookUnregister; // prettier-ignore
 	// Overload: no handler options
-	once<T extends HookName>(hook: T, handler: Handler<T>): HookUnregister;
+	once<T extends HookName>(hook: T, handler: HookHandler<T>): HookUnregister;
 	// Implementation
 	once<T extends HookName>(
 		hook: T,
-		handler: Handler<T>,
+		handler: HookHandler<T>,
 		options: HookOptions = {}
 	): HookUnregister {
 		return this.on(hook, handler, { ...options, once: true });
@@ -305,11 +305,11 @@ export class Hooks {
 	 *                If omitted, all handlers for the hook will be removed.
 	 */
 	// Overload: unregister a specific handler
-	off<T extends HookName>(hook: T, handler: Handler<T> | DefaultHandler<T>): void;
+	off<T extends HookName>(hook: T, handler: HookHandler<T> | HookDefaultHandler<T>): void;
 	// Overload: unregister all handlers
 	off<T extends HookName>(hook: T): void;
 	// Implementation
-	off<T extends HookName>(hook: T, handler?: Handler<T> | DefaultHandler<T>): void {
+	off<T extends HookName>(hook: T, handler?: HookHandler<T> | HookDefaultHandler<T>): void {
 		const ledger = this.get(hook);
 		if (ledger && handler) {
 			const deleted = ledger.delete(handler);
@@ -332,8 +332,8 @@ export class Hooks {
 	async call<T extends HookName>(
 		hook: T,
 		args: HookArguments<T>,
-		defaultHandler?: DefaultHandler<T>
-	): Promise<Awaited<ReturnType<DefaultHandler<T>>>> {
+		defaultHandler?: HookDefaultHandler<T>
+	): Promise<Awaited<ReturnType<HookDefaultHandler<T>>>> {
 		const { before, handler, after } = this.getHandlers(hook, defaultHandler);
 		await this.run(before, args);
 		const [result] = await this.run(handler, args);
@@ -353,8 +353,8 @@ export class Hooks {
 	callSync<T extends HookName>(
 		hook: T,
 		args: HookArguments<T>,
-		defaultHandler?: DefaultHandler<T>
-	): ReturnType<DefaultHandler<T>> {
+		defaultHandler?: HookDefaultHandler<T>
+	): ReturnType<HookDefaultHandler<T>> {
 		const { before, handler, after } = this.getHandlers(hook, defaultHandler);
 		this.runSync(before, args);
 		const [result] = this.runSync(handler, args);
@@ -369,15 +369,15 @@ export class Hooks {
 	 * @param args Arguments to pass to the handler
 	 */
 
-	// Overload: running DefaultHandler: expect DefaultHandler return type
-	protected async run<T extends HookName>(registrations: HookRegistration<T, DefaultHandler<T>>[], args: HookArguments<T>): Promise<Awaited<ReturnType<DefaultHandler<T>>>[]>; // prettier-ignore
+	// Overload: running HookDefaultHandler: expect HookDefaultHandler return type
+	protected async run<T extends HookName>(registrations: HookRegistration<T, HookDefaultHandler<T>>[], args: HookArguments<T>): Promise<Awaited<ReturnType<HookDefaultHandler<T>>>[]>; // prettier-ignore
 	// Overload:  running user handler: expect no specific type
 	protected async run<T extends HookName>(registrations: HookRegistration<T>[], args: HookArguments<T>): Promise<unknown[]>; // prettier-ignore
 	// Implementation
 	protected async run<T extends HookName, R extends HookRegistration<T>[]>(
 		registrations: R,
 		args: HookArguments<T>
-	): Promise<Awaited<ReturnType<DefaultHandler<T>>> | unknown[]> {
+	): Promise<Awaited<ReturnType<HookDefaultHandler<T>>> | unknown[]> {
 		const results = [];
 		for (const { hook, handler, defaultHandler, once } of registrations) {
 			const result = await runAsPromise(handler, [this.swup.visit, args, defaultHandler]);
@@ -395,18 +395,18 @@ export class Hooks {
 	 * @param args Arguments to pass to the handler
 	 */
 
-	// Overload: running DefaultHandler: expect DefaultHandler return type
-	protected runSync<T extends HookName>(registrations: HookRegistration<T, DefaultHandler<T>>[], args: HookArguments<T> ): ReturnType<DefaultHandler<T>>[]; // prettier-ignore
+	// Overload: running HookDefaultHandler: expect HookDefaultHandler return type
+	protected runSync<T extends HookName>(registrations: HookRegistration<T, HookDefaultHandler<T>>[], args: HookArguments<T> ): ReturnType<HookDefaultHandler<T>>[]; // prettier-ignore
 	// Overload: running user handler: expect no specific type
 	protected runSync<T extends HookName>(registrations: HookRegistration<T>[], args: HookArguments<T>): unknown[]; // prettier-ignore
 	// Implementation
 	protected runSync<T extends HookName, R extends HookRegistration<T>[]>(
 		registrations: R,
 		args: HookArguments<T>
-	): (ReturnType<DefaultHandler<T>> | unknown)[] {
+	): (ReturnType<HookDefaultHandler<T>> | unknown)[] {
 		const results = [];
 		for (const { hook, handler, defaultHandler, once } of registrations) {
-			const result = (handler as DefaultHandler<T>)(this.swup.visit, args, defaultHandler);
+			const result = (handler as HookDefaultHandler<T>)(this.swup.visit, args, defaultHandler); // prettier-ignore
 			results.push(result);
 			if (isPromise(result)) {
 				console.warn(
@@ -428,7 +428,7 @@ export class Hooks {
 	 * @returns An object with the handlers sorted into `before` and `after` arrays,
 	 *          as well as a flag indicating if the original handler was replaced
 	 */
-	protected getHandlers<T extends HookName>(hook: T, defaultHandler?: DefaultHandler<T>) {
+	protected getHandlers<T extends HookName>(hook: T, defaultHandler?: HookDefaultHandler<T>) {
 		const ledger = this.get(hook);
 		if (!ledger) {
 			return { found: false, before: [], handler: [], after: [], replaced: false };
@@ -437,7 +437,7 @@ export class Hooks {
 		const registrations = Array.from(ledger.values());
 
 		// Let TypeScript know that replaced handlers are default handlers by filtering to true
-		const def = (T: HookRegistration<T>): T is HookRegistration<T, DefaultHandler<T>> => true;
+		const def = (T: HookRegistration<T>): T is HookRegistration<T, HookDefaultHandler<T>> => true; // prettier-ignore
 		const sort = this.sortRegistrations;
 
 		// Filter into before, after, and replace handlers
@@ -448,13 +448,13 @@ export class Hooks {
 
 		// Define main handler registration
 		// Created as HookRegistration[] array to allow passing it into hooks.run() directly
-		let handler: HookRegistration<T, DefaultHandler<T>>[] = [];
+		let handler: HookRegistration<T, HookDefaultHandler<T>>[] = [];
 		if (defaultHandler) {
 			handler = [{ id: 0, hook, handler: defaultHandler }];
 			if (replaced) {
 				const index = replace.length - 1;
 				const replacingHandler = replace[index].handler;
-				const createDefaultHandler = (index: number): DefaultHandler<T> | undefined => {
+				const createDefaultHandler = (index: number): HookDefaultHandler<T> | undefined => {
 					const next = replace[index - 1];
 					if (next) {
 						return (visit, args) =>

package/src/modules/Visit.ts

@@ -1,5 +1,6 @@
-import Swup, { Options } from '../Swup.js';
-import { HistoryAction, HistoryDirection } from './navigate.js';
+import type Swup from '../Swup.js';
+import type { Options } from '../Swup.js';
+import type { HistoryAction, HistoryDirection } from './navigate.js';
 
 /** An object holding details about the current visit. */
 export interface Visit {

package/src/modules/animatePageIn.ts

@@ -1,4 +1,4 @@
-import Swup from '../Swup.js';
+import type Swup from '../Swup.js';
 import { nextTick } from '../utils.js';
 
 /**

package/src/modules/animatePageOut.ts

@@ -1,4 +1,4 @@
-import Swup from '../Swup.js';
+import type Swup from '../Swup.js';
 import { classify } from '../helpers.js';
 
 /**

package/src/modules/awaitAnimations.ts

@@ -1,5 +1,6 @@
 import { queryAll, toMs } from '../utils.js';
-import Swup, { Options } from '../Swup.js';
+import type Swup from '../Swup.js';
+import type { Options } from '../Swup.js';
 
 const TRANSITION = 'transition';
 const ANIMATION = 'animation';

package/src/modules/fetchPage.ts

@@ -1,4 +1,4 @@
-import Swup from '../Swup.js';
+import type Swup from '../Swup.js';
 import { Location } from '../helpers.js';
 
 /** A page object as used by swup and its cache. */

package/src/modules/navigate.ts

@@ -1,7 +1,7 @@
-import Swup from '../Swup.js';
+import type Swup from '../Swup.js';
 import { createHistoryRecord, updateHistoryRecord, getCurrentUrl, Location } from '../helpers.js';
-import { FetchError, FetchOptions, PageData } from './fetchPage.js';
-import { VisitInitOptions } from './Visit.js';
+import { FetchError, type FetchOptions, type PageData } from './fetchPage.js';
+import type { VisitInitOptions } from './Visit.js';
 
 export type HistoryAction = 'push' | 'replace';
 export type HistoryDirection = 'forwards' | 'backwards';
@@ -62,6 +62,7 @@ export async function performNavigation(
 	this: Swup,
 	options: NavigationOptions & FetchOptions = {}
 ): Promise<void> {
+	this.navigating = true;
 	// Save this localy to a) allow ignoring the visit if a new one was started in the meantime
 	// and b) avoid unintended modifications to any newer visits
 	const visit = this.visit;
@@ -166,6 +167,7 @@ export async function performNavigation(
 		// if (visit.to && this.isSameResolvedUrl(visit.to.url, requestedUrl)) {
 		// 	this.visit = this.createVisit({ to: undefined });
 		// }
+		this.navigating = false;
 	} catch (error) {
 		// Return early if error is undefined or signals an aborted request
 		if (!error || (error as FetchError)?.aborted) {

package/src/modules/plugins.ts

@@ -1,4 +1,4 @@
-import Swup from '../Swup.js';
+import type Swup from '../Swup.js';
 
 export type Plugin = {
 	/** Identify as a swup plugin */

package/src/modules/renderPage.ts

@@ -1,6 +1,6 @@
 import { updateHistoryRecord, getCurrentUrl, classify } from '../helpers.js';
-import Swup from '../Swup.js';
-import { PageData } from './fetchPage.js';
+import type Swup from '../Swup.js';
+import type { PageData } from './fetchPage.js';
 
 /**
  * Render the next page: replace the content and update scroll position.

package/src/modules/replaceContent.ts

@@ -1,6 +1,7 @@
-import Swup, { Options } from '../Swup.js';
+import type Swup from '../Swup.js';
+import type { Options } from '../Swup.js';
 import { query, queryAll } from '../utils.js';
-import { PageData } from './fetchPage.js';
+import type { PageData } from './fetchPage.js';
 
 /**
  * Perform the replacement of content after loading a page.

package/src/modules/resolveUrl.ts

@@ -1,4 +1,4 @@
-import Swup from '../Swup.js';
+import type Swup from '../Swup.js';
 
 /**
  * Utility function to validate and run the global option 'resolveUrl'

package/src/modules/scrollToContent.ts

@@ -1,4 +1,4 @@
-import Swup from '../Swup.js';
+import type Swup from '../Swup.js';
 
 /**
  * Update the scroll position after page render.