@absolutejs/absolute 0.19.0-beta.1041 → 0.19.0-beta.1043

package/dist/dev/client/errorOverlay.ts

@@ -1,445 +0,0 @@
-import type {} from '../../types/globals';
-/* AbsoluteJS Error Overlay - branded, per-framework, modern styling */
-
-import type { ErrorOverlayOptions } from '../../types/client';
-import { OVERLAY_FADE_DURATION_MS } from './constants';
-
-let errorOverlayElement: HTMLDivElement | null = null;
-let currentOverlayKind: 'compilation' | 'runtime' | null = null;
-// Runtime errors accumulate so a second uncaught error in the same tick
-// doesn't silently replace the first — the overlay shows nav buttons and
-// a "N of M" badge so you can step through them.
-const runtimeErrors: ErrorOverlayOptions[] = [];
-let activeRuntimeIndex = 0;
-let pendingCompilationOpts: ErrorOverlayOptions | null = null;
-// Tracks which queue renderOverlay should pull from. Driven by
-// showErrorOverlay BEFORE renderOverlay runs so the choice is unambiguous
-// (currentOverlayKind reflects what's currently mounted, not what's queued).
-let activeMode: 'runtime' | 'compilation' | null = null;
-
-const frameworkLabels: Record<string, string> = {
-	angular: 'Angular',
-	assets: 'Assets',
-	html: 'HTML',
-	htmx: 'HTMX',
-	react: 'React',
-	svelte: 'Svelte',
-	unknown: 'Unknown',
-	vue: 'Vue'
-};
-
-const frameworkColors: Record<string, string> = {
-	angular: '#dd0031',
-	assets: '#563d7c',
-	html: '#e34c26',
-	htmx: '#1a365d',
-	react: '#61dafb',
-	svelte: '#ff3e00',
-	unknown: '#94a3b8',
-	vue: '#42b883'
-};
-
-const removeOverlayElement = () => {
-	if (errorOverlayElement && errorOverlayElement.parentNode) {
-		errorOverlayElement.parentNode.removeChild(errorOverlayElement);
-	}
-	errorOverlayElement = null;
-	currentOverlayKind = null;
-};
-
-export const hideErrorOverlay = () => {
-	const elm = errorOverlayElement;
-	// Clearing on dismiss — if more errors arrive after this they get a
-	// fresh overlay, otherwise stale entries accumulate forever.
-	runtimeErrors.length = 0;
-	activeRuntimeIndex = 0;
-	pendingCompilationOpts = null;
-	activeMode = null;
-	if (!elm || !elm.parentNode) {
-		removeOverlayElement();
-
-		return;
-	}
-	elm.style.transition = 'opacity 150ms ease-out';
-	elm.style.opacity = '0';
-	errorOverlayElement = null;
-	currentOverlayKind = null;
-	setTimeout(() => {
-		if (elm.parentNode) elm.parentNode.removeChild(elm);
-	}, OVERLAY_FADE_DURATION_MS);
-};
-
-export const isRuntimeErrorOverlay = () => currentOverlayKind === 'runtime';
-
-const sectionLabelStyle =
-	'font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.08em;color:#94a3b8;margin-bottom:8px;';
-const codeBlockStyle =
-	'margin:0;padding:14px 18px;background:rgba(15,23,42,0.8);border-radius:10px;border:1px solid rgba(71,85,105,0.4);color:#cbd5e1;font-size:12.5px;line-height:1.55;overflow-x:auto;white-space:pre;font-family:inherit;';
-
-const buildLocationSection = (
-	file: string | undefined,
-	line: number | undefined,
-	column: number | undefined,
-	lineText: string | undefined
-) => {
-	if (!file && line === undefined && column === undefined && !lineText) {
-		return null;
-	}
-
-	const locSection = document.createElement('div');
-	locSection.style.cssText = 'margin-bottom:20px;';
-
-	const locLabel = document.createElement('div');
-	locLabel.style.cssText = sectionLabelStyle;
-	locLabel.textContent = 'Where';
-	locSection.appendChild(locLabel);
-
-	const locParts: string[] = [];
-	if (file) locParts.push(file);
-	if (line !== undefined) locParts.push(String(line));
-	if (column !== undefined) locParts.push(String(column));
-	const loc = locParts.join(':') || 'Unknown location';
-
-	const locEl = document.createElement('div');
-	locEl.style.cssText =
-		'padding:12px 18px;background:rgba(71,85,105,0.3);border-radius:10px;border:1px solid rgba(71,85,105,0.4);color:#cbd5e1;font-size:13px;word-break:break-all;';
-	locEl.textContent = loc;
-	locSection.appendChild(locEl);
-
-	if (lineText) {
-		const codeBlock = document.createElement('pre');
-		codeBlock.style.cssText = `${codeBlockStyle  }margin-top:8px;`;
-		codeBlock.textContent = lineText;
-		locSection.appendChild(codeBlock);
-	}
-
-	return locSection;
-};
-
-// Strip the leading `${ErrorName}: ${message}` line from a stack if it just
-// repeats what's already shown in the "What went wrong" panel — keeps the
-// stack panel focused on frames.
-const cleanStack = (message: string, stack: string) => {
-	const firstNewline = stack.indexOf('\n');
-	if (firstNewline === -1) return stack;
-	const head = stack.slice(0, firstNewline).trim();
-	if (head === message || head.endsWith(`: ${message}`)) {
-		return stack.slice(firstNewline + 1).replace(/^\n+/, '');
-	}
-
-	return stack;
-};
-
-const buildStackSection = (stack: string | undefined, message: string) => {
-	if (!stack) return null;
-	const cleaned = cleanStack(message, stack);
-	if (!cleaned.trim()) return null;
-	const section = document.createElement('div');
-	section.style.cssText = 'margin-bottom:20px;';
-	const label = document.createElement('div');
-	label.style.cssText = sectionLabelStyle;
-	label.textContent = 'Stack';
-	section.appendChild(label);
-	const pre = document.createElement('pre');
-	pre.style.cssText = `${codeBlockStyle  }max-height:300px;overflow-y:auto;`;
-	pre.textContent = cleaned;
-	section.appendChild(pre);
-
-	return section;
-};
-
-// Reads the live document for every <script src> currently mounted.
-// Most useful diagnostic for "I'm seeing a chunk hash that no longer
-// exists on disk" — confirms which bundle the browser actually loaded.
-const collectLoadedScripts = () => {
-	const scripts = Array.from(document.querySelectorAll('script[src]'));
-	const urls: string[] = [];
-	for (const script of scripts) {
-		const {src} = (script as HTMLScriptElement);
-		if (!src) continue;
-		// Filter to JS we serve — vendor chunks, generated indexes, root
-		// chunk-XXX.js outputs. Skip user-pasted CDN scripts and the like.
-		if (
-			src.includes('/vendor/') ||
-			src.includes('/generated/') ||
-			/\/chunk-[a-z0-9]+\.js(\?|$)/i.test(src) ||
-			src.includes('/_src_indexes/')
-		) {
-			urls.push(src);
-		}
-	}
-
-	return urls;
-};
-
-const buildDiagnosticsSection = () => {
-	const section = document.createElement('div');
-	section.style.cssText = 'margin-bottom:20px;';
-	const label = document.createElement('div');
-	label.style.cssText = sectionLabelStyle;
-	label.textContent = 'Diagnostics';
-	section.appendChild(label);
-
-	const lines: string[] = [];
-	lines.push(`Page URL: ${window.location.href}`);
-	const ua = navigator.userAgent;
-	lines.push(`User agent: ${ua}`);
-	const scripts = collectLoadedScripts();
-	if (scripts.length > 0) {
-		lines.push('');
-		lines.push(`Loaded chunks (${scripts.length}):`);
-		for (const url of scripts) {
-			// Strip origin so the chunk hash is the focal point.
-			lines.push(`  ${url.replace(window.location.origin, '') || url}`);
-		}
-	}
-
-	const pre = document.createElement('pre');
-	pre.style.cssText = `${codeBlockStyle  }max-height:200px;overflow-y:auto;`;
-	pre.textContent = lines.join('\n');
-	section.appendChild(pre);
-
-	return section;
-};
-
-const buildErrorMessageSection = (message: string) => {
-	const errorSection = document.createElement('div');
-	errorSection.style.cssText = 'margin-bottom:20px;';
-	const errorLabel = document.createElement('div');
-	errorLabel.style.cssText = sectionLabelStyle;
-	errorLabel.textContent = 'What went wrong';
-	errorSection.appendChild(errorLabel);
-	const msgEl = document.createElement('pre');
-	msgEl.style.cssText =
-		'margin:0;padding:16px 20px;background:rgba(239,68,68,0.12);border:1px solid rgba(239,68,68,0.25);border-radius:10px;overflow-x:auto;white-space:pre-wrap;word-break:break-word;color:#fca5a5;font-size:13px;line-height:1.5;font-family:inherit;';
-	msgEl.textContent = message;
-	errorSection.appendChild(msgEl);
-
-	return errorSection;
-};
-
-const formatErrorForCopy = (opts: ErrorOverlayOptions) => {
-	const lines: string[] = [];
-	lines.push(
-		`# ${opts.kind === 'runtime' ? 'Runtime' : 'Compilation'} error`
-	);
-	if (opts.framework) lines.push(`Framework: ${opts.framework}`);
-	lines.push('');
-	lines.push('## Message');
-	lines.push(opts.message || '(no message)');
-	if (opts.file || opts.line !== undefined) {
-		lines.push('');
-		lines.push('## Where');
-		const locParts: string[] = [];
-		if (opts.file) locParts.push(opts.file);
-		if (opts.line !== undefined) locParts.push(String(opts.line));
-		if (opts.column !== undefined) locParts.push(String(opts.column));
-		lines.push(locParts.join(':'));
-		if (opts.lineText) {
-			lines.push('');
-			lines.push(opts.lineText);
-		}
-	}
-	if (opts.stack) {
-		lines.push('');
-		lines.push('## Stack');
-		lines.push(cleanStack(opts.message || '', opts.stack));
-	}
-	lines.push('');
-	lines.push('## Diagnostics');
-	lines.push(`Page URL: ${window.location.href}`);
-	lines.push(`User agent: ${navigator.userAgent}`);
-	const scripts = collectLoadedScripts();
-	if (scripts.length > 0) {
-		lines.push('');
-		lines.push(`Loaded chunks (${scripts.length}):`);
-		for (const url of scripts) {
-			lines.push(`  ${url.replace(window.location.origin, '') || url}`);
-		}
-	}
-
-	return lines.join('\n');
-};
-
-const renderOverlay = () => {
-	const opts =
-		activeMode === 'runtime'
-			? runtimeErrors[activeRuntimeIndex]
-			: pendingCompilationOpts;
-	if (!opts) return;
-	const message = opts.message || 'Build failed';
-	const { file, line, column, lineText, stack } = opts;
-	const framework = (opts.framework || 'unknown').toLowerCase();
-	const frameworkLabel = frameworkLabels[framework] || framework;
-	const accent = frameworkColors[framework] || '#94a3b8';
-
-	removeOverlayElement();
-	currentOverlayKind = opts.kind || 'compilation';
-
-	const overlay = document.createElement('div');
-	overlay.id = 'absolutejs-error-overlay';
-	overlay.setAttribute('data-hmr-overlay', 'true');
-	overlay.style.cssText =
-		'position:fixed;inset:0;z-index:2147483647;background:linear-gradient(135deg,rgba(15,23,42,0.98) 0%,rgba(30,41,59,0.98) 100%);backdrop-filter:blur(12px);color:#e2e8f0;font-family:"JetBrains Mono","Fira Code",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:14px;line-height:1.6;overflow:auto;padding:32px;box-sizing:border-box;display:flex;align-items:flex-start;justify-content:center;';
-
-	const card = document.createElement('div');
-	card.style.cssText =
-		'max-width:780px;width:100%;background:rgba(30,41,59,0.6);border:1px solid rgba(71,85,105,0.5);border-radius:16px;box-shadow:0 25px 50px -12px rgba(0,0,0,0.5),0 0 0 1px rgba(255,255,255,0.05);overflow:hidden;';
-
-	const header = document.createElement('div');
-	header.style.cssText =
-		'display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;background:rgba(15,23,42,0.5);border-bottom:1px solid rgba(71,85,105,0.4);';
-	header.innerHTML = `<div style="display:flex;align-items:center;gap:12px;"><span style="font-weight:700;font-size:20px;color:#fff;letter-spacing:-0.02em;">AbsoluteJS</span><span style="padding:5px 10px;border-radius:8px;font-size:12px;font-weight:600;background:${
-		accent
-	};color:#fff;opacity:0.95;box-shadow:0 2px 4px rgba(0,0,0,0.2);">${
-		frameworkLabel
-	}</span></div><span style="color:#94a3b8;font-size:13px;font-weight:500;">${
-		opts.kind === 'runtime' ? 'Runtime Error' : 'Compilation Error'
-	}</span>`;
-	card.appendChild(header);
-
-	const content = document.createElement('div');
-	content.style.cssText = 'padding:24px;';
-
-	// Multi-error nav: visible only when more than one runtime error has
-	// fired since the last dismiss. Compilation errors always replace, so
-	// they never need this row.
-	if (activeMode === 'runtime' && runtimeErrors.length > 1) {
-		const navRow = document.createElement('div');
-		navRow.style.cssText =
-			'display:flex;align-items:center;gap:12px;margin-bottom:20px;padding:10px 14px;background:rgba(71,85,105,0.25);border-radius:10px;border:1px solid rgba(71,85,105,0.4);';
-		const prev = document.createElement('button');
-		prev.textContent = '◀';
-		prev.style.cssText =
-			'padding:4px 10px;background:rgba(15,23,42,0.6);color:#cbd5e1;border:1px solid rgba(71,85,105,0.6);border-radius:6px;font-size:13px;cursor:pointer;font-family:inherit;';
-		prev.disabled = activeRuntimeIndex === 0;
-		if (prev.disabled) prev.style.opacity = '0.4';
-		prev.onclick = () => {
-			if (activeRuntimeIndex > 0) {
-				activeRuntimeIndex -= 1;
-				renderOverlay();
-			}
-		};
-		const next = document.createElement('button');
-		next.textContent = '▶';
-		next.style.cssText = prev.style.cssText;
-		next.disabled = activeRuntimeIndex >= runtimeErrors.length - 1;
-		if (next.disabled) next.style.opacity = '0.4';
-		next.onclick = () => {
-			if (activeRuntimeIndex < runtimeErrors.length - 1) {
-				activeRuntimeIndex += 1;
-				renderOverlay();
-			}
-		};
-		const counter = document.createElement('span');
-		counter.style.cssText = 'color:#cbd5e1;font-size:13px;';
-		counter.textContent = `Error ${activeRuntimeIndex + 1} of ${runtimeErrors.length}`;
-		navRow.appendChild(prev);
-		navRow.appendChild(next);
-		navRow.appendChild(counter);
-		content.appendChild(navRow);
-	}
-
-	content.appendChild(buildErrorMessageSection(message));
-	const locSection = buildLocationSection(file, line, column, lineText);
-	if (locSection) content.appendChild(locSection);
-	const stackSection = buildStackSection(stack, message);
-	if (stackSection) content.appendChild(stackSection);
-	if (activeMode === 'runtime') {
-		content.appendChild(buildDiagnosticsSection());
-	}
-
-	const footer = document.createElement('div');
-	footer.style.cssText =
-		'display:flex;justify-content:flex-end;gap:10px;padding-top:8px;';
-
-	const copy = document.createElement('button');
-	copy.textContent = 'Copy';
-	copy.style.cssText =
-		'padding:10px 16px;background:rgba(71,85,105,0.4);color:#e2e8f0;border:1px solid rgba(71,85,105,0.6);border-radius:10px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;transition:opacity 0.15s,transform 0.15s;';
-	copy.onmouseover = () => {
-		copy.style.opacity = '0.85';
-	};
-	copy.onmouseout = () => {
-		copy.style.opacity = '1';
-	};
-	copy.onclick = async () => {
-		const text = formatErrorForCopy(opts);
-		try {
-			await navigator.clipboard.writeText(text);
-			copy.textContent = 'Copied';
-			setTimeout(() => {
-				copy.textContent = 'Copy';
-			}, 1500);
-		} catch {
-			// Clipboard API requires a user gesture + permissions; fall back
-			// to a textarea + execCommand so the button still does something.
-			const ta = document.createElement('textarea');
-			ta.value = text;
-			ta.style.position = 'fixed';
-			ta.style.opacity = '0';
-			document.body.appendChild(ta);
-			ta.select();
-			try {
-				document.execCommand('copy');
-				copy.textContent = 'Copied';
-				setTimeout(() => {
-					copy.textContent = 'Copy';
-				}, 1500);
-			} catch {
-				copy.textContent = 'Copy failed';
-			}
-			document.body.removeChild(ta);
-		}
-	};
-	footer.appendChild(copy);
-
-	const dismiss = document.createElement('button');
-	dismiss.textContent = 'Dismiss';
-	dismiss.style.cssText = `padding:10px 20px;background:${
-		accent
-	};color:#fff;border:none;border-radius:10px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;box-shadow:0 2px 8px rgba(0,0,0,0.2);transition:opacity 0.15s,transform 0.15s;`;
-	dismiss.onmouseover = () => {
-		dismiss.style.opacity = '0.9';
-		dismiss.style.transform = 'translateY(-1px)';
-	};
-	dismiss.onmouseout = () => {
-		dismiss.style.opacity = '1';
-		dismiss.style.transform = 'translateY(0)';
-	};
-	dismiss.onclick = hideErrorOverlay;
-	footer.appendChild(dismiss);
-	content.appendChild(footer);
-	card.appendChild(content);
-	overlay.appendChild(card);
-	if (!document.body) return;
-	document.body.appendChild(overlay);
-	errorOverlayElement = overlay;
-};
-
-export const showErrorOverlay = (opts: ErrorOverlayOptions) => {
-	const kind = opts.kind || 'compilation';
-	activeMode = kind;
-	if (kind === 'runtime') {
-		// Suppress duplicates — Angular and other frameworks often re-throw
-		// the same error from multiple async boundaries (zone, scheduler,
-		// resolver). Identifying by message+stack catches the common case
-		// without needing structured equality.
-		const sig = `${opts.message ?? ''}::${opts.stack ?? ''}`;
-		const isDup = runtimeErrors.some(
-			(prev) => `${prev.message ?? ''}::${prev.stack ?? ''}` === sig
-		);
-		if (!isDup) {
-			runtimeErrors.push(opts);
-			activeRuntimeIndex = runtimeErrors.length - 1;
-		}
-	} else {
-		pendingCompilationOpts = opts;
-		// Compilation errors are global build state — reset runtime queue
-		// since old runtime errors from before the build attempt aren't
-		// actionable anymore.
-		runtimeErrors.length = 0;
-		activeRuntimeIndex = 0;
-	}
-	renderOverlay();
-};

