@cosmicdrift/kumiko-renderer 0.388.0 → 0.390.0

package/dist/web/app/dashboard-screen-controls.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useLocale, useNav, usePrimitives, useQuery, useTranslation } from "../../index.js";
+import { ModeSwitch } from "../widgets/mode-switch.js";
+// Value lives in the URL under `filter.id` (like useListUrlState's
+// `<screenId>.page`, same replaceState) so a `navigate` rowAction with
+// `params` can deep-link onto this filter.
+export function useFilterParams(screen, enabled) {
+    const { Field, Input } = usePrimitives();
+    const t = useTranslation();
+    const nav = useNav();
+    const filter = screen.filter;
+    const value = filter !== undefined ? (nav.searchParams[filter.id] ?? "") : "";
+    const optionsQueryResult = useQuery(filter?.optionsQuery ?? "", {}, { enabled: enabled && filter?.optionsQuery !== undefined });
+    if (filter === undefined) {
+        return { params: {}, picker: null };
+    }
+    const dynamicOptions = filter.optionsQuery !== undefined
+        ? (optionsQueryResult.data?.rows ?? [])
+        : (filter.options ?? []).map((o) => ({ value: o.value, label: t(o.label) }));
+    const allLabel = t(filter.allLabel ?? "kumiko.dashboard.filter.all");
+    const options = [{ value: "", label: allLabel }, ...dynamicOptions];
+    const picker = (_jsx("div", { className: "max-w-xs", children: _jsx(Field, { id: `dashboard-filter-${filter.id}`, label: t(filter.label), children: _jsx(Input, { kind: "combobox", id: `dashboard-filter-${filter.id}`, name: filter.id, options: options, value: value, onChange: (next) => nav.setSearchParams({ [filter.id]: next === "" ? null : next }), placeholder: filter.placeholder !== undefined ? t(filter.placeholder) : allLabel }) }) }));
+    const params = value === "" ? {} : { [filter.id]: value };
+    return { params, picker };
+}
+// An unknown/stale URL value falls back to the declared default.
+export function useTimeRange(screen, translate) {
+    const t = useTranslation();
+    const nav = useNav();
+    const resolver = useLocale();
+    const timeRange = screen.timeRange;
+    if (timeRange === undefined)
+        return { params: {}, control: null };
+    const fromUrl = nav.searchParams[timeRange.id];
+    const value = timeRange.options.find((o) => o.value === fromUrl)?.value ?? timeRange.default;
+    return {
+        // Metric buckets are cut server-side; without the user's zone they default
+        // to UTC while the axis labels are formatted in the user's zone.
+        params: { [timeRange.id]: value, timeZone: resolver.timeZone() },
+        control: (_jsx(ModeSwitch, { value: value, options: timeRange.options.map((o) => ({ value: o.value, label: translate(o.label) })), onChange: (next) => nav.setSearchParams({ [timeRange.id]: next }), ariaLabel: t("kumiko.dashboard.time-range"), testId: `dashboard-time-range-${timeRange.id}` })),
+    };
+}

package/dist/web/app/dashboard-screen-tiles.d.ts

@@ -0,0 +1,8 @@
+import type { DashboardScreenPanel } from "@cosmicdrift/kumiko-framework/ui-types";
+import { type ReactNode } from "react";
+import type { Translate } from "../../headless/index.ts";
+export declare function ScreenPanelTile({ panel, featureName, translate, }: {
+    readonly panel: DashboardScreenPanel;
+    readonly featureName: string;
+    readonly translate: Translate;
+}): ReactNode;

package/dist/web/app/dashboard-screen-tiles.js

