shelving 1.271.0 → 1.271.2

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "shelving",
-	"version": "1.271.0",
+	"version": "1.271.2",
 	"author": "Dave Houlbrooke <dave@shax.com>",
 	"repository": {
 		"type": "git",
@@ -9,13 +9,13 @@
 	"main": "./index.js",
 	"module": "./index.js",
 	"devDependencies": {
-		"@biomejs/biome": "^2.5.2",
+		"@biomejs/biome": "^2.5.4",
 		"@google-cloud/firestore": "^8.6.0",
 		"@heroicons/react": "^2.2.0",
 		"@types/bun": "^1.3.14",
 		"@types/react": "^19.2.17",
 		"@types/react-dom": "^19.2.3",
-		"firebase": "^12.15.0",
+		"firebase": "^12.16.0",
 		"react": "^19.3.0-canary-fef12a01-20260413",
 		"react-dom": "^19.3.0-canary-fef12a01-20260413",
 		"stylelint": "^17.14.0",

package/ui/form/Progress.md

@@ -7,7 +7,7 @@ A continuous horizontal progress bar for the completion of a task. Rendered as a
 - Use `Progress` for **task completion** — a value heading toward "done" (an upload, a multi-step form, a load). For a static reading within a range that can move up and down (disk usage, a score), a gauge is the right model, not a progress bar.
 - `value` is filled within the `min`–`max` range (defaults `0`–`100`), matching `getPercent()` and `formatPercent()`. `<progress>` has no `min` attribute, so the range is normalised to `value - min` / `max - min` before it reaches the element.
 - The browser clamps `value` to the `0`–`max` range, so an out-of-range `value` renders an empty or full bar rather than overspilling. A non-positive range (`min === max`) falls back to an empty bar rather than the indeterminate state.
-- Omit `value` (or pass `null`/`undefined`) for an ongoing task whose duration isn't known — exactly like a native `<progress>`, dropping the attribute switches the element into the `:indeterminate` state (no `aria-valuenow`), and a block of fill colour flows across the track on a loop. `color=` / `status=` still recolour it. The animation respects `prefers-reduced-motion` (it holds a centred block instead of looping).
+- Omit `value` (or pass `null`/`undefined`) for an ongoing task whose duration isn't known — exactly like a native `<progress>`, dropping the attribute switches the element into the `:indeterminate` state (no `aria-valuenow`), and a block of fill colour flows across the track on a loop. `color=` / `status=` still recolour it. The animation runs even under `prefers-reduced-motion` — movement is the indeterminate bar's only signal, and a frozen block would read as a stalled bar.
 - `aria-valuetext` carries the formatted percentage, so assistive tech announces e.g. "75%".
 - Paints from the [tint ladder](/ui/TINT_CLASS): `color=` and `status=` move the tint anchor for the bar, so the fill (and track) re-derive together — `status="success"` gives a green bar, `color="purple"` a purple one. Without either, the bar takes the ambient tint (`--tint-50`, gray by default).
 

package/ui/form/Progress.module.css

@@ -63,14 +63,7 @@
 		background: transparent;
 	}
 
-	/* Honour reduced-motion: hold the block centred rather than looping. */
-	@media (prefers-reduced-motion: reduce) {
-		.progress:indeterminate,
-		.prose progress:indeterminate {
-			animation: none;
-			background-position: 50% 0;
-		}
-	}
+	/* No `prefers-reduced-motion` override — movement is the indeterminate bar's only signal, so freezing it reads as a stalled determinate bar rather than "working". The animation is a small element-sized loop, not a large vestibular-trigger transition. */
 }
 
 /* The `progress-flow` keyframes referenced above live in the sibling non-module `Progress.css` — see the note there for why they can't be defined in this module file. */

package/ui/page/Head.test.tsx

@@ -0,0 +1,15 @@
+import { describe, expect, test } from "bun:test";
+import { renderToStaticMarkup } from "react-dom/server";
+import { createMeta, Head, MetaContext } from "shelving/ui";
+
+describe("Head", () => {
+	test("emits a <link> element when links are set in context", () => {
+		const html = renderToStaticMarkup(
+			<MetaContext value={createMeta({ root: "http://x.com/", url: "./", links: { icon: "/img/favicon.png" } })}>
+				<Head />
+			</MetaContext>,
+		);
+		expect(html).toContain('rel="icon"');
+		expect(html).toContain('href="http://x.com/img/favicon.png"');
+	});
+});

package/ui/util/meta.js