package/dist/dev/client/frameworkDetect.ts

@@ -1,63 +0,0 @@
-import type {} from '../../types/globals';
-/* Framework detection and manifest lookup utilities */
-
-export const detectCurrentFramework = () => {
-	if (window.__HMR_FRAMEWORK__) return window.__HMR_FRAMEWORK__;
-	if (window.__REACT_ROOT__) return 'react';
-	const path = window.location.pathname;
-	if (path === '/vue' || path.startsWith('/vue/')) return 'vue';
-	if (path === '/svelte' || path.startsWith('/svelte/')) return 'svelte';
-	if (path === '/angular' || path.startsWith('/angular/')) return 'angular';
-	if (path === '/htmx' || path.startsWith('/htmx/')) return 'htmx';
-	if (path === '/html' || path.startsWith('/html/')) return 'html';
-	if (path === '/react' || path.startsWith('/react/')) return 'react';
-
-	return null;
-};
-export const findIndexPath = (
-	manifest: Record<string, string> | undefined,
-	sourceFile: string | undefined,
-	framework: string
-) => {
-	if (!manifest) return null;
-
-	if (sourceFile) {
-		const componentName = getComponentNameFromPath(sourceFile);
-		const indexKey = componentName ? `${componentName}Index` : null;
-		if (indexKey && manifest[indexKey]) {
-			return manifest[indexKey];
-		}
-	}
-
-	const frameworkPatterns: Record<string, RegExp> = {
-		angular: /angular/i,
-		react: /react/i,
-		svelte: /svelte/i,
-		vue: /vue/i
-	};
-	const pattern = frameworkPatterns[framework];
-
-	for (const key in manifest) {
-		const value = manifest[key];
-		if (
-			key.endsWith('Index') &&
-			value &&
-			(!pattern || pattern.test(key) || value.includes(`/${framework}/`))
-		) {
-			return value;
-		}
-	}
-
-	return null;
-};
-export const getComponentNameFromPath = (filePath: string) => {
-	if (!filePath) return null;
-	const parts = filePath.replace(/\\/g, '/').split('/');
-	const fileName = parts[parts.length - 1] || '';
-	const baseName = fileName.replace(/\.(tsx?|jsx?|vue|svelte|html)$/, '');
-
-	return baseName
-		.split(/[-_]/)
-		.map((word) => word.charAt(0).toUpperCase() + word.slice(1))
-		.join('');
-};

