@wular/coder 0.4.6 → 0.4.8

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/ui/select.7f481669998074f8.js

@@ -0,0 +1,228 @@
+import "./select.32a95ad31c0436ad.css.pnext-asset.js";
+import { Fragment } from "../../../../../../../node_modules/preact/dist/preact.mjs";
+import { useId, useLayoutEffect, useRef, useState } from "../../../../../../../node_modules/preact/hooks/dist/hooks.mjs";
+import { iCheck, iDown, iPlus } from "./icons.868385119bf2de28.js";
+import { Icon } from "./icon.0874ca2f58f7db14.js";
+import { jsx as _jsx, jsxs as _jsxs } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+const PAGE = 10;
+/** A select in the menu style, with keyboard, type-ahead and touch; `name` posts its value. */
+export function Select({ label, options, value, defaultValue, onChange, onFocus, name, disabled, headings, subs, icons, action }) {
+	const [own, setOwn] = useState(defaultValue ?? options[0]?.[0] ?? "");
+	// A value the options no longer hold falls back to the first, as a native select does.
+	const selected = Math.max(0, options.findIndex(([key]) => key === (value ?? own)));
+	const current = options[selected]?.[0] ?? "";
+	const [open, setOpen] = useState(false);
+	const [active, setActive] = useState(selected);
+	const [place, setPlace] = useState("");
+	const button = useRef(null);
+	const list = useRef(null);
+	const typed = useRef({
+		text: "",
+		at: 0
+	});
+	const id = useId();
+	const show = (index = selected) => {
+		setActive(index);
+		setOpen(true);
+	};
+	const close = (focus = true) => {
+		setOpen(false);
+		if (focus) button.current?.focus();
+	};
+	const pick = (index) => {
+		if (action && index === options.length) {
+			close();
+			action.onPick();
+			return;
+		}
+		const next = options[index]?.[0];
+		close();
+		if (next === undefined || next === current) return;
+		if (value === undefined) setOwn(next);
+		onChange?.(next);
+	};
+	/** Type-ahead: the next label starting with what was typed; one key repeated cycles. */
+	const seek = (key, from) => {
+		const now = Date.now();
+		const text = now - typed.current.at > 600 ? key : typed.current.text + key;
+		typed.current = {
+			text,
+			at: now
+		};
+		const needle = /^(.)\1*$/.test(text) ? text[0] : text;
+		const start = needle.length === 1 ? from + 1 : from;
+		for (let step = 0; step < options.length; step++) {
+			const index = (start + step) % options.length;
+			if (options[index][1].toLowerCase().startsWith(needle.toLowerCase())) return index;
+		}
+		return -1;
+	};
+	const onKeyDown = (event) => {
+		const last = options.length - 1 + (action ? 1 : 0);
+		const key = event.key;
+		if (!open) {
+			if ([
+				"ArrowDown",
+				"ArrowUp",
+				"Enter",
+				" "
+			].includes(key)) show();
+			else if (key === "Home") show(0);
+			else if (key === "End") show(last);
+			else if (key.length === 1 && !event.ctrlKey && !event.metaKey) {
+				const found = seek(key, selected);
+				if (found >= 0) show(found);
+				else return;
+			} else return;
+			event.preventDefault();
+			return;
+		}
+		if (key === "ArrowDown") setActive(Math.min(last, active + 1));
+		else if (key === "ArrowUp" && event.altKey) pick(active);
+		else if (key === "ArrowUp") setActive(Math.max(0, active - 1));
+		else if (key === "Home") setActive(0);
+		else if (key === "End") setActive(last);
+		else if (key === "PageDown") setActive(Math.min(last, active + PAGE));
+		else if (key === "PageUp") setActive(Math.max(0, active - PAGE));
+		else if (key === "Enter" || key === " " && Date.now() - typed.current.at > 600) pick(active);
+		else if (key === "Escape") {
+			event.stopPropagation();
+			close();
+		} else if (key === "Tab") {
+			pick(active);
+			return;
+		} else if (key.length === 1 && !event.ctrlKey && !event.metaKey) {
+			const found = seek(key, active);
+			if (found >= 0) setActive(found);
+		} else return;
+		event.preventDefault();
+	};
+	// In the top layer, so a dialog or scroll box never clips it; flips up near the bottom.
+	useLayoutEffect(() => {
+		if (!open) return;
+		list.current?.showPopover();
+		const position = () => {
+			const box = button.current?.getBoundingClientRect();
+			const menu = list.current;
+			if (!box || !menu) return;
+			const below = innerHeight - box.bottom - 12;
+			const up = below < Math.min(menu.scrollHeight, 240) && box.top > below;
+			setPlace(`left:${Math.round(Math.min(box.left, innerWidth - menu.offsetWidth - 8))}px;min-width:${Math.round(box.width)}px;` + (up ? `bottom:${Math.round(innerHeight - box.top + 4)}px;max-height:${Math.round(Math.min(560, box.top - 12))}px` : `top:${Math.round(box.bottom + 4)}px;max-height:${Math.round(Math.min(560, below))}px`));
+		};
+		position();
+		const outside = (event) => {
+			const target = event.target;
+			if (!button.current?.contains(target) && !list.current?.contains(target)) close(false);
+		};
+		addEventListener("resize", position);
+		addEventListener("scroll", position, true);
+		document.addEventListener("pointerdown", outside);
+		return () => {
+			removeEventListener("resize", position);
+			removeEventListener("scroll", position, true);
+			document.removeEventListener("pointerdown", outside);
+		};
+	}, [open]);
+	useLayoutEffect(() => {
+		if (open) list.current?.querySelector(`[data-index="${active}"]`)?.scrollIntoView({ block: "nearest" });
+	}, [
+		open,
+		active,
+		place
+	]);
+	return /* @__PURE__ */ _jsxs("span", {
+		class: "select",
+		children: [
+			/* @__PURE__ */ _jsxs("button", {
+				ref: button,
+				type: "button",
+				role: "combobox",
+				"data-keep": true,
+				"aria-label": label,
+				"aria-haspopup": "listbox",
+				"aria-expanded": open,
+				"aria-controls": `${id}-list`,
+				"aria-activedescendant": open ? `${id}-${active}` : undefined,
+				disabled,
+				onFocus,
+				onPointerDown: onFocus,
+				onClick: (event) => {
+					event.preventDefault();
+					if (open) close();
+					else show();
+				},
+				onKeyDown,
+				children: [
+					icons?.[current] ?? null,
+					/* @__PURE__ */ _jsx("span", {
+						class: "grow",
+						children: options[selected]?.[1] ?? ""
+					}),
+					/* @__PURE__ */ _jsx(Icon, { d: iDown })
+				]
+			}),
+			name ? /* @__PURE__ */ _jsx("input", {
+				type: "hidden",
+				name,
+				value: current
+			}) : null,
+			open ? /* @__PURE__ */ _jsxs("div", {
+				ref: list,
+				id: `${id}-list`,
+				class: "pop select-pop",
+				popover: "manual",
+				role: "listbox",
+				"aria-label": label,
+				style: place || "visibility:hidden",
+				onMouseDown: (event) => event.preventDefault(),
+				children: [options.map(([key, text], index) => /* @__PURE__ */ _jsxs(Fragment, { children: [headings?.[key] ? /* @__PURE__ */ _jsx("p", {
+					class: "pop-label",
+					children: headings[key]
+				}) : null, /* @__PURE__ */ _jsxs("div", {
+					id: `${id}-${index}`,
+					"data-index": index,
+					role: "option",
+					"aria-selected": index === selected,
+					class: index === active ? "pop-item on" : "pop-item",
+					onPointerMove: () => index !== active && setActive(index),
+					// Picks without letting a wrapping label re-open the list.
+					onClick: (event) => {
+						event.preventDefault();
+						pick(index);
+					},
+					children: [
+						icons?.[key] ?? null,
+						/* @__PURE__ */ _jsxs("span", {
+							class: "grow",
+							children: [text, subs?.[key] ? /* @__PURE__ */ _jsx("small", {
+								class: "pop-path",
+								children: /* @__PURE__ */ _jsx("bdi", {
+									dir: "ltr",
+									children: subs[key]
+								})
+							}) : null]
+						}),
+						/* @__PURE__ */ _jsx(Icon, { d: iCheck })
+					]
+				})] }, key)), action ? /* @__PURE__ */ _jsxs("div", {
+					id: `${id}-${options.length}`,
+					"data-index": options.length,
+					role: "option",
+					"aria-selected": false,
+					class: active === options.length ? "pop-item action on" : "pop-item action",
+					onPointerMove: () => active !== options.length && setActive(options.length),
+					onClick: (event) => {
+						event.preventDefault();
+						pick(options.length);
+					},
+					children: [/* @__PURE__ */ _jsx(Icon, { d: action.icon ?? iPlus }), /* @__PURE__ */ _jsx("span", {
+						class: "grow",
+						children: action.label
+					})]
+				}) : null]
+			}) : null
+		]
+	});
+}
+/** The label a filter's value shows. */
+export const labelOf = (options, value) => (options.find(([key]) => key === value) ?? options[0])[1];

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/ui/sentinel.17cffebfc3103b9f.js

