@absolutejs/absolute 0.19.0-beta.706 → 0.19.0-beta.707

package/dist/dev/client/headPatch.ts

@@ -0,0 +1,233 @@
+import type {} from '../../types/globals';
+/* Head element patching for HMR updates (title, meta, favicon, etc.) */
+
+const getLinkElementKey = (elem: Element) => {
+	const rel = (elem.getAttribute('rel') || '').toLowerCase();
+	if (rel === 'icon' || rel === 'shortcut icon' || rel === 'apple-touch-icon')
+		return `link:icon:${rel}`;
+	if (rel === 'stylesheet') return null;
+	if (rel === 'preconnect')
+		return `link:preconnect:${elem.getAttribute('href') || ''}`;
+	if (rel === 'preload')
+		return `link:preload:${elem.getAttribute('href') || ''}`;
+	if (rel === 'canonical') return 'link:canonical';
+	if (rel === 'dns-prefetch')
+		return `link:dns-prefetch:${elem.getAttribute('href') || ''}`;
+
+	return null;
+};
+
+const getHeadElementKey = (elem: Element) => {
+	const tag = elem.tagName.toLowerCase();
+
+	if (tag === 'title') return 'title';
+	if (tag === 'meta' && elem.hasAttribute('charset')) return 'meta:charset';
+	if (tag === 'meta' && elem.hasAttribute('name'))
+		return `meta:name:${elem.getAttribute('name')}`;
+	if (tag === 'meta' && elem.hasAttribute('property'))
+		return `meta:property:${elem.getAttribute('property')}`;
+	if (tag === 'meta' && elem.hasAttribute('http-equiv'))
+		return `meta:http-equiv:${elem.getAttribute('http-equiv')}`;
+
+	if (tag === 'link') return getLinkElementKey(elem);
+
+	if (tag === 'script' && elem.hasAttribute('data-hmr-id'))
+		return `script:hmr:${elem.getAttribute('data-hmr-id')}`;
+	if (tag === 'script') return null;
+	if (tag === 'base') return 'base';
+
+	return null;
+};
+
+const shouldPreserveElement = (elem: Element) => {
+	if (elem.hasAttribute('data-hmr-import-map')) return true;
+	if (elem.hasAttribute('data-hmr-client')) return true;
+	if (elem.hasAttribute('data-react-refresh-setup')) return true;
+
+	const attrs = Array.from(elem.attributes);
+	for (let idx = 0; idx < attrs.length; idx++) {
+		if (attrs[idx]?.name.startsWith('data-hmr-')) return true;
+	}
+
+	if (elem.tagName === 'SCRIPT') {
+		const src = elem.getAttribute('src') || '';
+		if (src.includes('htmx.min.js') || src.includes('htmx.js')) return true;
+	}
+
+	return false;
+};
+
+const updateTitleElement = (oldEl: Element, newEl: Element) => {
+	const newTitle = newEl.textContent || '';
+	if (oldEl.textContent === newTitle) return;
+	oldEl.textContent = newTitle;
+	document.title = newTitle;
+};
+
+const updateMetaElement = (oldEl: Element, newEl: Element) => {
+	const newContent = newEl.getAttribute('content');
+	const oldContent = oldEl.getAttribute('content');
+	if (oldContent !== newContent && newContent !== null) {
+		oldEl.setAttribute('content', newContent);
+	}
+	if (!newEl.hasAttribute('charset')) return;
+	const newCharset = newEl.getAttribute('charset');
+	if (oldEl.getAttribute('charset') !== newCharset && newCharset !== null) {
+		oldEl.setAttribute('charset', newCharset);
+	}
+};
+
+const updateFaviconHref = (
+	oldEl: Element,
+	newHref: string,
+	oldHref: string
+) => {
+	const [oldBase] = oldHref.split('?');
+	const [newBase] = newHref.split('?');
+	if (oldBase === newBase) return;
+	const cacheBustedHref = `${
+		newHref + (newHref.includes('?') ? '&' : '?')
+	}t=${Date.now()}`;
+	oldEl.setAttribute('href', cacheBustedHref);
+};
+
+const updateLinkElement = (oldEl: Element, newEl: Element) => {
+	const rel = (oldEl.getAttribute('rel') || '').toLowerCase();
+	const newHref = newEl.getAttribute('href');
+	const oldHref = oldEl.getAttribute('href');
+
+	const isIcon =
+		rel === 'icon' || rel === 'shortcut icon' || rel === 'apple-touch-icon';
+
+	if (isIcon && newHref && oldHref) {
+		updateFaviconHref(oldEl, newHref, oldHref);
+	} else if (!isIcon && newHref && oldHref !== newHref) {
+		oldEl.setAttribute('href', newHref);
+	}
+
+	const attrsToCheck = ['type', 'sizes', 'crossorigin', 'as', 'media'];
+	attrsToCheck.forEach((attr) => {
+		const newVal = newEl.getAttribute(attr);
+		const oldVal = oldEl.getAttribute(attr);
+		if (newVal !== null && oldVal !== newVal) {
+			oldEl.setAttribute(attr, newVal);
+		} else if (newVal === null && oldVal !== null) {
+			oldEl.removeAttribute(attr);
+		}
+	});
+};
+
+const updateBaseElement = (oldEl: Element, newEl: Element) => {
+	const newHref = newEl.getAttribute('href');
+	const newTarget = newEl.getAttribute('target');
+	if (newHref && oldEl.getAttribute('href') !== newHref) {
+		oldEl.setAttribute('href', newHref);
+	}
+	if (newTarget && oldEl.getAttribute('target') !== newTarget) {
+		oldEl.setAttribute('target', newTarget);
+	}
+};
+
+const updateHeadElement = (oldEl: Element, newEl: Element) => {
+	const tag = oldEl.tagName.toLowerCase();
+
+	if (tag === 'title') {
+		updateTitleElement(oldEl, newEl);
+
+		return;
+	}
+
+	if (tag === 'meta') {
+		updateMetaElement(oldEl, newEl);
+
+		return;
+	}
+
+	if (tag === 'link') {
+		updateLinkElement(oldEl, newEl);
+
+		return;
+	}
+
+	if (tag === 'base') {
+		updateBaseElement(oldEl, newEl);
+	}
+};
+
+const addHeadElement = (newEl: Element) => {
+	const clone = document.createElement(newEl.tagName.toLowerCase());
+	for (const attr of Array.from(newEl.attributes)) {
+		clone.setAttribute(attr.name, attr.value);
+	}
+	clone.textContent = newEl.textContent;
+	clone.setAttribute('data-hmr-source', 'patched');
+
+	const tag = newEl.tagName.toLowerCase();
+	const { head } = document;
+	let insertBefore: Node | null = null;
+
+	if (tag === 'title') {
+		insertBefore = head.firstChild;
+	} else if (tag === 'meta') {
+		const firstLink = head.querySelector('link');
+		const firstScript = head.querySelector('script');
+		insertBefore = firstLink || firstScript;
+	} else if (tag === 'link') {
+		const firstScript = head.querySelector('script');
+		insertBefore = firstScript;
+	}
+
+	if (insertBefore) {
+		head.insertBefore(clone, insertBefore);
+	} else {
+		head.appendChild(clone);
+	}
+};
+
+const removeStaleElement = (existingEl: Element) => {
+	if (shouldPreserveElement(existingEl)) return;
+	const tag = existingEl.tagName.toLowerCase();
+	const rel = existingEl.getAttribute('rel') || '';
+	if (tag === 'link' && rel === 'stylesheet') return;
+	existingEl.remove();
+};
+
+export const patchHeadInPlace = (newHeadHTML: string) => {
+	if (!newHeadHTML) return;
+
+	const tempDiv = document.createElement('div');
+	tempDiv.innerHTML = newHeadHTML;
+
+	const existingMap = new Map<string, Element>();
+	const newMap = new Map<string, Element>();
+
+	Array.from(document.head.children).forEach((elem) => {
+		if (shouldPreserveElement(elem)) return;
+		const key = getHeadElementKey(elem);
+		if (key) {
+			existingMap.set(key, elem);
+		}
+	});
+
+	Array.from(tempDiv.children).forEach((elem) => {
+		const key = getHeadElementKey(elem);
+		if (key) {
+			newMap.set(key, elem);
+		}
+	});
+
+	newMap.forEach((newEl, key) => {
+		const existingEl = existingMap.get(key);
+		if (existingEl) {
+			updateHeadElement(existingEl, newEl);
+		} else {
+			addHeadElement(newEl);
+		}
+	});
+
+	existingMap.forEach((existingEl, key) => {
+		if (!newMap.has(key)) {
+			removeStaleElement(existingEl);
+		}
+	});
+};

