@qwik.dev/core 2.0.0-beta.4 → 2.0.0-beta.40

package/dist/qwikloader.debug.js

@@ -1,246 +1,405 @@
-const doc = document;
-const win = window;
-const events = /* @__PURE__ */ new Set();
-const roots = /* @__PURE__ */ new Set([doc]);
-let hasInitialized;
-const nativeQuerySelectorAll = (root, selector) => Array.from(root.querySelectorAll(selector));
-const querySelectorAll = (query) => {
-  const elements = [];
-  roots.forEach((root) => elements.push(...nativeQuerySelectorAll(root, query)));
-  return elements;
-};
-const findShadowRoots = (fragment) => {
-  processEventOrNode(fragment);
-  nativeQuerySelectorAll(fragment, "[q\\:shadowroot]").forEach((parent) => {
-    const shadowRoot = parent.shadowRoot;
-    shadowRoot && findShadowRoots(shadowRoot);
-  });
-};
-const isPromise = (promise) => promise && typeof promise.then === "function";
-let doNotClean = true;
-const broadcast = (infix, ev, type = ev.type) => {
-  let found = doNotClean;
-  querySelectorAll("[on" + infix + "\\:" + type + "]").forEach((el) => {
-    found = true;
-    dispatch(el, infix, ev, type);
-  });
-  if (!found) {
-    window[infix.slice(1)].removeEventListener(
-      type,
-      infix === "-window" ? processWindowEvent : processDocumentEvent
-    );
-  }
-};
-const resolveContainer = (containerEl) => {
-  if (containerEl._qwikjson_ === void 0) {
-    const parentJSON = containerEl === doc.documentElement ? doc.body : containerEl;
-    let script = parentJSON.lastElementChild;
-    while (script) {
-      if (script.tagName === "SCRIPT" && script.getAttribute("type") === "qwik/json") {
-        containerEl._qwikjson_ = JSON.parse(
-          script.textContent.replace(/\\x3C(\/?script)/gi, "<$1")
-        );
-        break;
-      }
-      script = script.previousElementSibling;
-    }
-  }
-};
-const createEvent = (eventName, detail) => new CustomEvent(eventName, {
-  detail
+//#region packages/qwik/src/qwikloader.ts
+var doc = document;
+var win = window;
+var windowPrefix = "w";
+var passiveWindowPrefix = "wp";
+var documentPrefix = "d";
+var passiveDocumentPrefix = "dp";
+var elementPrefix = "e";
+var passiveElementPrefix = "ep";
+var capturePrefix = "capture:";
+var readyStateChange = "readystatechange";
+var QwikEvContainerReady = 0;
+var events = /* @__PURE__ */ new Set();
+var roots = /* @__PURE__ */ new Set([doc]);
+var symbols = /* @__PURE__ */ new Map();
+var readyContainers = {};
+var observer;
+var hasInitialized;
+var queuedTasks;
+var nativeQuerySelectorAll = (root, selector) => Array.from(root.querySelectorAll(selector));
+var querySelectorAll = (query) => {
+	const elements = [];
+	roots.forEach((root) => elements.push(...nativeQuerySelectorAll(root, query)));
+	return elements;
+};
+var addEventListener = (el, eventName, handler, capture = false, passive = false) => el.addEventListener(eventName, handler, {
+	capture,
+	passive
 });
-const dispatch = async (element, scope, ev, eventName = ev.type) => {
-  const attrName = "on" + scope + ":" + eventName;
-  if (element.hasAttribute("preventdefault:" + eventName)) {
-    ev.preventDefault();
-  }
-  if (element.hasAttribute("stoppropagation:" + eventName)) {
-    ev.stopPropagation();
-  }
-  const ctx = element._qc_;
-  const relevantListeners = ctx && ctx.li.filter((li) => li[0] === attrName);
-  if (relevantListeners && relevantListeners.length > 0) {
-    for (const listener of relevantListeners) {
-      const results = listener[1].getFn([element, ev], () => element.isConnected)(ev, element);
-      const cancelBubble = ev.cancelBubble;
-      if (isPromise(results)) {
-        await results;
-      }
-      if (cancelBubble) {
-        ev.stopPropagation();
-      }
-    }
-    return;
-  }
-  const attrValue = element.getAttribute(attrName);
-  const qDispatchEvent = element.qDispatchEvent;
-  if (qDispatchEvent) {
-    return qDispatchEvent(ev, scope);
-  }
-  if (attrValue) {
-    const container = element.closest(
-      "[q\\:container]:not([q\\:container=html]):not([q\\:container=text])"
-    );
-    const qBase = container.getAttribute("q:base");
-    const qVersion = container.getAttribute("q:version") || "unknown";
-    const qManifest = container.getAttribute("q:manifest-hash") || "dev";
-    const base = new URL(qBase, doc.baseURI);
-    for (const qrl of attrValue.split("\n")) {
-      const url = new URL(qrl, base);
-      const href = url.href;
-      const symbol = url.hash.replace(/^#?([^?[|]*).*$/, "$1") || "default";
-      const reqTime = performance.now();
-      let handler;
-      let importError;
-      let error;
-      const isSync = qrl.startsWith("#");
-      const eventData = {
-        qBase,
-        qManifest,
-        qVersion,
-        href,
-        symbol,
-        element,
-        reqTime
-      };
-      if (isSync) {
-        const hash = container.getAttribute("q:instance");
-        handler = (doc["qFuncs_" + hash] || [])[Number.parseInt(symbol)];
-        if (!handler) {
-          importError = "sync";
-          error = new Error("sym:" + symbol);
-        }
-      } else {
-        emitEvent("qsymbol", eventData);
-        const uri = url.href.split("#")[0];
-        try {
-          const module = import(
-            /* @vite-ignore */
-            uri
-          );
-          resolveContainer(container);
-          handler = (await module)[symbol];
-          if (!handler) {
-            importError = "no-symbol";
-            error = new Error(`${symbol} not in ${uri}`);
-          }
-        } catch (err) {
-          importError || (importError = "async");
-          error = err;
-        }
-      }
-      if (!handler) {
-        emitEvent("qerror", {
-          importError,
-          error,
-          ...eventData
-        });
-        console.error(error);
-        break;
-      }
-      const previousCtx = doc.__q_context__;
-      if (element.isConnected) {
-        try {
-          doc.__q_context__ = [element, ev, url];
-          const results = handler(ev, element);
-          if (isPromise(results)) {
-            await results;
-          }
-        } catch (error2) {
-          emitEvent("qerror", { error: error2, ...eventData });
-        } finally {
-          doc.__q_context__ = previousCtx;
-        }
-      }
-    }
-  }
-};
-const emitEvent = (eventName, detail) => {
-  doc.dispatchEvent(createEvent(eventName, detail));
-};
-const camelToKebab = (str) => str.replace(/([A-Z])/g, (a) => "-" + a.toLowerCase());
-const processDocumentEvent = async (ev) => {
-  let type = camelToKebab(ev.type);
-  let element = ev.target;
-  broadcast("-document", ev, type);
-  while (element && element.getAttribute) {
-    const results = dispatch(element, "", ev, type);
-    let cancelBubble = ev.cancelBubble;
-    if (isPromise(results)) {
-      await results;
-    }
-    cancelBubble || (cancelBubble = cancelBubble || ev.cancelBubble || element.hasAttribute("stoppropagation:" + ev.type));
-    element = ev.bubbles && cancelBubble !== true ? element.parentElement : null;
-  }
-};
-const processWindowEvent = (ev) => {
-  broadcast("-window", ev, camelToKebab(ev.type));
-};
-const processReadyStateChange = () => {
-  var _a;
-  const readyState = doc.readyState;
-  if (!hasInitialized && (readyState == "interactive" || readyState == "complete")) {
-    roots.forEach(findShadowRoots);
-    hasInitialized = 1;
-    emitEvent("qinit");
-    const riC = (_a = win.requestIdleCallback) != null ? _a : win.setTimeout;
-    riC.bind(win)(() => emitEvent("qidle"));
-    if (events.has("qvisible")) {
-      const results = querySelectorAll("[on\\:qvisible]");
-      const observer = new IntersectionObserver((entries) => {
-        for (const entry of entries) {
-          if (entry.isIntersecting) {
-            observer.unobserve(entry.target);
-            dispatch(entry.target, "", createEvent("qvisible", entry));
-          }
-        }
-      });
-      results.forEach((el) => observer.observe(el));
-    }
-  }
-};
-const addEventListener = (el, eventName, handler, capture = false) => {
-  el.addEventListener(eventName, handler, { capture, passive: false });
-};
-let cleanTimer;
-const processEventOrNode = (...eventNames) => {
-  doNotClean = true;
-  clearTimeout(cleanTimer);
-  cleanTimer = setTimeout(() => doNotClean = false, 2e4);
-  for (const eventNameOrNode of eventNames) {
-    if (typeof eventNameOrNode === "string") {
-      if (!events.has(eventNameOrNode)) {
-        roots.forEach(
-          (root) => addEventListener(root, eventNameOrNode, processDocumentEvent, true)
-        );
-        addEventListener(win, eventNameOrNode, processWindowEvent, true);
-        events.add(eventNameOrNode);
-      }
-    } else {
-      if (!roots.has(eventNameOrNode)) {
-        events.forEach(
-          (eventName) => addEventListener(eventNameOrNode, eventName, processDocumentEvent, true)
-        );
-        roots.add(eventNameOrNode);
-      }
-    }
-  }
-};
-if (!("__q_context__" in doc)) {
-  doc.__q_context__ = 0;
-  const qwikevents = win.qwikevents;
-  if (qwikevents) {
-    if (Array.isArray(qwikevents)) {
-      processEventOrNode(...qwikevents);
-    } else {
-      processEventOrNode("click", "input");
-    }
-  }
-  win.qwikevents = {
-    events,
-    roots,
-    push: processEventOrNode
-  };
-  addEventListener(doc, "readystatechange", processReadyStateChange);
-  processReadyStateChange();
+var findShadowRoots = (fragment) => {
+	addEventOrRoot(fragment);
+	const shadowRoots = nativeQuerySelectorAll(fragment, "[q\\:shadowroot]");
+	for (let i = 0; i < shadowRoots.length; i++) {
+		const shadowRoot = shadowRoots[i].shadowRoot;
+		shadowRoot && findShadowRoots(shadowRoot);
+	}
+};
+var isPromise = (promise) => promise && typeof promise.then === "function";
+var runTasks = async (tasks) => {
+	for (let i = 0; i < tasks.length; i++) await tasks[i]();
+};
+var queueTasks = (tasks) => {
+	if (tasks.length) {
+		const run = () => runTasks(tasks);
+		queuedTasks = queuedTasks ? queuedTasks.then(run, run) : run();
+	}
+};
+var resolveContainer = (containerEl) => {
+	if (containerEl._qwikjson_ === void 0) {
+		let script = (containerEl === doc.documentElement ? doc.body : containerEl).lastElementChild;
+		while (script) {
+			if (script.tagName === "SCRIPT" && script.getAttribute("type") === "qwik/json") {
+				containerEl._qwikjson_ = JSON.parse(script.textContent.replace(/\\x3C(\/?script)/gi, "<$1"));
+				break;
+			}
+			script = script.previousElementSibling;
+		}
+	}
+};
+var markContainerReady = (hash) => {
+	readyContainers[hash] = 1;
+	emitEvent(readyStateChange);
+};
+var waitForContainerReady = (container) => {
+	const hash = container.getAttribute("q:instance");
+	return container.getAttribute("q:container") === "paused" && doc.readyState === "loading" && !readyContainers[hash] && new Promise((resolve) => {
+		const ready = () => {
+			if (doc.readyState !== "loading" || readyContainers[hash]) resolve();
+		};
+		addEventListener(doc, readyStateChange, ready);
+	});
+};
+var createEvent = (eventName, detail) => new CustomEvent(eventName, { detail });
+var emitEvent = (eventName, detail) => {
+	doc.dispatchEvent(createEvent(eventName, detail));
+};
+var camelToKebab = (str) => str.replace(/([A-Z-])/g, (a) => "-" + a.toLowerCase());
+var kebabToCamel = (eventName) => eventName.replace(/-./g, (a) => a[1].toUpperCase());
+var parseKebabEvent = (event) => {
+	const separatorIndex = event.indexOf(":");
+	return {
+		scope: event.slice(0, separatorIndex),
+		eventName: kebabToCamel(event.slice(separatorIndex + 1))
+	};
+};
+var isPassiveScope = (scope) => scope.length === 2;
+var getRootScope = (scope) => scope.charAt(0);
+var isElementNode = (node) => !!node && node.nodeType === 1;
+var isCaptureHandlerElement = (element, scopedKebabName, captureAttribute) => element.hasAttribute(captureAttribute) && (!!element._qDispatch?.[scopedKebabName] || element.hasAttribute("q-" + scopedKebabName));
+var resolveHandler = (container, element, qBase, base, chunk, symbol, reqTime, reportSyncError = true) => {
+	const eventData = {
+		qBase,
+		symbol,
+		element,
+		reqTime
+	};
+	if (!chunk) {
+		const handler = (doc["qFuncs_" + container.getAttribute("q:instance")] || [])[+symbol];
+		if (!handler && reportSyncError) {
+			const error = /* @__PURE__ */ new Error("sym:" + symbol);
+			emitEvent("qerror", {
+				importError: "sync",
+				error,
+				...eventData
+			});
+			console.error(error);
+		}
+		return handler;
+	}
+	const key = `${symbol}|${qBase}|${chunk}`;
+	const handler = symbols.get(key);
+	if (handler) return handler;
+	const href = new URL(chunk, base).href;
+	const module = import(
+		/* @vite-ignore */
+		href
+);
+	resolveContainer(container);
+	return module.then((module) => {
+		const handler = module[symbol];
+		if (!handler) {
+			const error = /* @__PURE__ */ new Error(`${symbol} not in ${href}`);
+			emitEvent("qerror", {
+				importError: "no-symbol",
+				error,
+				...eventData
+			});
+			console.error(error);
+		} else {
+			symbols.set(key, handler);
+			emitEvent("qsymbol", eventData);
+		}
+		return handler;
+	}, (error) => {
+		emitEvent("qerror", {
+			importError: "async",
+			error,
+			...eventData
+		});
+		console.error(error);
+	});
+};
+/**
+* Dispatch an event by invoking QRL handlers. If there are multiple handlers, they are awaited in
+* order.
+*/
+var dispatch = (element, ev, scopedKebabName, tasks, kebabName, allowPreventDefault = true) => {
+	let defer = false;
+	if (kebabName) {
+		if (allowPreventDefault && element.hasAttribute("preventdefault:" + kebabName)) ev.preventDefault();
+		if (element.hasAttribute("stoppropagation:" + kebabName)) ev.stopPropagation();
+	}
+	const handlers = element._qDispatch?.[scopedKebabName];
+	if (handlers) {
+		if (typeof handlers === "function") {
+			const run = () => handlers(ev, element);
+			if (defer) tasks.push(async () => {
+				const result = run();
+				if (isPromise(result)) await result;
+			});
+			else {
+				const result = run();
+				if (isPromise(result)) {
+					defer = true;
+					tasks.push(() => result);
+				}
+			}
+		} else if (handlers.length) for (let i = 0; i < handlers.length; i++) {
+			const handler = handlers[i];
+			if (handler) {
+				const run = () => handler(ev, element);
+				if (defer) tasks.push(async () => {
+					const result = run();
+					if (isPromise(result)) await result;
+				});
+				else {
+					const result = run();
+					if (isPromise(result)) {
+						defer = true;
+						tasks.push(() => result);
+					}
+				}
+			}
+		}
+		return;
+	}
+	const attrValue = element.getAttribute("q-" + scopedKebabName);
+	if (attrValue) {
+		const container = element.closest("[q\\:container]:not([q\\:container=html]):not([q\\:container=text])");
+		const qBase = container.getAttribute("q:base");
+		const base = new URL(qBase, doc.baseURI);
+		const qrls = attrValue.split("|");
+		const waitForReady = waitForContainerReady(container);
+		for (let i = 0; i < qrls.length; i++) {
+			const qrl = qrls[i];
+			const reqTime = performance.now();
+			const [chunk, symbol, capturedIds] = qrl.split("#");
+			const run = (handler) => {
+				if (handler && element.isConnected) {
+					const onError = (error) => {
+						emitEvent("qerror", {
+							error,
+							qBase,
+							symbol,
+							element,
+							reqTime
+						});
+					};
+					try {
+						const result = handler.call(capturedIds, ev, element);
+						if (isPromise(result)) return result.catch(onError);
+					} catch (error) {
+						return onError(error);
+					}
+				}
+			};
+			const resolve = (reportSyncError = true) => resolveHandler(container, element, qBase, base, chunk, symbol, reqTime, reportSyncError);
+			const handler = waitForReady ? void 0 : resolve();
+			if (waitForReady) {
+				defer = true;
+				tasks.push(async () => {
+					await waitForReady;
+					await run(await resolve(false) || await resolve());
+				});
+			} else if (isPromise(handler)) {
+				defer = true;
+				tasks.push(() => handler.then(run));
+			} else if (defer) {
+				defer = true;
+				tasks.push(async () => {
+					await run(handler || await resolve());
+				});
+			} else {
+				const result = run(handler);
+				if (isPromise(result)) {
+					defer = true;
+					tasks.push(() => result);
+				}
+			}
+		}
+	}
+};
+/**
+* Event handler responsible for processing element events.
+*
+* If browser emits an event, the `eventProcessor` walks the DOM tree looking for corresponding
+* `(${event.type})`. If found the event's URL is parsed and `import()`ed.
+*
+* @param ev - Browser event.
+*/
+var processElementEvent = (ev, scope = elementPrefix, allowPreventDefault = true) => {
+	const kebabName = camelToKebab(ev.type);
+	const scopedKebabName = scope + ":" + kebabName;
+	const captureAttribute = capturePrefix + kebabName;
+	const elements = [];
+	const captureHandlers = [];
+	const tasks = [];
+	let current = ev.target;
+	while (current) if (isElementNode(current)) {
+		elements.push(current);
+		captureHandlers.push(isCaptureHandlerElement(current, scopedKebabName, captureAttribute));
+		current = current.parentElement;
+	} else current = current.parentElement;
+	for (let i = elements.length - 1; i >= 0; i--) if (captureHandlers[i]) {
+		dispatch(elements[i], ev, scopedKebabName, tasks, kebabName, allowPreventDefault);
+		if (ev.cancelBubble) {
+			queueTasks(tasks);
+			return;
+		}
+	}
+	for (let i = 0; i < elements.length; i++) if (!captureHandlers[i]) {
+		dispatch(elements[i], ev, scopedKebabName, tasks, kebabName, allowPreventDefault);
+		if (!ev.bubbles || ev.cancelBubble) {
+			queueTasks(tasks);
+			return;
+		}
+	}
+	queueTasks(tasks);
+};
+var processPassiveElementEvent = (ev) => processElementEvent(ev, passiveElementPrefix, false);
+var broadcast = (scope, ev, allowPreventDefault = true) => {
+	const kebabName = camelToKebab(ev.type);
+	const scopedKebabName = scope + ":" + kebabName;
+	const elements = querySelectorAll("[q-" + CSS.escape(scopedKebabName) + "]");
+	const tasks = [];
+	for (let i = 0; i < elements.length; i++) {
+		const el = elements[i];
+		dispatch(el, ev, scopedKebabName, tasks, kebabName, allowPreventDefault);
+	}
+	queueTasks(tasks);
+};
+/**
+* Event handler responsible for processing browser events.
+*
+* If browser emits an event, the `eventProcessor` walks the DOM tree looking for corresponding
+* `(${event.type})`. If found the event's URL is parsed and `import()`ed.
+*
+* @param ev - Browser event.
+*/
+var processDocumentEvent = (ev) => {
+	broadcast(documentPrefix, ev);
+};
+var processPassiveDocumentEvent = (ev) => {
+	broadcast(passiveDocumentPrefix, ev, false);
+};
+var processWindowEvent = (ev) => {
+	broadcast(windowPrefix, ev);
+};
+var processPassiveWindowEvent = (ev) => {
+	broadcast(passiveWindowPrefix, ev, false);
+};
+/**
+* Called when the document is ready and whenever a container is added, so make this idempotent. For
+* qidle and qinit we remove the attributes immediately, and for qvisible we add an attribute
+*/
+var processReadyStateChange = () => {
+	const readyState = doc.readyState;
+	if (readyState == "interactive" || readyState == "complete") {
+		hasInitialized = 1;
+		roots.forEach(findShadowRoots);
+		if (events.has("d:qinit")) {
+			events.delete("d:qinit");
+			const ev = createEvent("qinit");
+			const elements = querySelectorAll("[q-d\\:qinit]");
+			const tasks = [];
+			for (let i = 0; i < elements.length; i++) {
+				const el = elements[i];
+				dispatch(el, ev, "d:qinit", tasks);
+				el.removeAttribute("q-d:qinit");
+			}
+			queueTasks(tasks);
+		}
+		if (events.has("d:qidle")) {
+			events.delete("d:qidle");
+			(win.requestIdleCallback ?? win.setTimeout).bind(win)(() => {
+				const ev = createEvent("qidle");
+				const elements = querySelectorAll("[q-d\\:qidle]");
+				const tasks = [];
+				for (let i = 0; i < elements.length; i++) {
+					const el = elements[i];
+					dispatch(el, ev, "d:qidle", tasks);
+					el.removeAttribute("q-d:qidle");
+				}
+				queueTasks(tasks);
+			});
+		}
+		if (events.has("e:qvisible")) {
+			observer || (observer = new IntersectionObserver((entries) => {
+				const tasks = [];
+				for (let i = 0; i < entries.length; i++) {
+					const entry = entries[i];
+					if (entry.isIntersecting) {
+						observer.unobserve(entry.target);
+						dispatch(entry.target, createEvent("qvisible", entry), "e:qvisible", tasks);
+					}
+				}
+				queueTasks(tasks);
+			}));
+			const elements = querySelectorAll("[q-e\\:qvisible]:not([q\\:observed])");
+			for (let i = 0; i < elements.length; i++) {
+				const el = elements[i];
+				observer.observe(el);
+				el.setAttribute("q:observed", "true");
+			}
+		}
+	}
+};
+var addEventOrRoot = (...eventNames) => {
+	for (let i = 0; i < eventNames.length; i++) {
+		const eventNameOrRoot = eventNames[i];
+		if (eventNameOrRoot === QwikEvContainerReady) markContainerReady(eventNames[++i]);
+		else if (typeof eventNameOrRoot === "string") {
+			if (!events.has(eventNameOrRoot)) {
+				events.add(eventNameOrRoot);
+				const { scope, eventName } = parseKebabEvent(eventNameOrRoot);
+				const passive = isPassiveScope(scope);
+				const rootScope = getRootScope(scope);
+				if (rootScope === windowPrefix) addEventListener(win, eventName, passive ? processPassiveWindowEvent : processWindowEvent, true, passive);
+				else roots.forEach((root) => addEventListener(root, eventName, rootScope === documentPrefix ? passive ? processPassiveDocumentEvent : processDocumentEvent : passive ? processPassiveElementEvent : processElementEvent, true, passive));
+				if (hasInitialized === 1 && (eventNameOrRoot === "e:qvisible" || eventNameOrRoot === "d:qinit" || eventNameOrRoot === "d:qidle")) processReadyStateChange();
+			}
+		} else if (!roots.has(eventNameOrRoot)) {
+			events.forEach((kebabEventName) => {
+				const { scope, eventName } = parseKebabEvent(kebabEventName);
+				const passive = isPassiveScope(scope);
+				const rootScope = getRootScope(scope);
+				if (rootScope !== windowPrefix) addEventListener(eventNameOrRoot, eventName, rootScope === documentPrefix ? passive ? processPassiveDocumentEvent : processDocumentEvent : passive ? processPassiveElementEvent : processElementEvent, true, passive);
+			});
+			roots.add(eventNameOrRoot);
+		}
+	}
+};
+var _qwikEv = win._qwikEv;
+if (!_qwikEv?.roots) {
+	if (Array.isArray(_qwikEv)) addEventOrRoot(..._qwikEv);
+	else addEventOrRoot("e:click", "e:input");
+	win._qwikEv = {
+		events,
+		roots,
+		push: addEventOrRoot
+	};
+	addEventListener(doc, readyStateChange, processReadyStateChange);
+	processReadyStateChange();
 }
+//#endregion