@@ -0,0 +1,59 @@
+"use client";
+import "./sentinel.1e3ec9bd6008d811.css.pnext-asset.js";
+import { useEffect, useRef } from "../../../../../../../node_modules/preact/hooks/dist/hooks.mjs";
+import { jsx as _jsx } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+/** Goes right before a page head: the head sticks under the top bar and turns compact there, its old height kept as margin so nothing under it moves. */
+export function Sentinel() {
+	const ref = useRef(null);
+	useEffect(() => {
+		const mark = ref.current;
+		// Inside an island the head follows the island's host.
+		const head = mark.nextElementSibling ?? mark.parentElement.nextElementSibling;
+		const page = head.closest(".page");
+		// How much shorter the compact head is; it compacts only once that much has scrolled under it, so no gap opens above what follows.
+		const shrink = () => {
+			const stuck = head.classList.contains("stuck");
+			const before = head.offsetHeight;
+			head.classList.toggle("stuck", !stuck);
+			const after = head.offsetHeight;
+			head.classList.toggle("stuck", stuck);
+			return Math.max(0, stuck ? after - before : before - after);
+		};
+		let observer;
+		const watch = () => {
+			observer?.disconnect();
+			// the head sticks at 56px; it compacts once its top is that much further up
+			const line = 56 - shrink();
+			observer = new IntersectionObserver(([entry]) => {
+				const stuck = !entry.isIntersecting && entry.boundingClientRect.top < line;
+				if (stuck === head.classList.contains("stuck")) return;
+				// The page keeps its height while the head changes, or a page just taller than the viewport clamps its scroll to 0.
+				const tall = head.offsetHeight;
+				if (page) page.style.paddingBottom = `${tall}px`;
+				head.classList.toggle("stuck", stuck);
+				head.style.marginBottom = stuck ? `${tall - head.offsetHeight}px` : "";
+				if (page) page.style.paddingBottom = "";
+			}, { rootMargin: `${-line}px 0px 0px 0px` });
+			observer.observe(mark);
+		};
+		watch();
+		// Tabs and filter rows stick under the head at its current height; a new width changes how much it compacts by.
+		let width = head.offsetWidth;
+		const sized = new ResizeObserver(() => {
+			page?.style.setProperty("--head", `${head.offsetHeight}px`);
+			if (head.offsetWidth === width) return;
+			width = head.offsetWidth;
+			watch();
+		});
+		sized.observe(head, { box: "border-box" });
+		return () => {
+			observer?.disconnect();
+			sized.disconnect();
+			page?.style.removeProperty("--head");
+		};
+	}, []);
+	return /* @__PURE__ */ _jsx("i", {
+		class: "sentinel",
+		ref
+	});
+}

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/ui/tabs.66b2e54963f6901b.js