@@ -0,0 +1,42 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useContext } from "react";
+import { EmbeddedScreenProvider, evalVisibleWhen, KumikoScreen, useEmbeddedScreen, } from "../../index.js";
+import { cn } from "../lib/cn.js";
+import { EmbeddedFormProvider } from "../primitives/index.js";
+import { SectionCard } from "../widgets/section-card.js";
+import { PanelError, WIDE_PANEL } from "./dashboard-shared.js";
+import { NO_GATE_PAYLOAD, VisibilityQueryContext, visibilityGate, } from "./dashboard-visibility.js";
+function EmbeddedScreenPanelTile({ panel, target, translate, }) {
+    const screenBody = _jsx(KumikoScreen, { schema: target.schema, qn: target.qn, translate: translate });
+    const embedded = panel.chromeless === true ? (_jsx(EmbeddedFormProvider, { children: _jsx(EmbeddedScreenProvider, { children: screenBody }) })) : (screenBody);
+    return (_jsx("div", { className: cn("min-w-0", WIDE_PANEL), "data-testid": `dashboard-panel-${panel.id}`, children: panel.label !== undefined && panel.chromeless !== true ? (_jsx(SectionCard, { title: translate(panel.label), children: embedded })) : (_jsxs(_Fragment, { children: [panel.label !== undefined && (_jsx("h3", { className: "mb-3 text-sm font-semibold text-foreground", children: translate(panel.label) })), embedded] })) }));
+}
+// Own component so the target lookup (a hook) only runs for panels that actually fall back.
+function FallbackScreenPanelTile({ panel, fallback, featureName, translate, }) {
+    const target = useEmbeddedScreen(featureName, fallback);
+    if (target === undefined)
+        return null;
+    return _jsx(EmbeddedScreenPanelTile, { panel: panel, target: target, translate: translate });
+}
+export function ScreenPanelTile({ panel, featureName, translate, }) {
+    const visibleWhen = panel.visibleWhen;
+    const visibility = useContext(VisibilityQueryContext).get(visibleWhen !== undefined ? visibilityGate(visibleWhen.query, NO_GATE_PAYLOAD).key : "");
+    const target = useEmbeddedScreen(featureName, panel.screen);
+    const verdict = visibleWhen === undefined ? "visible" : evalVisibleWhen(visibleWhen, visibility);
+    // Nothing while the gate loads: a fallback that flashes before the real panel flickers.
+    if (verdict === "loading")
+        return null;
+    if (verdict !== "visible" && panel.fallback !== undefined) {
+        return (_jsx(FallbackScreenPanelTile, { panel: panel, fallback: panel.fallback, featureName: featureName, translate: translate }));
+    }
+    if (target === undefined)
+        return null;
+    // A failed gate query must not silently drop the panel: on the
+    // account-security page that would hide every MFA enable/disable path.
+    if (verdict === "error" && visibility?.error) {
+        return (_jsx("div", { className: cn("min-w-0", WIDE_PANEL), "data-testid": `dashboard-panel-${panel.id}`, children: _jsx(PanelError, { label: panel.label !== undefined ? translate(panel.label) : panel.id, error: visibility.error, onRetry: () => void visibility.refetch() }) }));
+    }
+    if (verdict !== "visible")
+        return null;
+    return _jsx(EmbeddedScreenPanelTile, { panel: panel, target: target, translate: translate });
+}

package/dist/web/app/dashboard-visibility.d.ts

@@ -0,0 +1,42 @@
+import type { DashboardPanelDefinition, DashboardScreenPanel } from "@cosmicdrift/kumiko-framework/ui-types";
+import { type ReactNode } from "react";
+import { type UseQueryResult } from "../../index.ts";
+import { type ScreenParams } from "./dashboard-shared.tsx";
+type VisibilityQueryResult = UseQueryResult<Readonly<Record<string, unknown>>>;
+export type VisibilityQueryResults = ReadonlyMap<string, VisibilityQueryResult>;
+export declare const VisibilityQueryContext: import("react").Context<VisibilityQueryResults>;
+export type VisibilityGate = {
+    readonly key: string;
+    readonly query: string;
+    readonly payload: Readonly<Record<string, unknown>>;
+};
+export declare const NO_GATE_PAYLOAD: Readonly<Record<string, unknown>>;
+export declare function visibilityGate(query: string, payload: Readonly<Record<string, unknown>>): VisibilityGate;
+export declare function VisibilityGateQueries({ gates, onResult, onForget, }: {
+    readonly gates: readonly VisibilityGate[];
+    readonly onResult: (key: string, result: VisibilityQueryResult) => void;
+    readonly onForget: (key: string) => void;
+}): ReactNode;
+export declare function useVisibilityGateResults(): {
+    readonly results: VisibilityQueryResults;
+    readonly report: (key: string, result: VisibilityQueryResult) => void;
+    readonly forget: (key: string) => void;
+};
+export declare function distinctVisibilityGates(panels: readonly DashboardPanelDefinition[], screenParams: ScreenParams): VisibilityGate[];
+export declare function GatedGridCell({ panel, screenParams, label, className, children, }: {
+    readonly panel: Exclude<DashboardPanelDefinition, DashboardScreenPanel>;
+    readonly screenParams: ScreenParams;
+    readonly label: string;
+    readonly className: string | undefined;
+    readonly children: ReactNode;
+}): ReactNode;
+export declare function useDashboardVisibility(panels: readonly DashboardPanelDefinition[], screenParams: ScreenParams): {
+    visibilityGates: VisibilityGate[];
+    gateResults: {
+        readonly results: VisibilityQueryResults;
+        readonly report: (key: string, result: VisibilityQueryResult) => void;
+        readonly forget: (key: string) => void;
+    };
+    gateResultsWithPending: VisibilityQueryResults;
+};
+export {};

