marko 6.3.56 → 6.4.0

package/cheatsheet.md

@@ -88,7 +88,7 @@ import { getUser } from "../data.js";
 </try>
 ```
 
-`@placeholder`/`@catch` go on `<try>`, never on `<await>`. On the server this streams (placeholder flushes first, content follows). It works in the browser too: hand `<await>` a new promise (e.g. a `<const>` derived from state) and it shows the placeholder again, then the new result. `@catch` can't recover in place: redirect (a `<script>` setting `location`), or re-render the `<try>` by bumping a key on a wrapping `<for>`.
+`@placeholder`/`@catch` go on `<try>`, never on `<await>`, written directly inside it: once each, with only content, never inside `<if>`/`<for>`. A `<try>` needs at least one. On the server this streams (placeholder flushes first, content follows). It works in the browser too: hand `<await>` a new promise (e.g. a `<const>` derived from state) and it shows the placeholder again, then the new result. `@catch` can't recover in place: redirect (a `<script>` setting `location`), or re-render the `<try>` by bumping a key on a wrapping `<for>`.
 
 Don't fetch while rendering: start data loads early, pass the promise through the template, and `<await>` it where the data is rendered. Fetching inside each component that renders the data serializes the requests (waterfalls). Under @marko/run, load in the route handler (`return next({ user: getUser() })`, no await) and render with `<await|user|=$global.data.user>`.
 
@@ -140,7 +140,7 @@ Don't fetch while rendering: start data loads early, pass the promise through th
 
 - Read request-scoped `$global` from any template, no threading: `${$global.messages.title}`. Otherwise pass data down through `input`.
 - Populate at the render call: `template.render({ $global: { messages } })`. Under @marko/run a middleware's `return next({ messages })` merges into `$global.data`.
-- `$global` is not serialized to the client by default. Mark any key the browser itself evaluates, e.g. an event handler, a `<script>`, markup the browser (re)creates, or a `<const>` that recomputes from state: `$global.serializedGlobals = { messages: true }` at the render call (under @marko/run, `context.serializedGlobals.data = true`; it ships `params`/`url` already). What the server already rendered needs no opt-in; a debug build logs an unserialized key read in the browser.
+- `$global` is not serialized to the client by default. Mark any key the browser itself evaluates, e.g. an event handler, a `<script>`, markup the browser (re)creates, or a `<const>` that recomputes from state: `$global.serializedGlobals = { messages: true }` at the render call (under @marko/run, `context.serializedGlobals.data = true`; it ships `params`/`url` already). A serialized key is embedded in the page, so copy the non-secret field the browser needs into its own key rather than serializing a whole request or session. What the server already rendered needs no opt-in; a debug build logs an unserialized key read in the browser.
 
 ## Client-side effects
 

package/dist/common/constants/accessor-prefix.d.ts

@@ -13,6 +13,7 @@ export declare const KeyedScopes = "O";
 export declare const Lifecycle = "K";
 export declare const Promise = "L";
 export declare const TagVariableChange = "M";
+export declare const TryBranch = "Q";
 type Self = typeof import("./accessor-prefix");
 export type Value = Self[keyof Self];
 export {};

package/dist/common/constants/accessor-prefix.debug.d.ts

@@ -13,6 +13,7 @@ export declare const KeyedScopes = "KeyedScopes:";
 export declare const Lifecycle = "Lifecycle:";
 export declare const Promise = "Promise:";
 export declare const TagVariableChange = "TagVariableChange:";
+export declare const TryBranch = "TryBranch:";
 type Self = typeof import("./accessor-prefix.debug");
 export type Value = Self[keyof Self];
 export {};

package/dist/common/constants/accessor-prop.d.ts

@@ -17,15 +17,18 @@ export declare const LoopKey = "M";
 export declare const LoopIndex = "I";
 export declare const ParentBranch = "N";
 export declare const PendingEffects = "J";
+export declare const PendingEffectScopes = "JS";
 export declare const PendingRenders = "W";
 export declare const PendingScopes = "Y";
 export declare const PlaceholderBranch = "P";
 export declare const PlaceholderContent = "Q";
 export declare const Renderer = "R";
+export declare const ReturnValue = "RV";
 export declare const StartNode = "S";
 export declare const Subscriptions = "Z";
 export declare const TagVariable = "T";
 export declare const TagVariableChange = "U";
+export declare const TryBranch = "PT";
 type Self = typeof import("./accessor-prop");
 export type Value = Self[keyof Self];
 export {};

package/dist/common/constants/accessor-prop.debug.d.ts

@@ -17,15 +17,18 @@ export declare const LoopKey = "#LoopKey";
 export declare const LoopIndex = "#LoopIndex";
 export declare const ParentBranch = "#ParentBranch";
 export declare const PendingEffects = "#PendingEffects";
+export declare const PendingEffectScopes = "#PendingEffectScopes";
 export declare const PendingRenders = "#PendingRenders";
 export declare const PendingScopes = "#PendingScopes";
 export declare const PlaceholderBranch = "#PlaceholderBranch";
 export declare const PlaceholderContent = "#PlaceholderContent";
 export declare const Renderer = "#Renderer";
+export declare const ReturnValue = "#ReturnValue";
 export declare const StartNode = "#StartNode";
 export declare const Subscriptions = "#Subscriptions";
 export declare const TagVariable = "#TagVariable";
 export declare const TagVariableChange = "#TagVariableChange";
+export declare const TryBranch = "#TryBranch";
 type Self = typeof import("./accessor-prop.debug");
 export type Value = Self[keyof Self];
 export {};

package/dist/common/types.d.ts

@@ -1,5 +1,6 @@
 import type { PendingRender } from "../dom/queue";
 import type { Renderer as ClientRenderer, Renderer } from "../dom/renderer";
+import type { SignalFn } from "../dom/signals";
 import type { AccessorProp } from "./accessor.debug";
 import * as ControlledType from "./constants/controlled-type";
 import * as NodeType from "./constants/node-type";
@@ -15,8 +16,9 @@ export interface BranchScope extends Scope {
     [AccessorProp.BranchScopes]: Set<BranchScope> | undefined;
     [AccessorProp.Renderer]: ClientRenderer | string;
     [AccessorProp.AwaitCounter]: AwaitCounter | undefined;
-    [AccessorProp.PendingEffects]: unknown[] | undefined;
+    [AccessorProp.PendingEffectScopes]: Scope[] | null | undefined;
     [AccessorProp.PlaceholderBranch]: BranchScope | undefined | 0;
+    [AccessorProp.TryBranch]: BranchScope | undefined;
     [AccessorProp.PendingRenders]: PendingRender[] | 0 | undefined;
     [AccessorProp.DetachedAwait]: Renderer | 0 | undefined;
     [AccessorProp.PendingScopes]: Scope[] | void;
@@ -26,9 +28,13 @@ export interface Scope {
     [AccessorProp.Global]: Record<string, unknown>;
     [AccessorProp.Id]: number;
     [AccessorProp.Gen]: number;
-    [AccessorProp.AbortControllers]: Record<string | number, AbortController | void> | undefined;
+    [AccessorProp.AbortControllers]: Record<string | number, {
+        abort(): void;
+        signal?: AbortSignal;
+    } | void> | undefined;
     [AccessorProp.ClosestBranch]: BranchScope | undefined;
     [AccessorProp.ClosestBranchId]: number | undefined;
+    [AccessorProp.PendingEffects]: Set<SignalFn> | null | undefined;
     [AccessorProp.Subscriptions]: Set<Scope>[] | undefined;
     [x: `___${string}`]: never;
     [x: string | number]: any;

package/dist/debug/dom/catch.feat.js

@@ -1,24 +1,22 @@
 "use strict";
-const require_control_flow = require("../dom-DcwejnYg.js");
+const require_control_flow = require("../dom-BRO5aArp.js");
 //#region src/dom/catch.feat.ts
 const handlePendingTry = (fn, scope, branch) => {
 	while (branch) {
-		if (branch["#AwaitCounter"]?.i) return (branch[require_control_flow.PendingEffects] ||= []).push(fn, scope);
+		if (branch["#AwaitCounter"]?.i) return (scope[require_control_flow.PendingEffects] ||= ((branch[require_control_flow.PendingEffectScopes] ||= (branch["#AwaitCounter"].m && ((complete) => branch["#AwaitCounter"].c = () => complete() || require_control_flow.queueAsyncRender(branch, require_control_flow.queueEffect, require_control_flow.runPendingEffects))(branch["#AwaitCounter"].c), [])).push(scope), /* @__PURE__ */ new Set())).add(fn);
 		branch = branch[require_control_flow.ParentBranch];
 	}
 };
-require_control_flow.installCatch((runEffects) => (effects, checkPending = require_control_flow.placeholderShown.has(effects)) => {
-	if (checkPending || require_control_flow.caughtError.has(effects)) {
-		let i = 0;
-		let fn;
-		let scope;
-		let branch;
-		for (; i < effects.length;) {
-			fn = effects[i++];
-			scope = effects[i++];
-			if ((branch = scope["#ClosestBranch"])?.["#Gen"] !== 0 && !(checkPending && handlePendingTry(fn, scope, branch))) fn(scope);
-		}
-	} else runEffects(effects);
+require_control_flow.installCatch((effects) => {
+	let i = 0;
+	let fn;
+	let scope;
+	let branch;
+	for (; i < effects.length;) {
+		fn = effects[i++];
+		scope = effects[i++];
+		if ((branch = scope["#ClosestBranch"])?.["#Gen"] !== 0 && !handlePendingTry(fn, scope, branch)) fn(scope);
+	}
 }, (runRender) => (render) => {
 	try {
 		let branch = render[require_control_flow.Scope][require_control_flow.ClosestBranch];

package/dist/debug/dom/catch.feat.mjs

@@ -1,23 +1,21 @@
-import { Dn as Scope, En as Pending, Fn as PendingEffects, In as PendingRenders, Pn as ParentBranch, an as installCatch, in as caughtError, kn as ClosestBranch, on as placeholderShown, y as renderCatch } from "../dom-BeCNT5R5.mjs";
+import { Dn as Scope, En as Pending, Fn as PendingEffectScopes, In as PendingEffects, Ln as PendingRenders, Pn as ParentBranch, an as installCatch, b as runPendingEffects, cn as queueEffect, kn as ClosestBranch, sn as queueAsyncRender, y as renderCatch } from "../dom-Btj2QJhk.mjs";
 //#region src/dom/catch.feat.ts
 const handlePendingTry = (fn, scope, branch) => {
 	while (branch) {
-		if (branch["#AwaitCounter"]?.i) return (branch[PendingEffects] ||= []).push(fn, scope);
+		if (branch["#AwaitCounter"]?.i) return (scope[PendingEffects] ||= ((branch[PendingEffectScopes] ||= (branch["#AwaitCounter"].m && ((complete) => branch["#AwaitCounter"].c = () => complete() || queueAsyncRender(branch, queueEffect, runPendingEffects))(branch["#AwaitCounter"].c), [])).push(scope), /* @__PURE__ */ new Set())).add(fn);
 		branch = branch[ParentBranch];
 	}
 };
-installCatch((runEffects) => (effects, checkPending = placeholderShown.has(effects)) => {
-	if (checkPending || caughtError.has(effects)) {
-		let i = 0;
-		let fn;
-		let scope;
-		let branch;
-		for (; i < effects.length;) {
-			fn = effects[i++];
-			scope = effects[i++];
-			if ((branch = scope["#ClosestBranch"])?.["#Gen"] !== 0 && !(checkPending && handlePendingTry(fn, scope, branch))) fn(scope);
-		}
-	} else runEffects(effects);
+installCatch((effects) => {
+	let i = 0;
+	let fn;
+	let scope;
+	let branch;
+	for (; i < effects.length;) {
+		fn = effects[i++];
+		scope = effects[i++];
+		if ((branch = scope["#ClosestBranch"])?.["#Gen"] !== 0 && !handlePendingTry(fn, scope, branch)) fn(scope);
+	}
 }, (runRender) => (render) => {
 	try {
 		let branch = render[Scope][ClosestBranch];

package/dist/debug/dom/controllable-input.feat.js

@@ -1,5 +1,5 @@
 "use strict";
-const require_control_flow = require("../dom-DcwejnYg.js");
+const require_control_flow = require("../dom-BRO5aArp.js");
 //#region src/dom/controllable-input.feat.ts
 require_control_flow.controllableScripts[0] = require_control_flow._attr_input_checked_script;
 require_control_flow.controllableScripts[1] = require_control_flow._attr_input_checkedValue_script;

package/dist/debug/dom/controllable-input.feat.mjs

@@ -1,4 +1,4 @@
-import { E as _attr_input_checkedValue_script, H as controllableScripts, N as _attr_input_value_script, O as _attr_input_checked_script } from "../dom-BeCNT5R5.mjs";
+import { D as _attr_input_checkedValue_script, P as _attr_input_value_script, U as controllableScripts, k as _attr_input_checked_script } from "../dom-Btj2QJhk.mjs";
 //#region src/dom/controllable-input.feat.ts
 controllableScripts[0] = _attr_input_checked_script;
 controllableScripts[1] = _attr_input_checkedValue_script;

package/dist/debug/dom/controllable-open.feat.js

@@ -1,5 +1,5 @@
 "use strict";
-const require_control_flow = require("../dom-DcwejnYg.js");
+const require_control_flow = require("../dom-BRO5aArp.js");
 //#region src/dom/controllable-open.feat.ts
 require_control_flow.controllableScripts[4] = require_control_flow._attr_details_or_dialog_open_script;
 //#endregion

package/dist/debug/dom/controllable-open.feat.mjs

@@ -1,4 +1,4 @@
-import { H as controllableScripts, S as _attr_details_or_dialog_open_script } from "../dom-BeCNT5R5.mjs";
+import { C as _attr_details_or_dialog_open_script, U as controllableScripts } from "../dom-Btj2QJhk.mjs";
 //#region src/dom/controllable-open.feat.ts
 controllableScripts[4] = _attr_details_or_dialog_open_script;
 //#endregion

package/dist/debug/dom/controllable-select.feat.js

@@ -1,5 +1,5 @@
 "use strict";
-const require_control_flow = require("../dom-DcwejnYg.js");
+const require_control_flow = require("../dom-BRO5aArp.js");
 //#region src/dom/controllable-select.feat.ts
 require_control_flow.controllableScripts[3] = require_control_flow._attr_select_value_script;
 //#endregion

package/dist/debug/dom/controllable-select.feat.mjs

@@ -1,4 +1,4 @@
-import { H as controllableScripts, I as _attr_select_value_script } from "../dom-BeCNT5R5.mjs";
+import { L as _attr_select_value_script, U as controllableScripts } from "../dom-Btj2QJhk.mjs";
 //#region src/dom/controllable-select.feat.ts
 controllableScripts[3] = _attr_select_value_script;
 //#endregion

package/dist/debug/dom/controllable-textarea.feat.js

@@ -1,5 +1,5 @@
 "use strict";
-const require_control_flow = require("../dom-DcwejnYg.js");
+const require_control_flow = require("../dom-BRO5aArp.js");
 //#region src/dom/controllable-textarea.feat.ts
 require_control_flow.controllableScripts[2] = require_control_flow._attr_input_value_script;
 //#endregion

package/dist/debug/dom/controllable-textarea.feat.mjs

@@ -1,4 +1,4 @@
-import { H as controllableScripts, N as _attr_input_value_script } from "../dom-BeCNT5R5.mjs";
+import { P as _attr_input_value_script, U as controllableScripts } from "../dom-Btj2QJhk.mjs";
 //#region src/dom/controllable-textarea.feat.ts
 controllableScripts[2] = _attr_input_value_script;
 //#endregion

package/dist/debug/dom/controllable.feat.js

@@ -1,5 +1,5 @@
 "use strict";
-const require_control_flow = require("../dom-DcwejnYg.js");
+const require_control_flow = require("../dom-BRO5aArp.js");
 require("./controllable-input.feat.js");
 require("./controllable-open.feat.js");
 require("./controllable-select.feat.js");

package/dist/debug/dom/controllable.feat.mjs

@@ -1,4 +1,4 @@
-import { B as _controllable_textarea, L as _controllable_input, R as _controllable_open, V as controllableRenders, z as _controllable_select } from "../dom-BeCNT5R5.mjs";
+import { B as _controllable_select, H as controllableRenders, R as _controllable_input, V as _controllable_textarea, z as _controllable_open } from "../dom-Btj2QJhk.mjs";
 import "./controllable-input.feat.mjs";
 import "./controllable-open.feat.mjs";
 import "./controllable-select.feat.mjs";

package/dist/debug/dom/dynamic-tag-script.feat.js

@@ -1,5 +1,5 @@
 "use strict";
-const require_control_flow = require("../dom-DcwejnYg.js");
+const require_control_flow = require("../dom-BRO5aArp.js");
 //#region src/dom/dynamic-tag-script.feat.ts
 require_control_flow._resumed[require_control_flow.DYNAMIC_TAG_SCRIPT_REGISTER_ID] = require_control_flow.withBranches(require_control_flow.dynamicTagScript);
 //#endregion

package/dist/debug/dom/dynamic-tag-script.feat.mjs

@@ -1,4 +1,4 @@
-import { $t as DYNAMIC_TAG_SCRIPT_REGISTER_ID, bt as _resumed, g as dynamicTagScript, xn as withBranches } from "../dom-BeCNT5R5.mjs";
+import { en as DYNAMIC_TAG_SCRIPT_REGISTER_ID, g as dynamicTagScript, xn as withBranches, xt as _resumed } from "../dom-Btj2QJhk.mjs";
 //#region src/dom/dynamic-tag-script.feat.ts
 _resumed[DYNAMIC_TAG_SCRIPT_REGISTER_ID] = withBranches(dynamicTagScript);
 //#endregion

package/dist/debug/dom/dynamic-tag-var.feat.js

@@ -1,5 +1,5 @@
 "use strict";
-const require_control_flow = require("../dom-DcwejnYg.js");
+const require_control_flow = require("../dom-BRO5aArp.js");
 //#region src/dom/dynamic-tag-var.feat.ts
 require_control_flow.installDynamicTagVar((branch) => branch[require_control_flow.TagVariable](() => require_control_flow._el_read(branch[require_control_flow.StartNode])));
 //#endregion

package/dist/debug/dom/dynamic-tag-var.feat.mjs

@@ -1,4 +1,4 @@
-import { Mt as _el_read, Rn as StartNode, _ as installDynamicTagVar, zn as TagVariable } from "../dom-BeCNT5R5.mjs";
+import { Bn as TagVariable, Nt as _el_read, _ as installDynamicTagVar, zn as StartNode } from "../dom-Btj2QJhk.mjs";
 //#region src/dom/dynamic-tag-var.feat.ts
 installDynamicTagVar((branch) => branch[TagVariable](() => _el_read(branch[StartNode])));
 //#endregion

package/dist/debug/dom/lazy.feat.js

@@ -0,0 +1,4 @@
+"use strict";
+//#region src/dom/lazy.feat.ts
+require("../dom-BRO5aArp.js").withLazy();
+//#endregion

package/dist/debug/dom/lazy.feat.mjs

@@ -0,0 +1,4 @@
+import { Ot as withLazy } from "../dom-Btj2QJhk.mjs";
+//#region src/dom/lazy.feat.ts
+withLazy();
+//#endregion

package/dist/debug/dom/placeholder.feat.js

@@ -1,5 +1,5 @@
 "use strict";
-const require_control_flow = require("../dom-DcwejnYg.js");
+const require_control_flow = require("../dom-BRO5aArp.js");
 //#region src/dom/placeholder.feat.ts
 require_control_flow._resumed[require_control_flow.PLACEHOLDER_DISMISS_REGISTER_ID] = (tryBranch) => {
 	if (tryBranch["#PlaceholderBranch"]) {

package/dist/debug/dom/placeholder.feat.mjs

@@ -1,4 +1,4 @@
-import { Ln as PlaceholderBranch, Yt as destroyBranch, bt as _resumed, en as PLACEHOLDER_DISMISS_REGISTER_ID } from "../dom-BeCNT5R5.mjs";
+import { Rn as PlaceholderBranch, Xt as destroyBranch, tn as PLACEHOLDER_DISMISS_REGISTER_ID, xt as _resumed } from "../dom-Btj2QJhk.mjs";
 //#region src/dom/placeholder.feat.ts
 _resumed[PLACEHOLDER_DISMISS_REGISTER_ID] = (tryBranch) => {
 	if (tryBranch["#PlaceholderBranch"]) {