@@ -0,0 +1,28 @@
+import "./tabs.ca13e40ff54128d0.css.pnext-asset.js";
+import { CurrentLink } from "../nav/current-link.727b350a40b9ca13.js";
+import { linkOf } from "../nav/to.a2c840c09bd4bf4a.js";
+import { jsx as _jsx, jsxs as _jsxs } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+const compact = new Intl.NumberFormat("en", { notation: "compact" });
+/** Tabs that are pages under one header; the current one follows the address. */
+export function Tabs({ label, items }) {
+	return /* @__PURE__ */ _jsx("nav", {
+		class: "tabs",
+		"aria-label": label,
+		children: items.map(({ label, count, ...to }) => /* @__PURE__ */ _jsxs(CurrentLink, {
+			...linkOf(to),
+			prefetch: "intent",
+			children: [label, count !== undefined ? /* @__PURE__ */ _jsx("span", {
+				class: "count",
+				children: compact.format(count)
+			}) : null]
+		}, label))
+	});
+}
+/** Tabs before their page arrives: the same row, kept blank until the labels come with their counts. */
+export function LoadingTabs({ labels }) {
+	return /* @__PURE__ */ _jsx("nav", {
+		class: "tabs",
+		"aria-hidden": "true",
+		children: labels.map((label) => /* @__PURE__ */ _jsx("a", { children: label }, label))
+	});
+}

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/ui/tail.30913c92f5ca6102.js