package/dist/dev/client/hmrClient.ts

@@ -0,0 +1,273 @@
+import type {} from '../../types/globals';
+/* AbsoluteJS HMR Client - Entry point
+   Initializes WebSocket connection, dispatches messages to framework handlers */
+
+import { hmrState } from './hmrState';
+import {
+	HMR_UPDATE_TIMEOUT_MS,
+	MAX_RECONNECT_ATTEMPTS,
+	PING_INTERVAL_MS,
+	RECONNECT_INITIAL_DELAY_MS,
+	RECONNECT_POLL_INTERVAL_MS,
+	WEBSOCKET_NORMAL_CLOSURE
+} from './constants';
+import { detectCurrentFramework } from './frameworkDetect';
+import { hideErrorOverlay, showErrorOverlay } from './errorOverlay';
+import { handleAngularUpdate } from './handlers/angular';
+import { handleReactUpdate } from './handlers/react';
+import { handleHTMLUpdate, handleScriptUpdate } from './handlers/html';
+import { handleHTMXUpdate } from './handlers/htmx';
+import { handleSvelteUpdate } from './handlers/svelte';
+import { handleVueUpdate } from './handlers/vue';
+import { reloadCSSStylesheets } from './cssUtils';
+import {
+	handleFullReload,
+	handleManifest,
+	handleModuleUpdate,
+	handleRebuildComplete,
+	handleRebuildError
+} from './handlers/rebuild';
+
+// Initialize HMR globals
+if (typeof window !== 'undefined') {
+	if (!window.__HMR_MANIFEST__) {
+		window.__HMR_MANIFEST__ = {};
+	}
+	if (!window.__HMR_MODULE_UPDATES__) {
+		window.__HMR_MODULE_UPDATES__ = [];
+	}
+	if (!window.__HMR_MODULE_VERSIONS__) {
+		window.__HMR_MODULE_VERSIONS__ = {};
+	}
+	if (!window.__HMR_SERVER_VERSIONS__) {
+		window.__HMR_SERVER_VERSIONS__ = {};
+	}
+}
+
+// Catch uncaught runtime errors and show the error overlay
+window.addEventListener('error', (evt) => {
+	if (!evt.error) return;
+	showErrorOverlay({
+		framework: detectCurrentFramework() || undefined,
+		kind: 'runtime',
+		message:
+			evt.error instanceof Error
+				? evt.error.stack || evt.error.message
+				: String(evt.error)
+	});
+});
+
+window.addEventListener('unhandledrejection', (evt) => {
+	if (!evt.reason) return;
+	showErrorOverlay({
+		framework: detectCurrentFramework() || undefined,
+		kind: 'runtime',
+		message:
+			evt.reason instanceof Error
+				? evt.reason.stack || evt.reason.message
+				: String(evt.reason)
+	});
+});
+
+const hmrUpdateTypes = new Set([
+	'angular-update',
+	'react-update',
+	'html-update',
+	'htmx-update',
+	'vue-update',
+	'svelte-update',
+	'style-update',
+	'module-update',
+	'rebuild-start'
+]);
+
+type HMRMessage = {
+	data: {
+		affectedFrameworks?: string[];
+		column?: number;
+		error?: string;
+		file?: string;
+		framework?: string;
+		hasCSSChanges?: boolean;
+		hasComponentChanges?: boolean;
+		html?: string | { body?: string; head?: string; html?: string };
+		line?: number;
+		lineText?: string;
+		manifest?: Record<string, string>;
+		moduleVersions?: Record<string, number>;
+		pageModuleUrl?: string;
+		primarySource?: string;
+		scriptUrl?: string;
+		serverDuration?: number;
+		serverVersions?: Record<string, number>;
+	};
+	type: string;
+};
+
+const handleHMRMessage = (message: HMRMessage) => {
+	if (hmrUpdateTypes.has(message.type)) {
+		hmrState.isHMRUpdating = true;
+		setTimeout(() => {
+			hmrState.isHMRUpdating = false;
+		}, HMR_UPDATE_TIMEOUT_MS);
+	}
+
+	switch (message.type) {
+		case 'manifest':
+			handleManifest(message);
+			break;
+		case 'rebuild-start':
+			break;
+		case 'rebuild-complete':
+			handleRebuildComplete(message);
+			break;
+		case 'framework-update':
+			break;
+		case 'module-update':
+			hideErrorOverlay();
+			handleModuleUpdate(message);
+			break;
+		case 'react-update':
+			handleReactUpdate(message);
+			break;
+		case 'script-update':
+			hideErrorOverlay();
+			handleScriptUpdate(message);
+			break;
+		case 'html-update':
+			hideErrorOverlay();
+			handleHTMLUpdate(message);
+			break;
+		case 'htmx-update':
+			hideErrorOverlay();
+			handleHTMXUpdate(message);
+			break;
+		case 'svelte-update':
+			hideErrorOverlay();
+			handleSvelteUpdate(message);
+			break;
+		case 'vue-update':
+			hideErrorOverlay();
+			handleVueUpdate(message);
+			break;
+		case 'angular-update':
+			hideErrorOverlay();
+			handleAngularUpdate(message);
+			break;
+		case 'rebuild-error':
+			handleRebuildError(message);
+			break;
+		case 'full-reload':
+			handleFullReload();
+			break;
+		case 'pong':
+			break;
+		case 'style-update':
+			reloadCSSStylesheets(message.data.manifest ?? {});
+			break;
+		default:
+			break;
+	}
+};
+
+// Prevent multiple WebSocket connections
+if (!(window.__HMR_WS__ && window.__HMR_WS__.readyState === WebSocket.OPEN)) {
+	// Determine WebSocket URL
+	const wsHost = location.hostname;
+	const wsPort =
+		location.port || (location.protocol === 'https:' ? '443' : '80');
+	const wsProtocol = location.protocol === 'https:' ? 'wss' : 'ws';
+	const wsUrl = `${wsProtocol}://${wsHost}:${wsPort}/hmr`;
+
+	const wsc = new WebSocket(wsUrl);
+	window.__HMR_WS__ = wsc;
+
+	wsc.onopen = function () {
+		hmrState.isConnected = true;
+		sessionStorage.setItem('__HMR_CONNECTED__', 'true');
+
+		const currentFramework = detectCurrentFramework();
+		wsc.send(
+			JSON.stringify({
+				framework: currentFramework,
+				type: 'ready'
+			})
+		);
+
+		if (hmrState.reconnectTimeout) {
+			clearTimeout(hmrState.reconnectTimeout);
+			hmrState.reconnectTimeout = null;
+		}
+
+		hmrState.pingInterval = setInterval(() => {
+			if (wsc.readyState === WebSocket.OPEN && hmrState.isConnected) {
+				wsc.send(JSON.stringify({ type: 'ping' }));
+			}
+		}, PING_INTERVAL_MS);
+	};
+
+	wsc.onmessage = function (event: MessageEvent) {
+		let message;
+		try {
+			message = JSON.parse(event.data);
+		} catch {
+			return;
+		}
+
+		handleHMRMessage(message);
+	};
+
+	wsc.onclose = function (event: CloseEvent) {
+		hmrState.isConnected = false;
+
+		if (hmrState.pingInterval) {
+			clearInterval(hmrState.pingInterval);
+			hmrState.pingInterval = null;
+		}
+
+		if (event.code !== WEBSOCKET_NORMAL_CLOSURE) {
+			let attempts = 0;
+			hmrState.reconnectTimeout = setTimeout(function pollServer() {
+				attempts++;
+				if (attempts > MAX_RECONNECT_ATTEMPTS) return;
+
+				fetch('/hmr-status', { cache: 'no-store' })
+					.then((res) => {
+						if (res.ok) {
+							window.location.reload();
+						} else {
+							hmrState.reconnectTimeout = setTimeout(
+								pollServer,
+								RECONNECT_POLL_INTERVAL_MS
+							);
+						}
+
+						return undefined;
+					})
+					.catch(() => {
+						hmrState.reconnectTimeout = setTimeout(
+							pollServer,
+							RECONNECT_POLL_INTERVAL_MS
+						);
+					});
+			}, RECONNECT_INITIAL_DELAY_MS);
+		}
+	};
+
+	wsc.onerror = function () {
+		hmrState.isConnected = false;
+	};
+
+	window.addEventListener('beforeunload', () => {
+		if (hmrState.isHMRUpdating) {
+			if (hmrState.pingInterval) clearInterval(hmrState.pingInterval);
+			if (hmrState.reconnectTimeout)
+				clearTimeout(hmrState.reconnectTimeout);
+
+			return;
+		}
+
+		if (hmrState.pingInterval) clearInterval(hmrState.pingInterval);
+		if (hmrState.reconnectTimeout) clearTimeout(hmrState.reconnectTimeout);
+	});
+}