package/dist/dev/client/handlers/angularHmrShim.ts

@@ -1,88 +0,0 @@
-import type {} from '../../../types/globals';
-/* `globalThis.__angularHmr` runtime shim.
- *
- * The HMR injection plugin
- * (`src/dev/angular/hmrInjectionPlugin.ts`) appends per-component
- * `__ng_hmr_load` blocks that subscribe via
- * `globalThis.__angularHmr.on('angular:component-update', cb)`.
- * This file installs that bus.
- *
- * It must run before any component chunk does — the injected blocks
- * `if (… && globalThis.__angularHmr.on)` no-op if the shim isn't
- * defined yet, so a registration would silently miss. We keep the
- * shim setup synchronous + at module scope so it's installed during
- * `hmrClient.ts`'s import-evaluation pass, before page chunks load. */
-
-export type AngularHmrEvent =
-	| 'angular:component-update'
-	| 'angular:component-remount';
-export type AngularComponentUpdate = {
-	id: string;
-	timestamp: number;
-};
-export type AngularHmrListener = (data: AngularComponentUpdate) => void;
-
-type AngularHmrBus = {
-	on(event: AngularHmrEvent, cb: AngularHmrListener): void;
-	off(event: AngularHmrEvent, cb: AngularHmrListener): void;
-	dispatch(event: AngularHmrEvent, data: AngularComponentUpdate): void;
-};
-
-declare global {
-	// eslint-disable-next-line @typescript-eslint/consistent-type-definitions -- Window augmentation requires interface merging
-	interface Window {
-		__angularHmr?: AngularHmrBus;
-	}
-	 
-	var __angularHmr: AngularHmrBus | undefined;
-}
-
-const installAngularHmrShim = () => {
-	const listeners = new Map<AngularHmrEvent, Set<AngularHmrListener>>();
-
-	const bus: AngularHmrBus = {
-		dispatch(event, data) {
-			const set = listeners.get(event);
-			if (!set) return;
-			// Snapshot before iterating — handlers could remove themselves.
-			for (const cb of [...set]) {
-				try {
-					cb(data);
-				} catch (err) {
-					console.error(
-						'[absolutejs] angular HMR listener threw',
-						err
-					);
-				}
-			}
-		},
-		off(event, cb) {
-			listeners.get(event)?.delete(cb);
-		},
-		on(event, cb) {
-			let set = listeners.get(event);
-			if (!set) {
-				set = new Set();
-				listeners.set(event, set);
-			}
-			set.add(cb);
-		}
-	};
-
-	return bus;
-};
-
-if (typeof globalThis !== 'undefined' && !globalThis.__angularHmr) {
-	globalThis.__angularHmr = installAngularHmrShim();
-}
-
-export const dispatchAngularComponentRemount = (
-	data: AngularComponentUpdate
-) => {
-	globalThis.__angularHmr?.dispatch('angular:component-remount', data);
-};
-export const dispatchAngularComponentUpdate = (
-	data: AngularComponentUpdate
-) => {
-	globalThis.__angularHmr?.dispatch('angular:component-update', data);
-};