@@ -0,0 +1,25 @@
+import "./tail.0a5f3c0595e68610.css.pnext-asset.js";
+import { Loading } from "./card.6227f43fc0ae4bd1.js";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+/** Below the rows: what is loading, what failed, and the mark that pulls in the next page. */
+export function Tail({ sentinel, more, busy, error, retry, noun }) {
+	if (!more && !error) return null;
+	return /* @__PURE__ */ _jsx("div", {
+		class: error ? "tail err" : "tail",
+		ref: sentinel,
+		role: "status",
+		children: error ? /* @__PURE__ */ _jsxs(_Fragment, { children: [
+			error,
+			" ",
+			/* @__PURE__ */ _jsx("button", {
+				type: "button",
+				class: "btn ghost sm",
+				onClick: retry,
+				children: "Retry"
+			})
+		] }) : busy ? /* @__PURE__ */ _jsx(Loading, {
+			label: `Loading more ${noun}`,
+			inline: true
+		}) : null
+	});
+}

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/ui/toolbar.801bbd3163d3fbb0.js

@@ -0,0 +1,80 @@
+import "./toolbar.40284b41c03c5dcb.css.pnext-asset.js";
+import { useEffect, useRef, useState } from "../../../../../../../node_modules/preact/hooks/dist/hooks.mjs";
+import { iSearch } from "./icons.868385119bf2de28.js";
+import { readQuery, writeQuery } from "../../utils/paged.18f5872fc5aebe96.js";
+import { Icon } from "./icon.0874ca2f58f7db14.js";
+import { Sentinel } from "./sentinel.17cffebfc3103b9f.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+/** The query string for a set of filters, empty ones left out. */
+export const queryOf = (values) => new URLSearchParams(Object.entries(values).filter(([, value]) => value)).toString();
+/** Filter values that live in the address bar; typing settles for a moment before it applies. */
+export function useFilters(initial) {
+	const [values, setValues] = useState(initial);
+	const [applied, setApplied] = useState(initial);
+	const timer = useRef();
+	useEffect(() => {
+		const fromUrl = readQuery(Object.keys(initial));
+		if (Object.keys(initial).some((key) => fromUrl[key] !== initial[key])) {
+			setValues(fromUrl);
+			setApplied(fromUrl);
+		}
+	}, []);
+	useEffect(() => () => clearTimeout(timer.current), []);
+	const set = (key, value, settle = 0) => {
+		const next = {
+			...values,
+			[key]: value
+		};
+		setValues(next);
+		clearTimeout(timer.current);
+		const apply = () => {
+			setApplied(next);
+			writeQuery(next);
+		};
+		if (settle) timer.current = setTimeout(apply, settle);
+		else apply();
+	};
+	return {
+		values,
+		set,
+		query: queryOf(applied)
+	};
+}
+export function Search({ value, label, onInput }) {
+	return /* @__PURE__ */ _jsxs("label", {
+		class: "search",
+		children: [/* @__PURE__ */ _jsx(Icon, { d: iSearch }), /* @__PURE__ */ _jsx("input", {
+			type: "search",
+			value,
+			placeholder: label,
+			"aria-label": label,
+			onInput: (event) => onInput(event.currentTarget.value)
+		})]
+	});
+}
+/** A list's search and filters with its primary action: one row in the page head, or its own row inside a tab. */
+export function Toolbar({ head, action, children }) {
+	return head ? /* @__PURE__ */ _jsxs(_Fragment, { children: [/* @__PURE__ */ _jsx(Sentinel, {}), /* @__PURE__ */ _jsxs("header", {
+		class: "head tools",
+		children: [
+			/* @__PURE__ */ _jsxs("div", { children: [/* @__PURE__ */ _jsx("h1", { children: head.title }), head.lead ? /* @__PURE__ */ _jsx("p", {
+				class: "lead",
+				children: head.lead
+			}) : null] }),
+			/* @__PURE__ */ _jsx("div", {
+				class: "filters",
+				children
+			}),
+			action ? /* @__PURE__ */ _jsx("div", {
+				class: "actions",
+				children: action
+			}) : null
+		]
+	})] }) : /* @__PURE__ */ _jsxs("div", {
+		class: "filters",
+		children: [children, action ? /* @__PURE__ */ _jsx("span", {
+			class: "end",
+			children: action
+		}) : null]
+	});
+}

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/utils/action.568346602027ac74.js

