@poveste/app 0.14.0 → 0.16.0

package/dist/bundled/util/dark.js

@@ -4,7 +4,7 @@ import { watch } from "@poveste/vendors/vue";
 //#region src/app/util/dark.ts
 var isDark = useDark({
 	valueDark: "ptw-dark",
-	initialValue: povesteConfig.theme.defaultColorScheme,
+	...povesteConfig.theme.defaultColorScheme ? { initialValue: povesteConfig.theme.defaultColorScheme } : {},
 	storageKey: "poveste-color-scheme",
 	storage: povesteConfig.theme.storeColorScheme ? localStorage : sessionStorage
 });

package/dist/bundled/util/events.js

@@ -19,7 +19,7 @@ async function logEvent(name, argument) {
 }
 function stringifyEvent(e) {
 	const obj = {};
-	for (const k in e) obj[k] = e[k];
+	for (const k in e) obj[k] = Reflect.get(e, k);
 	return JSON.stringify(obj, (k, v) => {
 		if (v instanceof Node) return "Node";
 		if (v instanceof Window) return "Window";

package/dist/bundled/util/grid-slots.js

@@ -57,7 +57,7 @@ function trimSlots(slots) {
 		next = kept;
 	}
 	let end = next.length;
-	while (end > 0 && !next[end - 1].visible) end--;
+	while (end > 0 && !next[end - 1]?.visible) end--;
 	return end === next.length ? next : next.slice(0, end);
 }
 //#endregion

package/dist/bundled/util/icons.generated.js

@@ -6,11 +6,13 @@ var iconCollections = [
 			"add-alt": { "body": "<path fill=\"currentColor\" d=\"M16 4c6.6 0 12 5.4 12 12s-5.4 12-12 12S4 22.6 4 16S9.4 4 16 4m0-2C8.3 2 2 8.3 2 16s6.3 14 14 14s14-6.3 14-14S23.7 2 16 2\"/><path fill=\"currentColor\" d=\"M24 15h-7V8h-2v7H8v2h7v7h2v-7h7z\"/>" },
 			"area": { "body": "<path fill=\"currentColor\" d=\"M27 22.142V9.858A3.992 3.992 0 1 0 22.142 5H9.858A3.992 3.992 0 1 0 5 9.858v12.284A3.992 3.992 0 1 0 9.858 27h12.284A3.992 3.992 0 1 0 27 22.142M26 4a2 2 0 1 1-2 2a2 2 0 0 1 2-2M4 6a2 2 0 1 1 2 2a2 2 0 0 1-2-2m2 22a2 2 0 1 1 2-2a2 2 0 0 1-2 2m16.142-3H9.858A4 4 0 0 0 7 22.142V9.858A4 4 0 0 0 9.858 7h12.284A4 4 0 0 0 25 9.858v12.284A3.99 3.99 0 0 0 22.142 25M26 28a2 2 0 1 1 2-2a2.003 2.003 0 0 1-2 2\"/>" },
 			"audio-console": { "body": "<path fill=\"currentColor\" d=\"M28 14.005h-1v-12h-2v12h-1a2 2 0 0 0-2 2v2a2 2 0 0 0 2 2h1v10h2v-10h1a2.003 2.003 0 0 0 2-2v-2a2 2 0 0 0-2-2m0 4h-4v-2h4Zm-10-12h-1v-4h-2v4h-1a2 2 0 0 0-2 2v2a2 2 0 0 0 2 2h1v18h2v-18h1a2 2 0 0 0 2-2v-2a2 2 0 0 0-2-2m0 4h-4v-2h4Zm-10 10H7v-18H5v18H4a2 2 0 0 0-2 2v2a2 2 0 0 0 2 2h1v4h2v-4h1a2 2 0 0 0 2-2v-2a2 2 0 0 0-2-2m0 4H4v-2h4Z\"/>" },
+			"calendar": { "body": "<path fill=\"currentColor\" d=\"M26 4h-4V2h-2v2h-8V2h-2v2H6c-1.1 0-2 .9-2 2v20c0 1.1.9 2 2 2h20c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2m0 22H6V12h20zm0-16H6V6h4v2h2V6h8v2h2V6h4z\"/>" },
 			"caret-down": { "body": "<path fill=\"currentColor\" d=\"m24 12l-8 10l-8-10z\"/>" },
 			"caret-right": { "body": "<path fill=\"currentColor\" d=\"m12 8l10 8l-10 8z\"/>" },
 			"checkbox": { "body": "<path fill=\"currentColor\" d=\"M26 4H6a2 2 0 0 0-2 2v20a2 2 0 0 0 2 2h20a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2M6 26V6h20v20Z\"/>" },
 			"checkmark": { "body": "<path fill=\"currentColor\" d=\"m13 24l-9-9l1.414-1.414L13 21.171L26.586 7.586L28 9z\"/>" },
 			"chevron-down": { "body": "<path fill=\"currentColor\" d=\"M16 22L6 12l1.4-1.4l8.6 8.6l8.6-8.6L26 12z\"/>" },
+			"chevron-left": { "body": "<path fill=\"currentColor\" d=\"M10 16L20 6l1.4 1.4l-8.6 8.6l8.6 8.6L20 26z\"/>" },
 			"chevron-right": { "body": "<path fill=\"currentColor\" d=\"M22 16L12 26l-1.4-1.4l8.6-8.6l-8.6-8.6L12 6z\"/>" },
 			"chevron-sort": { "body": "<path fill=\"currentColor\" d=\"m16 28l-7-7l1.41-1.41L16 25.17l5.59-5.58L23 21zm0-24l7 7l-1.41 1.41L16 6.83l-5.59 5.58L9 11z\"/>" },
 			"close": { "body": "<path fill=\"currentColor\" d=\"M17.414 16L24 9.414L22.586 8L16 14.586L9.414 8L8 9.414L14.586 16L8 22.586L9.414 24L16 17.414L22.586 24L24 22.586z\"/>" },
@@ -54,7 +56,7 @@ var iconCollections = [
 			"view-off": { "body": "<path fill=\"currentColor\" d=\"m5.24 22.51l1.43-1.42A14.06 14.06 0 0 1 3.07 16C5.1 10.93 10.7 7 16 7a12.4 12.4 0 0 1 4 .72l1.55-1.56A14.7 14.7 0 0 0 16 5A16.69 16.69 0 0 0 1.06 15.66a1 1 0 0 0 0 .68a16 16 0 0 0 4.18 6.17\"/><path fill=\"currentColor\" d=\"M12 15.73a4 4 0 0 1 3.7-3.7l1.81-1.82a6 6 0 0 0-7.33 7.33Zm18.94-.07a16.4 16.4 0 0 0-5.74-7.44L30 3.41L28.59 2L2 28.59L3.41 30l5.1-5.1A15.3 15.3 0 0 0 16 27a16.69 16.69 0 0 0 14.94-10.66a1 1 0 0 0 0-.68M20 16a4 4 0 0 1-6 3.44L19.44 14a4 4 0 0 1 .56 2m-4 9a13.05 13.05 0 0 1-6-1.58l2.54-2.54a6 6 0 0 0 8.35-8.35l2.87-2.87A14.54 14.54 0 0 1 28.93 16C26.9 21.07 21.3 25 16 25\"/>" },
 			"warning-alt": { "body": "<path fill=\"currentColor\" d=\"M16 23a1.5 1.5 0 1 0 1.5 1.5A1.5 1.5 0 0 0 16 23m-1-11h2v9h-2z\"/><path fill=\"currentColor\" d=\"M29 30H3a1 1 0 0 1-.887-1.461l13-25a1 1 0 0 1 1.774 0l13 25A1 1 0 0 1 29 30M4.65 28h22.7l.001-.003L16.002 6.17h-.004L4.648 27.997Z\"/>" }
 		},
-		"lastModified": 1785496919,
+		"lastModified": 1789034045,
 		"aliases": { "software-resource-resource": { "parent": "software-resource-reference" } },
 		"width": 32,
 		"height": 32
@@ -73,7 +75,7 @@ var iconCollections = [
 				"height": 16
 			}
 		},
-		"lastModified": 1786851660,
+		"lastModified": 1789279072,
 		"width": 20,
 		"height": 20
 	},

package/dist/bundled/util/keyboard.js

@@ -24,30 +24,24 @@ var pressedKeys = /* @__PURE__ */ new Set();
 var trackedWindows = shallowRef([]);
 function bindTracking(target) {
 	const onKeydown = (event) => {
-		for (const i in modifiers) {
-			const mod = modifiers[i];
-			if (mod.key === event.key) {
-				mod.pressed = true;
-				return;
-			}
+		for (const mod of Object.values(modifiers)) if (mod.key === event.key) {
+			mod.pressed = true;
+			return;
 		}
 		pressedKeys.add(event.key.toLocaleLowerCase());
 	};
 	const onKeyup = (event) => {
 		requestAnimationFrame(() => {
 			pressedKeys.clear();
-			for (const i in modifiers) {
-				const mod = modifiers[i];
-				if (mod.key === event.key) {
-					mod.pressed = false;
-					break;
-				}
+			for (const mod of Object.values(modifiers)) if (mod.key === event.key) {
+				mod.pressed = false;
+				break;
 			}
 		});
 	};
 	const onBlur = () => {
 		pressedKeys.clear();
-		for (const i in modifiers) modifiers[i].pressed = false;
+		for (const mod of Object.values(modifiers)) mod.pressed = false;
 	};
 	target.addEventListener("keydown", onKeydown);
 	target.addEventListener("keyup", onKeyup);
@@ -89,7 +83,7 @@ function isMatchingCombination(combination) {
 	const splitted = combination.split("+").map((key) => key.trim());
 	const targetKey = splitted.pop();
 	if (!targetKey) return false;
-	for (const mod in modifiers) if (splitted.includes(mod) !== modifiers[mod].pressed) return false;
+	for (const [name, mod] of Object.entries(modifiers)) if (splitted.includes(name) !== mod.pressed) return false;
 	return pressedKeys.has(targetKey);
 }
 function formatKey(key) {

package/dist/bundled/util/mapping.js

@@ -20,7 +20,7 @@ function mapFile(file, existingFile) {
 			file: markRaw(result),
 			variants: file.story.variants.map((v) => mapVariant(v, existingFile.story.variants.find((item) => item.id === v.id)))
 		};
-		else if (key !== "component") result[key] = file[key];
+		else if (key !== "component") Reflect.set(result, key, Reflect.get(file, key));
 	} else result = {
 		...file,
 		component: markRaw(file.component),
@@ -38,7 +38,7 @@ function mapVariant(variant, existingVariant) {
 	let result;
 	if (existingVariant) {
 		result = existingVariant;
-		for (const key in variant) if (!copiedFromExistingVariant.includes(key)) result[key] = variant[key];
+		for (const key in variant) if (!copiedFromExistingVariant.includes(key)) Reflect.set(result, key, Reflect.get(variant, key));
 	} else result = {
 		...variant,
 		state: reactive({

package/dist/bundled/util/render-tracker.js

@@ -0,0 +1,33 @@
+//#region src/app/util/render-tracker.ts
+/**
+* Whether the render now under way inside a realm reported a throw.
+*
+* The host cannot see inside the realm, so "did this render succeed" has to be
+* read off the two named messages it does see. A throw reaches
+* `app.config.errorHandler` during mount and `SANDBOX_READY` is emitted after
+* `await host.mount()` returns, so the order is always error-then-ready — which
+* makes a ready with nothing recorded since the render began a clean render.
+*
+* Clearing on the story and variant ids changing instead cleared the pair being
+* navigated *to*, so arriving at a broken story wiped its marker, and the fixed
+* story the comment was about was never reached at all: a file edited in place
+* keeps its ids, so that watcher did not fire on the one path it named (#597).
+*/
+function createRenderTracker() {
+	let threw = false;
+	return {
+		/** A new render is starting: what the previous one reported no longer holds. */
+		begin() {
+			threw = false;
+		},
+		threw() {
+			threw = true;
+		},
+		/** True when the render that has just reported ready said nothing before it. */
+		wasClean() {
+			return !threw;
+		}
+	};
+}
+//#endregion
+export { createRenderTracker };

package/dist/bundled/util/scroll.js

@@ -1,17 +1,38 @@
 import { onMounted, watch } from "@poveste/vendors/vue";
-import scrollIntoView from "@poveste/vendors/scroll";
 //#region src/app/util/scroll.ts
+/**
+* The closest ancestor that can actually scroll, or `null` for the viewport.
+*
+* `overlay` is in the test because it is what `overflow: overlay` computes to
+* where it is still supported, and an element scrolling under it would
+* otherwise be measured against the wrong box.
+*/
+function scrollParent(el) {
+	for (let node = el.parentElement; node; node = node.parentElement) {
+		const style = getComputedStyle(node);
+		if (/auto|scroll|overlay/.test(style.overflowY + style.overflowX)) return node;
+	}
+	return null;
+}
+/** Whether the element is already wholly inside the box that would scroll. */
+function isVisibleIn(el, scroller) {
+	const rect = el.getBoundingClientRect();
+	const bounds = scroller?.getBoundingClientRect();
+	const top = bounds?.top ?? 0;
+	const bottom = bounds?.bottom ?? window.innerHeight;
+	return rect.top >= top && rect.bottom <= bottom;
+}
 function useScrollOnActive(active, el) {
 	watch(active, (value) => {
 		if (value) autoScroll();
 	}, { flush: "post" });
 	function autoScroll() {
-		if (el.value) scrollIntoView(el.value, {
-			scrollMode: "if-needed",
+		const target = el.value;
+		if (!target || isVisibleIn(target, scrollParent(target))) return;
+		target.scrollIntoView({
 			block: "center",
 			inline: "nearest",
-			behavior: "smooth",
-			boundary: document.body
+			behavior: "smooth"
 		});
 	}
 	onMounted(() => {

package/dist/bundled/util/state.js

@@ -1,17 +1,48 @@
 import { isRef, unref } from "@poveste/vendors/vue";
-import { clone, omit } from "@poveste/shared";
+import { clone, isMarkedRaw, isPlainObject, omit } from "@poveste/shared";
 //#region src/app/util/state.ts
 var isObject = (val) => val !== null && typeof val === "object";
+/**
+* A value the caller must leave out rather than carry, because it cannot make
+* the trip this copy is being made for.
+*/
+var DROP = Symbol("poveste.drop");
+/**
+* A detached copy of `val`, with refs unwrapped.
+*
+* `clean` means the copy leaves the realm — it is posted to the other side of
+* the sandbox bridge, or stored as a preset — so values that cannot survive
+* that are dropped rather than carried: functions, and anything Vue has marked
+* raw.
+*
+* Marked values are dropped rather than passed through, because `__v_skip` is
+* non-enumerable and does not cross `structuredClone`. Handing one over would
+* strip the mark and hand the far side a plain graph to deep-watch, which is
+* how the first attempt at #957 turned a slow story into a hanging one. A key
+* the sandbox never sends is a key the controls panel does not show, and for
+* the case this aims at — a template ref onto a component's exposed object —
+* that is a control nobody could have used anyway.
+*
+* Without `clean` the copy stays in this realm, so a marked value is carried by
+* reference. That is what the two Vues' bridge wants: an identity both sides
+* share, which `isEquivalent` then settles by `Object.is` instead of walking.
+*/
 function toRawDeep(val, clean = false, seen = /* @__PURE__ */ new WeakMap()) {
+	const value = walk(val, clean, seen);
+	return value === DROP ? {} : value;
+}
+function walk(val, clean, seen) {
 	const unwrappedValue = isRef(val) ? unref(val) : val;
 	if (typeof unwrappedValue === "symbol") return unwrappedValue.toString();
 	if (!isObject(unwrappedValue)) return unwrappedValue;
+	if (isMarkedRaw(unwrappedValue)) return clean ? DROP : unwrappedValue;
 	if (seen.has(unwrappedValue)) return seen.get(unwrappedValue);
+	if (!Array.isArray(unwrappedValue) && !isPlainObject(unwrappedValue)) return notPlain(unwrappedValue, clean, seen);
 	if (Array.isArray(unwrappedValue)) {
 		const result = [];
 		seen.set(unwrappedValue, result);
-		let list = unwrappedValue.map((value) => toRawDeep(value, clean, seen));
-		if (clean) list = list.filter((value) => typeof value !== "function");
+		let list = unwrappedValue.map((value) => walk(value, clean, seen));
+		if (clean) list = list.filter((value) => typeof value !== "function" && value !== DROP);
 		result.push(...list);
 		return result;
 	} else {
@@ -21,10 +52,79 @@ function toRawDeep(val, clean = false, seen = /* @__PURE__ */ new WeakMap()) {
 		return result;
 	}
 }
-function toRawObject(obj, target, clean = false, seen = /* @__PURE__ */ new WeakMap()) {
+/**
+* A value with a prototype of its own — a `Date`, a `Map`, a class instance.
+*
+* These used to fall past every branch into `toRawObject`, whose `Object.keys`
+* is empty for most of them, so they arrived as `{}` with no error and no
+* warning (#977). `postMessage` is structured clone, and structured clone
+* carries `Date`, `Map`, `Set`, `RegExp`, `Error`, typed arrays and `BigInt`
+* intact — so they were being destroyed here, before the transport that would
+* have carried them was ever reached.
+*
+* Structured clone is therefore the line, rather than a list authored here:
+* it is the boundary that actually exists, it needs no maintaining as the
+* platform adds types, and adopting it is what makes this walk agree with
+* `isEquivalent`, which refuses to compare anything that is not plain.
+*
+* Without `clean` the copy stays in this realm, so the value is carried by
+* reference — the same answer `copyState` in `@poveste/shared` gives, and the
+* identity `isEquivalent` then settles by `Object.is`.
+*/
+function notPlain(value, clean, seen) {
+	if (!clean) return value;
+	if (value instanceof Map || value instanceof Set) return walkCollection(value, seen);
+	try {
+		const copy = structuredClone(value);
+		seen.set(value, copy);
+		return copy;
+	} catch {
+		return DROP;
+	}
+}
+/**
+* `Map` and `Set`, walked rather than handed to `structuredClone`, for two
+* measured reasons.
+*
+* They hold user values, so this walk's own rules have to reach inside them: a
+* function or a marked value in a `Map` is the same problem it is in an array,
+* and an array already comes out shorter for it. Cloning the whole container
+* would carry a function straight into a `DataCloneError`, and would strip a
+* marked value's `__v_skip` and hand the far side a plain graph to deep-watch
+* — which is the hazard #974 exists to prevent.
+*
+* And these are the only types here that Vue proxies. `structuredClone` throws
+* `DataCloneError` on a reactive `Map` while the raw one clones fine, so a
+* `Map` in reactive state would be refused and dropped — a second silence
+* rather than a fix for the first. `Date`, `RegExp`, `Error` and typed arrays
+* are not proxied, so the path below never meets a proxy and needs no `toRaw`.
+*/
+function walkCollection(value, seen) {
+	const keep = (walked) => walked !== DROP && typeof walked !== "function";
+	if (value instanceof Set) {
+		const copy = /* @__PURE__ */ new Set();
+		seen.set(value, copy);
+		for (const entry of value) {
+			const walked = walk(entry, true, seen);
+			if (keep(walked)) copy.add(walked);
+		}
+		return copy;
+	}
+	const copy = /* @__PURE__ */ new Map();
+	seen.set(value, copy);
+	for (const [key, entry] of value) {
+		const walkedKey = walk(key, true, seen);
+		const walked = walk(entry, true, seen);
+		if (keep(walkedKey) && keep(walked)) copy.set(walkedKey, walked);
+	}
+	return copy;
+}
+function toRawObject(obj, target, clean, seen) {
 	Object.keys(obj).forEach((key) => {
 		if (clean && typeof obj[key] === "function") return;
-		target[key] = toRawDeep(obj[key], clean, seen);
+		const value = walk(obj[key], clean, seen);
+		if (value === DROP) return;
+		target[key] = value;
 	});
 }
 /**

package/dist/bundled/util/variant.js

@@ -8,14 +8,24 @@ import { useRoute } from "@poveste/vendors/vue-router";
 * has to tell "a variant is on its way" from "this story is waiting for the
 * reader to pick one" needs the same answer it will give — hence one predicate
 * rather than two copies of the condition (#328).
+*
+* Any story with variants, deliberately. It used to require a remembered choice
+* or exactly one variant, which made `StoryView`'s `variants[0]` fallback
+* unreachable: a story with several variants and no history satisfied neither
+* clause, so the first visit of a session showed an empty panel and every visit
+* after it worked, because the first one recorded the history (#724).
+*
+* No layout clause. Grid stories already auto-selected on revisit through the
+* remembered choice, so excluding them here would auto-open them on the second
+* visit and never the first — this defect, made permanent for one layout.
 */
 function autoSelectsVariant(story) {
-	return !!story && (!!story.lastSelectedVariant || story.variants.length === 1);
+	return !!story && story.variants.length > 0;
 }
 function useCurrentVariantRoute(variant) {
 	const route = useRoute();
 	return {
-		isActive: computed(() => route.query.variantId === variant.value.id),
+		isActive: computed(() => route.query["variantId"] === variant.value.id),
 		targetRoute: computed(() => ({
 			...route,
 			query: {