package/dist/dev/client/hmrState.ts

@@ -0,0 +1,14 @@
+import type {} from '../../types/globals';
+export const hmrState: {
+	isConnected: boolean;
+	isFirstHMRUpdate: boolean;
+	isHMRUpdating: boolean;
+	pingInterval: ReturnType<typeof setInterval> | null;
+	reconnectTimeout: ReturnType<typeof setTimeout> | null;
+} = {
+	isConnected: false,
+	isFirstHMRUpdate: true,
+	isHMRUpdating: false,
+	pingInterval: null,
+	reconnectTimeout: null
+};

package/dist/dev/client/moduleVersions.ts

@@ -0,0 +1,62 @@
+import type {} from '../../types/globals';
+/* Module version validation and sync */
+
+export const checkModuleVersions = (
+	serverVersions: Record<string, number> | undefined,
+	clientVersions: Record<string, number> | undefined
+) => {
+	if (!serverVersions || !clientVersions) {
+		return { needsSync: false, stale: [] };
+	}
+
+	const stale = Object.entries(serverVersions)
+		.filter(([modulePath, serverVersion]) => {
+			const clientVersion = clientVersions[modulePath];
+
+			return clientVersion === undefined || clientVersion < serverVersion;
+		})
+		.map(([modulePath]) => modulePath);
+
+	return { needsSync: stale.length > 0, stale };
+};
+
+const resolveManifestPath = (
+	modulePath: string,
+	manifest: Record<string, string> | undefined
+) => {
+	if (!manifest) {
+		return modulePath;
+	}
+	for (const key of Object.keys(manifest)) {
+		const path = manifest[key] ?? modulePath;
+		if (path === modulePath || path.includes(modulePath)) {
+			return path;
+		}
+	}
+
+	return modulePath;
+};
+
+export const prefetchModules = (
+	modulePaths: string[],
+	manifest: Record<string, string> | undefined
+) => {
+	const prefetchPromises: Promise<unknown>[] = [];
+
+	for (const modulePath of modulePaths) {
+		const manifestPath = resolveManifestPath(modulePath, manifest);
+
+		const cacheBuster = `?t=${Date.now()}`;
+		const fullPath = manifestPath.startsWith('/')
+			? manifestPath + cacheBuster
+			: `/${manifestPath}${cacheBuster}`;
+
+		prefetchPromises.push(
+			import(fullPath).catch(() => {
+				/* ignore */
+			})
+		);
+	}
+
+	return Promise.all(prefetchPromises);
+};