@@ -0,0 +1,34 @@
+"use client";
+import { useState } from "../../../../../../node_modules/preact/hooks/dist/hooks.mjs";
+import { useRouter } from "../../../../../../node_modules/@wular/pnext/src/api/client-navigation.ts";
+import { toastError } from "../comps/frame/task-toasts.4282affa47415a36.js";
+import { reasonText } from "./format.6a7d1beaf4d09d9c.js";
+const FAILED = "Something went wrong";
+/** A failure no action ran, as the same toast. */
+export const toastFailure = (reason) => toastError(FAILED, reasonText(reason));
+/** Runs an action: `pending` names the one in flight, a failure shows as a toast, and the answer says whether it worked. */
+export function useAction(defaults = {}) {
+	const nav = useRouter();
+	const [pending, setPending] = useState();
+	const run = async (name, work, options = {}) => {
+		const { toast = FAILED, refresh, leaves } = {
+			...defaults,
+			...options
+		};
+		setPending(name);
+		try {
+			await work();
+		} catch (reason) {
+			setPending(undefined);
+			toastError(toast, reasonText(reason));
+			return false;
+		}
+		if (!leaves) setPending(undefined);
+		if (refresh) nav.refresh();
+		return true;
+	};
+	return {
+		pending,
+		run
+	};
+}

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/utils/client.d25e6dcc6704eb60.js