@@ -115,7 +115,7 @@ export function mergeMetaTags(current, next) {
  * @see https://shelving.cc/ui/mergeMetaLinks
  */
 export function mergeMetaLinks(current, next, url, root, caller = mergeMetaLinks) {
-    return next ? { ...current, ..._yieldMetaLinkEntries(next, url, root, caller) } : current;
+    return next ? { ...current, ...Object.fromEntries(_yieldMetaLinkEntries(next, url, root, caller)) } : current;
 }
 function* _yieldMetaLinkEntries(links, url, root, caller) {
     for (const [k, link] of getDictionaryItems(links))

package/ui/util/meta.test.ts

@@ -0,0 +1,63 @@
+import { describe, expect, test } from "bun:test";
+import { createMeta, mergeMeta, mergeMetaAssets, mergeMetaLinks } from "shelving/ui";
+import { requireURL } from "shelving/util/url";
+
+const ROOT = requireURL("http://x.com/app/");
+const URL = requireURL("http://x.com/app/sub/page");
+
+describe("mergeMetaLinks", () => {
+	test("returns resolved entries when current is unset", () => {
+		const links = mergeMetaLinks(undefined, { icon: "/img/favicon.png" }, ROOT, ROOT);
+		expect(links?.icon?.href).toBe("http://x.com/app/img/favicon.png");
+	});
+
+	test("merges next over current — new keys override, untouched keys survive", () => {
+		const current = mergeMetaLinks(undefined, { icon: "/old.png", canonical: "/page" }, ROOT, ROOT);
+		const links = mergeMetaLinks(current, { icon: "/new.png" }, ROOT, ROOT);
+		expect(links?.icon?.href).toBe("http://x.com/app/new.png");
+		expect(links?.canonical?.href).toBe("http://x.com/app/page");
+	});
+
+	test("skips nullish link values", () => {
+		const links = mergeMetaLinks(undefined, { icon: undefined, canonical: null }, ROOT, ROOT);
+		expect(links).toEqual({});
+	});
+
+	test("resolves relative hrefs against url and absolute hrefs against root", () => {
+		const links = mergeMetaLinks(undefined, { canonical: "./other", icon: "/favicon.png" }, URL, ROOT);
+		expect(links?.canonical?.href).toBe("http://x.com/app/sub/page/other");
+		expect(links?.icon?.href).toBe("http://x.com/app/favicon.png");
+	});
+
+	test("returns current unchanged when next is unset", () => {
+		const current = mergeMetaLinks(undefined, { icon: "/favicon.png" }, ROOT, ROOT);
+		expect(mergeMetaLinks(current, undefined, ROOT, ROOT)).toBe(current);
+	});
+});
+
+describe("mergeMetaAssets", () => {
+	test("resolves relative hrefs against url and absolute hrefs against root", () => {
+		const assets = mergeMetaAssets(undefined, ["./style.css", "/base.css"], URL, ROOT);
+		expect(assets?.map(({ href }) => href)).toEqual(["http://x.com/app/sub/page/style.css", "http://x.com/app/base.css"]);
+	});
+
+	test("appends next after current and skips nullish values", () => {
+		const current = mergeMetaAssets(undefined, ["/base.css"], ROOT, ROOT);
+		const assets = mergeMetaAssets(current, [undefined, "/extra.css", null], ROOT, ROOT);
+		expect(assets?.map(({ href }) => href)).toEqual(["http://x.com/app/base.css", "http://x.com/app/extra.css"]);
+	});
+});
+
+describe("mergeMeta", () => {
+	test("meta with links set produces non-empty resolved links", () => {
+		const meta = createMeta({ root: "http://x.com/", url: "./", links: { icon: "/img/favicon.png" } });
+		expect(meta.links?.icon?.href).toBe("http://x.com/img/favicon.png");
+	});
+
+	test("merges new links over existing resolved links", () => {
+		const meta1 = createMeta({ root: "http://x.com/", url: "./", links: { icon: "/favicon.png" } });
+		const meta2 = mergeMeta(meta1, { url: "./page", links: { canonical: "/page" } });
+		expect(meta2.links?.icon?.href).toBe("http://x.com/favicon.png");
+		expect(meta2.links?.canonical?.href).toBe("http://x.com/page");
+	});
+});

package/ui/util/meta.ts

@@ -239,7 +239,7 @@ export function mergeMetaLinks(
 	root: ImmutableURL | undefined,
 	caller: AnyCaller = mergeMetaLinks,
 ): MetaLinks | undefined {
-	return next ? { ...current, ..._yieldMetaLinkEntries(next, url, root, caller) } : current;
+	return next ? { ...current, ...Object.fromEntries(_yieldMetaLinkEntries(next, url, root, caller)) } : current;
 }
 function* _yieldMetaLinkEntries(
 	links: PossibleMetaLinks,