package/dist/web/app/dashboard-visibility.js

@@ -0,0 +1,102 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useCallback, useContext, useEffect, useMemo, useState, } from "react";
+import { evalVisibleWhen } from "../../index.js";
+import { cn } from "../lib/cn.js";
+import { PanelError, useDashboardQuery } from "./dashboard-shared.js";
+export const VisibilityQueryContext = createContext(new Map());
+export const NO_GATE_PAYLOAD = {};
+export function visibilityGate(query, payload) {
+    return { key: `${query}|${JSON.stringify(payload)}`, query, payload };
+}
+// Embedded screens carry no screen filter; in-grid panels pass the filter
+// (unless ignoreScreenFilter, never for a stat-group) and the time range.
+function panelVisibilityGate(panel, screenParams) {
+    if (panel.kind === "custom" || panel.visibleWhen === undefined)
+        return undefined;
+    if (panel.kind === "screen")
+        return visibilityGate(panel.visibleWhen.query, NO_GATE_PAYLOAD);
+    const dropsFilter = panel.kind !== "stat-group" && panel.kind !== "text" && panel.ignoreScreenFilter === true;
+    return visibilityGate(panel.visibleWhen.query, {
+        ...(dropsFilter ? {} : screenParams.filterParams),
+        ...screenParams.rangeParams,
+        ...screenParams.recordParams,
+    });
+}
+// One live query per distinct gate (query + payload), shared by every panel
+// that gates on it — N panels on the same status query would otherwise each
+// open their own request, SSE subscription and refetch per event. The queries
+// run as keyed siblings of the grid so a changing gate count never changes the
+// grid's position in the tree (which would remount every panel).
+function VisibilityGateQuery({ gate, onResult, onForget, }) {
+    const { data, error, loading, refetch } = useDashboardQuery(gate.query, gate.payload);
+    const { key } = gate;
+    useEffect(() => {
+        onResult(key, { data, error, loading, refetch });
+    }, [key, data, error, loading, refetch, onResult]);
+    useEffect(() => () => onForget(key), [key, onForget]);
+    return null;
+}
+export function VisibilityGateQueries({ gates, onResult, onForget, }) {
+    return gates.map((gate) => (_jsx(VisibilityGateQuery, { gate: gate, onResult: onResult, onForget: onForget }, gate.key)));
+}
+export function useVisibilityGateResults() {
+    const [results, setResults] = useState(new Map());
+    const report = useCallback((key, result) => {
+        setResults((prev) => new Map(prev).set(key, result));
+    }, []);
+    const forget = useCallback((key) => {
+        setResults((prev) => {
+            if (!prev.has(key))
+                return prev;
+            const next = new Map(prev);
+            next.delete(key);
+            return next;
+        });
+    }, []);
+    return { results, report, forget };
+}
+const NOOP_REFETCH = async () => { };
+// A gate reports through an effect, so for its first commit (and after a payload change) no
+// result exists yet; without a placeholder that reads as "hidden" and flashes the fallback.
+function withPendingGates(results, gateKeys) {
+    if (gateKeys.every((key) => results.has(key)))
+        return results;
+    const merged = new Map(results);
+    for (const key of gateKeys) {
+        if (!merged.has(key)) {
+            merged.set(key, { data: null, error: null, loading: true, refetch: NOOP_REFETCH });
+        }
+    }
+    return merged;
+}
+export function distinctVisibilityGates(panels, screenParams) {
+    const gates = new Map();
+    for (const panel of panels) {
+        const gate = panelVisibilityGate(panel, screenParams);
+        if (gate !== undefined)
+            gates.set(gate.key, gate);
+    }
+    return [...gates.values()];
+}
+export function GatedGridCell({ panel, screenParams, label, className, children, }) {
+    const gate = panelVisibilityGate(panel, screenParams);
+    const visibility = useContext(VisibilityQueryContext).get(gate?.key ?? "");
+    const visibleWhen = panel.kind === "custom" ? undefined : panel.visibleWhen;
+    if (visibleWhen !== undefined) {
+        const verdict = evalVisibleWhen(visibleWhen, visibility);
+        if (verdict === "error" && visibility?.error) {
+            return (_jsx("div", { className: cn("min-w-0", className), "data-testid": `dashboard-panel-${panel.id}`, children: _jsx(PanelError, { label: label, error: visibility.error, onRetry: () => void visibility.refetch() }) }));
+        }
+        // Loading renders nothing too: a skeleton that then vanishes flickers.
+        if (verdict !== "visible")
+            return null;
+    }
+    return _jsx("div", { className: cn("min-w-0", className), children: children });
+}
+export function useDashboardVisibility(panels, screenParams) {
+    const visibilityGates = distinctVisibilityGates(panels, screenParams);
+    const gateResults = useVisibilityGateResults();
+    const gateKeysSignature = visibilityGates.map((gate) => gate.key).join("\n");
+    const gateResultsWithPending = useMemo(() => withPendingGates(gateResults.results, gateKeysSignature === "" ? [] : gateKeysSignature.split("\n")), [gateResults.results, gateKeysSignature]);
+    return { visibilityGates, gateResults, gateResultsWithPending };
+}