@@ -0,0 +1,59 @@
+"use client";
+import { useEffect, useRef } from "../../../../../../node_modules/preact/hooks/dist/hooks.mjs";
+import { ServerClient } from "../../../client/index.8e150ef2bc6a5f4e.js";
+export const client = new ServerClient("", { cookie: true }, {
+	// The page's organization, so a tab open in another one never changes what this one acts on.
+	fetch(input, init) {
+		const org = /^\/dash\/([^/]+)/.exec(globalThis.location?.pathname ?? "")?.[1];
+		if (!org) return fetch(input, init);
+		const headers = new Headers(init?.headers);
+		headers.set("x-coder-organization", decodeURIComponent(org));
+		return fetch(input, {
+			...init,
+			headers
+		});
+	},
+	onError(error) {
+		if (error.status === 401 && (error.authenticate || /^Sign in/.test(error.message))) location.href = `/login?return=${encodeURIComponent(location.pathname + location.search)}`;
+	}
+});
+export async function signOut() {
+	const { url } = await client.signOut();
+	location.href = url ?? "/?signed_out=1";
+}
+/** Runs `work` every `ms` once the last run settles, skipping while the tab is hidden; returns its stop. */
+function poll(work, ms) {
+	let timer;
+	let stopped = false;
+	const next = () => {
+		if (!stopped) timer = setTimeout(run, ms);
+	};
+	const run = () => {
+		if (document.visibilityState === "hidden") return next();
+		void work().catch((reason) => console.error("coder dashboard: poll", reason)).finally(next);
+	};
+	next();
+	return () => {
+		stopped = true;
+		clearTimeout(timer);
+	};
+}
+/** Polls `work` while it is set, and stops on unmount or when `inputs` change; `signal` says a run's poll has stopped. */
+export function usePoll(work, ms, inputs = []) {
+	const latest = useRef(work);
+	latest.current = work;
+	const on = Boolean(work);
+	useEffect(() => {
+		if (!on) return;
+		const abort = new AbortController();
+		const stop = poll(async () => latest.current?.(abort.signal), ms);
+		return () => {
+			abort.abort();
+			stop();
+		};
+	}, [
+		on,
+		ms,
+		...inputs
+	]);
+}

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/utils/paged.18f5872fc5aebe96.js