package/dist/dev/client/reactRefreshSetup.ts

@@ -0,0 +1,32 @@
+import type {} from '../../types/globals';
+/* React Refresh runtime setup — must be imported before any component modules.
+   Bun's reactFastRefresh flag injects $RefreshSig$/$RefreshReg$ calls into
+   component code. This module ensures those globals exist before components
+   initialize.
+
+   IMPORTANT: This module is idempotent. On HMR re-import the existing runtime
+   is preserved so new component registrations feed into the SAME RefreshRuntime
+   instance that owns the current React tree. */
+
+ 
+import * as RefreshRuntime from 'react-refresh/runtime';
+
+if (!window.$RefreshRuntime$) {
+	RefreshRuntime.injectIntoGlobalHook(window);
+	window.$RefreshRuntime$ = RefreshRuntime;
+	window.$RefreshReg$ = (type: unknown, id: string) =>
+		RefreshRuntime.register(type, id);
+	window.$RefreshSig$ = () =>
+		RefreshRuntime.createSignatureFunctionForTransform();
+
+	// Replay buffered registrations from the bootstrap script.
+	// The SSR HTML injects a buffering $RefreshReg$ that captures
+	// registrations before the runtime is ready.
+	const buffer = window.__REFRESH_BUFFER__;
+	if (buffer) {
+		for (const [type, id] of buffer) {
+			RefreshRuntime.register(type, id);
+		}
+		window.__REFRESH_BUFFER__ = undefined;
+	}
+}