package/dist/web/app/history-leave-guard.d.ts

@@ -0,0 +1,6 @@
+export declare function committedUrl(): string;
+/** Adopts the entry the browser currently shows as the committed one. */
+export declare function adoptCurrentEntry(): void;
+export declare function pushEntry(url: string): void;
+export declare function replaceEntry(url: string): void;
+export declare function handlePopstate(notify: () => void): void;

package/dist/web/app/history-leave-guard.js

@@ -0,0 +1,115 @@
+import { propertyOf } from "@cosmicdrift/kumiko-types/type-guards";
+import { hasUnsavedInput, requestLeave } from "../../index.js";
+// Back/Forward cannot be vetoed, so the browser has already moved by the time the guard asks.
+// Each entry we create carries its position in history.state; with it a declined move is
+// undone with history.go(-delta) and a confirmed one replayed with history.go(delta), so the
+// stack keeps its shape (no duplicated or truncated entries).
+const INDEX_KEY = "kumikoNavIndex";
+const committed = { url: "", index: 0 };
+let leaveRequestOpen = false;
+// Each history.go() we issue produces one popstate that must not be treated as user navigation.
+const pendingMoves = [];
+// Entries without a position (written by other code) cannot be undone relatively.
+let fallbackTargetUrl;
+function readUrl() {
+    return `${window.location.pathname}${window.location.search}${window.location.hash}`;
+}
+function stateAt(index) {
+    return { [INDEX_KEY]: index };
+}
+function readIndex() {
+    const value = propertyOf(window.history.state, INDEX_KEY);
+    return typeof value === "number" ? value : undefined;
+}
+export function committedUrl() {
+    return committed.url;
+}
+/** Adopts the entry the browser currently shows as the committed one. */
+export function adoptCurrentEntry() {
+    const index = readIndex();
+    committed.url = readUrl();
+    if (index === undefined) {
+        window.history.replaceState(stateAt(committed.index), "", committed.url);
+    }
+    else {
+        committed.index = index;
+    }
+}
+function commitCurrentUrl() {
+    committed.url = readUrl();
+    committed.index = readIndex() ?? committed.index;
+}
+export function pushEntry(url) {
+    window.history.pushState(stateAt(committed.index + 1), "", url);
+    committed.index += 1;
+    committed.url = readUrl();
+}
+export function replaceEntry(url) {
+    window.history.replaceState(stateAt(committed.index), "", url);
+    commitCurrentUrl();
+}
+export function handlePopstate(notify) {
+    const move = pendingMoves.shift();
+    if (move !== undefined) {
+        if (move === "replay") {
+            commitCurrentUrl();
+            notify();
+        }
+        // skip: this popstate is the echo of our own history.go()
+        return;
+    }
+    if (fallbackTargetUrl !== undefined) {
+        const target = fallbackTargetUrl;
+        fallbackTargetUrl = undefined;
+        // After a forward move the entry below our restore-push is not the target.
+        if (readUrl() !== target)
+            window.history.replaceState(stateAt(committed.index), "", target);
+        commitCurrentUrl();
+        notify();
+        // skip: the pending fallback move is settled
+        return;
+    }
+    const newIndex = readIndex();
+    const delta = newIndex === undefined ? 0 : newIndex - committed.index;
+    if (leaveRequestOpen) {
+        // Another Back/Forward while the dialog is open must neither stack an entry nor replace the
+        // open request: step back to the entry the dialog is about.
+        if (delta !== 0) {
+            pendingMoves.push("undo");
+            window.history.go(-delta);
+        }
+        else {
+            window.history.replaceState(stateAt(committed.index), "", committed.url);
+        }
+        // skip: the open leave dialog keeps the decision
+        return;
+    }
+    if (!hasUnsavedInput()) {
+        commitCurrentUrl();
+        notify();
+        // skip: nothing unsaved, the move stands
+        return;
+    }
+    const targetUrl = readUrl();
+    leaveRequestOpen = true;
+    const settle = () => {
+        leaveRequestOpen = false;
+    };
+    if (delta !== 0) {
+        pendingMoves.push("undo");
+        window.history.go(-delta);
+        requestLeave(() => {
+            settle();
+            pendingMoves.push("replay");
+            window.history.go(delta);
+        }, settle);
+        // skip: the leave request owns the rest of the move
+        return;
+    }
+    window.history.pushState(stateAt(committed.index), "", committed.url);
+    requestLeave(() => {
+        settle();
+        fallbackTargetUrl = targetUrl;
+        window.history.back();
+    }, settle);
+}