@@ -0,0 +1,153 @@
+import { useEffect, useRef, useState } from "../../../../../../node_modules/preact/hooks/dist/hooks.mjs";
+const entry = (name) => `${history.state?.__pnextEntry ?? location.pathname}|${name}`;
+const savedRows = (name) => history.state?.coderPages?.[name];
+const saveRows = (name, rows) => history.replaceState({
+	...history.state,
+	coderPages: {
+		...history.state?.coderPages,
+		[name]: rows
+	}
+}, "");
+const FRESH_MS = 6e4;
+/** Passes `value` on once a loader shown since `since` has stayed its 300 ms; one that never showed holds nothing. */
+export const held = (since) => (value) => new Promise((done) => {
+	const waited = performance.now() - since;
+	setTimeout(done, waited > 150 ? 450 - waited : 0, value);
+});
+const fromPage = (query, page) => ({
+	query,
+	rows: page.items,
+	next: page.next,
+	meta: page
+});
+/** Cursor pages; the server renders the first, more load near the end, a new `query` starts over. */
+export function usePaged({ name, query, first, initial, root, fetchPage }) {
+	const firstPages = useRef(new Map([[initial, {
+		page: first,
+		at: Date.now()
+	}]]));
+	const [state, setState] = useState(() => fromPage(initial, first));
+	const [error, setError] = useState("");
+	const [busy, setBusy] = useState(false);
+	const sentinel = useRef(null);
+	const live = useRef(state);
+	live.current = state;
+	// The load in flight; each is its own object, so an answer to an older load for the same page never passes.
+	const loading = useRef(undefined);
+	const failed = useRef(undefined);
+	const load = (cursor, forQuery, append) => {
+		const key = `${forQuery}|${cursor}`;
+		if (loading.current?.key === key) return;
+		const request = { key };
+		loading.current = request;
+		setError("");
+		setBusy(true);
+		const since = performance.now();
+		const at = entry(name);
+		const cached = append ? undefined : firstPages.current.get(forQuery);
+		if (cached && Date.now() - cached.at < FRESH_MS) setState(fromPage(forQuery, cached.page));
+		void fetchPage(cursor).then(held(since)).then((page) => {
+			if (loading.current !== request) return;
+			if (!append) firstPages.current.set(forQuery, {
+				page,
+				at: Date.now()
+			});
+			setError("");
+			failed.current = undefined;
+			setState((current) => {
+				if (append && (current.query !== forQuery || current.next !== cursor)) return current;
+				const next = append && current.query === forQuery ? {
+					...current,
+					rows: [...current.rows, ...page.items],
+					next: page.next
+				} : fromPage(forQuery, page);
+				if (entry(name) === at) saveRows(name, next);
+				return next;
+			});
+		}).catch((reason) => {
+			if (loading.current !== request) return;
+			failed.current = () => load(cursor, forQuery, append);
+			setError(reason instanceof Error ? reason.message : String(reason));
+		}).finally(() => {
+			if (loading.current !== request) return;
+			loading.current = undefined;
+			setBusy(false);
+		});
+	};
+	useEffect(() => () => {
+		loading.current = undefined;
+	}, []);
+	// A refresh hands the island a new first page.
+	const seen = useRef(first);
+	useEffect(() => {
+		if (seen.current === first) return;
+		seen.current = first;
+		// A page still loading belongs to the rows this replaces.
+		loading.current = undefined;
+		setBusy(false);
+		firstPages.current.set(initial, {
+			page: first,
+			at: Date.now()
+		});
+		setState(fromPage(initial, first));
+	}, [first]);
+	// A new query drops any load for another; back to this entry: the rows it had; else its first page.
+	useEffect(() => {
+		loading.current = undefined;
+		failed.current = undefined;
+		setError("");
+		setBusy(false);
+		const saved = savedRows(name);
+		if (saved && saved.query === query && saved.rows.length > live.current.rows.length) {
+			setState(saved);
+			return;
+		}
+		if (query !== live.current.query) load("", query, false);
+	}, [query]);
+	useEffect(() => {
+		const mark = sentinel.current;
+		if (!mark || !state.next || error) return;
+		const observer = new IntersectionObserver(([seen]) => {
+			if (seen?.isIntersecting && live.current.next && live.current.query === query) load(live.current.next, query, true);
+		}, {
+			root: root?.() ?? null,
+			rootMargin: "0px 0px 300px 0px"
+		});
+		observer.observe(mark);
+		return () => observer.disconnect();
+	}, [
+		state.next,
+		state.rows.length,
+		query,
+		error
+	]);
+	return {
+		rows: state.rows,
+		/** The first page as the server sent it, for totals that ride along. */
+		meta: state.meta,
+		more: Boolean(state.next),
+		busy,
+		error,
+		stale: busy && state.query !== query,
+		sentinel,
+		retry: () => {
+			setError("");
+			failed.current?.();
+		}
+	};
+}
+/** Filters live in the address bar, so a reload or a shared link shows the same list. */
+export function writeQuery(values) {
+	const url = new URL(location.href);
+	for (const [key, value] of Object.entries(values)) if (value) url.searchParams.set(key, value);
+	else url.searchParams.delete(key);
+	history.replaceState(history.state, "", url);
+}
+export function readQuery(keys) {
+	const params = new URLSearchParams(location.search);
+	return Object.fromEntries(keys.map((key) => [key, params.get(key) ?? ""]));
+}
+/** Rows a list loads per page; more load as it scrolls. */
+export const LIST_PAGE = 20;
+/** Rows a filter's list shows; typing finds the rest. */
+export const FILTER_ROWS = 20;

package/dist/dash/standalone/static/assets/chunks/action-df9907c7a10bf826.js

@@ -0,0 +1 @@
+import{g as e}from"./format-b19b8eec331414f4.js";import{$1d as o}from"./shared-init-35a0e9007eeca198.js";import{$3a as s}from"./shared-init-35a0e9007eeca198.js";import{$0h as r}from"./shared-init-b8184e0e554d5aa4.js";var i="Something went wrong",b=n=>o(i,e(n));function k(n={}){let a=s(),[u,t]=r();return{pending:u,run:async(f,c,p={})=>{let{toast:m=i,refresh:g,leaves:l}={...n,...p};t(f);try{await c()}catch(d){return t(void 0),o(m,e(d)),!1}return l||t(void 0),g&&a.refresh(),!0}}}export{b as a,k as b};