package/dist/web/app/list-state-store-boot.d.ts

@@ -0,0 +1,6 @@
+import { type ReactNode } from "react";
+/** Provides the tab-scoped list-state store and drops state remembered under
+ *  another user or tenant. Mount below the auth gates so the user is known. */
+export declare function ListStateStoreBoot({ children }: {
+    readonly children: ReactNode;
+}): ReactNode;

package/dist/web/app/list-state-store-boot.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { ListStateStoreProvider } from "../../components/list-state-store.js";
+import { useOptionalCurrentUser } from "../../current-user.js";
+import { resolveListStateStore } from "./session-list-state-store.js";
+/** Provides the tab-scoped list-state store and drops state remembered under
+ *  another user or tenant. Mount below the auth gates so the user is known. */
+export function ListStateStoreBoot({ children }) {
+    const user = useOptionalCurrentUser();
+    const userId = user?.id;
+    const tenantId = user?.tenantId;
+    // Must run before the first list renders; an effect would let it read the previous identity's state.
+    const store = useMemo(() => resolveListStateStore(userId === undefined ? undefined : { userId, tenantId }), [userId, tenantId]);
+    return _jsx(ListStateStoreProvider, { store: store, children: children });
+}

package/dist/web/app/nav.js

@@ -12,7 +12,9 @@ import { jsx as _jsx } from "react/jsx-runtime";
 // notification triggers (our pushPath and the popstate event), so this is not
 // generalizable.
 import { useCallback, useMemo, useSyncExternalStore, } from "react";
+import { normalizeBasePath, prependBasePath, stripBasePath } from "../../app/base-path.js";
 import { formatPath, hasUnsavedInput, parsePath, requestLeave, resolveTarget, useNav, } from "../../index.js";
+import { adoptCurrentEntry, handlePopstate, pushEntry, replaceEntry, } from "./history-leave-guard.js";
 // basePath allows the app to be mounted under a URL prefix
 // (for example, `/admin`). The read path strips the prefix before parsePath;
 // the write path prepends it before pushState/replaceState/href.
@@ -22,45 +24,11 @@ import { formatPath, hasUnsavedInput, parsePath, requestLeave, resolveTarget, us
 // returns route=undefined, and the app renders its "outside" state
 // (Not-Found, marketing layer, server-routing pickup, …). There is no
 // automatic redirect to the app root—the host app decides.
-function normalizeBasePath(raw) {
-    if (raw === undefined || raw === "" || raw === "/")
-        return "";
-    const withLeading = raw.startsWith("/") ? raw : `/${raw}`;
-    return withLeading.endsWith("/") ? withLeading.slice(0, -1) : withLeading;
-}
-// Returns the in-app (basePath-relative) path when `path` is under basePath;
-// otherwise returns `undefined`. The segment boundary is strict: "/administrator"
-// does not match "/admin"—otherwise a string-level prefix check would produce
-// false matches.
-function stripBasePath(path, basePath) {
-    if (basePath === "")
-        return path;
-    if (path === basePath)
-        return "/";
-    if (path.startsWith(`${basePath}/`))
-        return path.slice(basePath.length);
-    return undefined;
-}
-function prependBasePath(path, basePath) {
-    if (basePath === "")
-        return path;
-    // formatPath always returns an absolute in-app path: "/" or "/screen-id"
-    // or "/screen-id/entity-id". "/" becomes basePath; otherwise, concatenate.
-    if (path === "/" || path === "")
-        return basePath;
-    return `${basePath}${path}`;
-}
 // pushState does not fire popstate, so we maintain a listener set that
 // navigate() notifies. Back/Forward navigation goes through a window listener
 // wired exactly once.
 const listeners = new Set();
 let popstateWired = false;
-// URL the app currently shows; popstate has already moved the browser to the
-// target by the time we can ask, so a declined leave must restore this one.
-let committedUrl = "";
-function readUrl() {
-    return `${window.location.pathname}${window.location.search}${window.location.hash}`;
-}
 // Stable identity for the omitted-features case — `?? []` would create a
 // fresh array every render, busting the useMemo below on every render for
 // every existing useBrowserNavApi() call site (none of which pass features).
@@ -71,19 +39,7 @@ function ensurePopstateWired() {
     if (typeof window === "undefined")
         return;
     window.addEventListener("popstate", () => {
-        if (!hasUnsavedInput()) {
-            committedUrl = readUrl();
-            for (const l of listeners)
-                l();
-            return;
-        }
-        const targetUrl = readUrl();
-        window.history.pushState(null, "", committedUrl);
-        requestLeave(() => {
-            // replaceState, not history.back(): the declined entry is already ours
-            // and a forward navigation would otherwise land on the wrong entry.
-            window.history.replaceState(null, "", targetUrl);
-            committedUrl = targetUrl;
+        handlePopstate(() => {
             for (const l of listeners)
                 l();
         });
@@ -99,7 +55,7 @@ function ensurePopstateWired() {
 function subscribe(listener) {
     ensurePopstateWired();
     if (typeof window !== "undefined" && listeners.size === 0)
-        committedUrl = readUrl();
+        adoptCurrentEntry();
     listeners.add(listener);
     return () => {
         listeners.delete(listener);
@@ -146,8 +102,7 @@ function applySearchParamUpdates(updates) {
     if (nextSearch === window.location.search)
         return;
     const url = `${window.location.pathname}${nextSearch}${window.location.hash}`;
-    window.history.replaceState(null, "", url);
-    committedUrl = readUrl();
+    replaceEntry(url);
     for (const l of listeners)
         l();
 }
@@ -168,8 +123,7 @@ function pushPath(path, search) {
     if (unchanged)
         return;
     requestLeave(() => {
-        window.history.pushState(null, "", `${path}${search ?? ""}`);
-        committedUrl = readUrl();
+        pushEntry(`${path}${search ?? ""}`);
         for (const l of listeners)
             l();
     });
@@ -185,8 +139,7 @@ function replacePath(path, search) {
     const leavesCurrentPage = window.location.pathname !== path ||
         (search !== undefined && window.location.search !== search);
     const apply = () => {
-        window.history.replaceState(null, "", nextUrl);
-        committedUrl = readUrl();
+        replaceEntry(nextUrl);
         for (const l of listeners)
             l();
     };

package/dist/web/app/session-list-state-store.d.ts

@@ -0,0 +1,15 @@
+import type { ListStateStore } from "../../components/list-state-store.tsx";
+export type ListStateIdentity = {
+    readonly userId: string;
+    readonly tenantId?: string | undefined;
+};
+/** Remembered list state for the lifetime of the browser tab, keyed per tenant
+ *  and user. Every storage failure (blocked, full) degrades to "nothing remembered". */
+export declare function createSessionListStateStore(storage: Storage, identity: ListStateIdentity): ListStateStore;
+/** Forgets all remembered list state and the identity marker. Logout calls it
+ *  before a page reload, which would otherwise hide the identity change. */
+export declare function clearRememberedListState(): void;
+/** The store for the current identity. State remembered under another identity,
+ *  or under one that has since gone away, is dropped first. Without an identity
+ *  (app without auth) only the in-memory store is used and nothing is persisted. */
+export declare function resolveListStateStore(identity: ListStateIdentity | undefined): ListStateStore;

package/dist/web/app/session-list-state-store.js

@@ -0,0 +1,117 @@
+import { getDefaultMemoryListStateStore } from "../../components/list-state-store.js";
+import { parseStoredListStateJson } from "../../hooks/list-state-schema.js";
+const KEY_PREFIX = "kumiko.list.";
+const IDENTITY_KEY = `${KEY_PREFIX}identity`;
+const NO_TENANT = "-";
+function identityMarker(identity) {
+    return `${identity.tenantId ?? NO_TENANT}.${identity.userId}`;
+}
+function openSessionStorage() {
+    try {
+        return typeof window === "undefined" ? undefined : window.sessionStorage;
+    }
+    catch {
+        // Access itself throws when storage is blocked (privacy modes, sandboxed frames).
+        return undefined;
+    }
+}
+function prefixedKeys(storage) {
+    return Array.from({ length: storage.length }, (_, index) => storage.key(index)).filter((key) => key !== null && key.startsWith(KEY_PREFIX));
+}
+function removeAllRemembered(storage) {
+    for (const key of prefixedKeys(storage))
+        storage.removeItem(key);
+}
+/** Remembered list state for the lifetime of the browser tab, keyed per tenant
+ *  and user. Every storage failure (blocked, full) degrades to "nothing remembered". */
+export function createSessionListStateStore(storage, identity) {
+    const keyPrefix = `${KEY_PREFIX}${identityMarker(identity)}.`;
+    return {
+        read: (key) => {
+            try {
+                const raw = storage.getItem(`${keyPrefix}${key}`);
+                return raw === null ? undefined : parseStoredListStateJson(raw);
+            }
+            catch {
+                return undefined;
+            }
+        },
+        write: (key, state) => {
+            try {
+                storage.setItem(`${keyPrefix}${key}`, JSON.stringify(state));
+            }
+            catch {
+                // Quota or blocked storage: the list keeps working, it just is not remembered.
+            }
+        },
+        remove: (key) => {
+            try {
+                storage.removeItem(`${keyPrefix}${key}`);
+            }
+            catch {
+                // See write.
+            }
+        },
+        clear: () => {
+            try {
+                for (const key of prefixedKeys(storage).filter((k) => k !== IDENTITY_KEY)) {
+                    storage.removeItem(key);
+                }
+            }
+            catch {
+                // See write.
+            }
+        },
+    };
+}
+/** Forgets all remembered list state and the identity marker. Logout calls it
+ *  before a page reload, which would otherwise hide the identity change. */
+export function clearRememberedListState() {
+    getDefaultMemoryListStateStore().clear();
+    lastMemoryIdentity = undefined;
+    const storage = openSessionStorage();
+    // skip: no sessionStorage available, memory store already cleared
+    if (storage === undefined)
+        return;
+    try {
+        removeAllRemembered(storage);
+    }
+    catch {
+        // See createSessionListStateStore.
+    }
+}
+// The in-memory store survives SPA identity changes, so it needs its own marker.
+let lastMemoryIdentity;
+/** The store for the current identity. State remembered under another identity,
+ *  or under one that has since gone away, is dropped first. Without an identity
+ *  (app without auth) only the in-memory store is used and nothing is persisted. */
+export function resolveListStateStore(identity) {
+    const storage = openSessionStorage();
+    const memory = getDefaultMemoryListStateStore();
+    const marker = identity === undefined ? undefined : identityMarker(identity);
+    if (lastMemoryIdentity !== marker) {
+        if (lastMemoryIdentity !== undefined)
+            memory.clear();
+        lastMemoryIdentity = marker;
+    }
+    if (storage === undefined)
+        return memory;
+    try {
+        const storedMarker = storage.getItem(IDENTITY_KEY);
+        if (marker === undefined) {
+            if (storedMarker !== null) {
+                removeAllRemembered(storage);
+                memory.clear();
+            }
+            return memory;
+        }
+        if (storedMarker !== marker) {
+            removeAllRemembered(storage);
+            storage.setItem(IDENTITY_KEY, marker);
+        }
+    }
+    catch {
+        return memory;
+    }
+    return identity === undefined ? memory : createSessionListStateStore(storage, identity);
+}