@vkma.dev/router 0.0.0-stage → 0.1.1

package/dist/preset/navigator.d.ts

@@ -0,0 +1,75 @@
+import { NavigateOptions } from "@tanstack/react-router";
+//#region src/preset/navigator.d.ts
+/**
+ * The parity navigator over TanStack primitives: push/replace/back/
+ * backToFirst/showModal/hideModal/showPopout/hidePopout. Modal→modal
+ * navigation REPLACES the entry (the host closes one modal before opening
+ * the next — there is no modal stack); back from a modal returns to its
+ * panel. `push`/`replace`/`showModal` accept full TanStack NavigateOptions
+ * — typed by the registered route tree.
+ */
+export interface VkNavigator {
+  push<TParams extends Record<string, string>>(page: PanelPage<TParams>, params: TParams, options?: Omit<NavigateOptions, "to" | "params">): Promise<void>;
+  push(options: NavigateOptions): Promise<void>;
+  replace<TParams extends Record<string, string>>(page: PanelPage<TParams>, params: TParams, options?: Omit<NavigateOptions, "to" | "params">): Promise<void>;
+  replace(options: NavigateOptions): Promise<void>;
+  back(): void;
+  /** Pop all the way to the first history entry. */
+  backToFirst(): void;
+  /** Open a modal route; replaces the entry if another modal is open.
+   * `props` (serializable) land in history.state and are read by
+   * `useModalProps()` inside the modal component. */
+  showModal(options: NavigateOptions & {
+    props?: unknown;
+  }): Promise<void>;
+  /** Close the current modal (back, or replace to the panel on first entry). */
+  hideModal(): void;
+  /**
+   * Open a global (`?modal=<id>`) modal from any panel, masking the URL so
+   * the visible path stays at the panel. Back closes it.
+   */
+  showGlobalModal(id: string, options?: {
+    state?: Record<string, unknown>;
+    props?: unknown;
+  }): Promise<void>;
+  showPopout(id: string, props?: Record<string, unknown>): void;
+  hidePopout(): void;
+  /**
+   * Block navigation while `onLeave` returns true (old router's
+   * `RouteNavigator.block`). The callback receives the current and the
+   * next location plus the action — PUSH/REPLACE as-is, back/forward/go
+   * mapped to POP (old-router `BlockerFunction` parity). Returns the
+   * unblock function.
+   */
+  block(onLeave: (args: BlockerArgs) => boolean): () => void;
+}
+export interface BlockerArgs {
+  /** The location the navigation starts from (TanStack history location). */
+  currentLocation: {
+    href: string;
+    pathname: string;
+  };
+  /** The location the navigation is heading to. */
+  nextLocation: {
+    href: string;
+    pathname: string;
+  };
+  /** PUSH/REPLACE as-is; back, forward and go are one POP (old-router parity). */
+  action: "PUSH" | "REPLACE" | "POP";
+}
+/**
+ * A typed page object — a panel definition (`defineView().panel(...)`) or
+ * a panel handle (`app.panels[...]`). The params type flows from the
+ * definition's phantom `types`, so `navigator.push(postPanel, { id })`
+ * type-checks the params (old-router `Page`/`PageWithParams` parity,
+ * without the `hasParams` discriminator quirk).
+ */
+export interface PanelPage<TParams = Record<string, string>> {
+  path: string;
+  types?: {
+    params: TParams;
+  };
+}
+export declare function useNavigator(): VkNavigator;
+//#endregion
+//# sourceMappingURL=navigator.d.ts.map

package/dist/preset/navigator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigator.d.ts","names":[],"sources":["../../src/preset/navigator.ts"],"mappings":";;;;;;;;;;iBAmBiB;EAChB,KAAK,gBAAgB,wBACpB,MAAM,UAAU,UAChB,QAAQ,SACR,UAAU,KAAK,oCACb;EACH,KAAK,SAAS,kBAAkB;EAChC,QAAQ,gBAAgB,wBACvB,MAAM,UAAU,UAChB,QAAQ,SACR,UAAU,KAAK,oCACb;EACH,QAAQ,SAAS,kBAAkB;EACnC;;EAEA;;;;EAIA,UAAU,SAAS;IAAoB;MAAoB;;EAE3D;;;;;EAKA,gBACC,YACA;IAAY,QAAQ;IAAyB;MAC3C;EACH,WAAW,YAAY,QAAQ;EAC/B;;;;;;;;EAQA,MAAM,UAAU,MAAM;;iBAON;;EAEhB;IAAmB;IAAc;;;EAEjC;IAAgB;IAAc;;;EAE9B;;;;;;;;;iBAUgB,UAAU,UAAU;EACpC;EACA;IAAU,QAAQ;;;wBAGH,gBAAgB"}

package/dist/preset/navigator.js

@@ -0,0 +1,116 @@
+import { MODAL_STATE_KEY } from "../core/state-keys.js";
+import { looseRouteOf } from "../core/loose-route.js";
+import { useHidePopout, useShowPopout } from "../vkui/popouts.js";
+import { useNavigate, useRouter, useRouterState } from "@tanstack/react-router";
+//#region src/preset/navigator.ts
+function isModalRouteId(router, routeId) {
+	return looseRouteOf(router, routeId)?.options.staticData?.modal !== void 0;
+}
+function useNavigator() {
+	const router = useRouter();
+	const navigate = useNavigate();
+	const location = useRouterState({ select: (state) => state.location });
+	const modalOpen = useRouterState({ select: (state) => state.matches.some((match) => isModalRouteId(router, match.routeId)) });
+	const showPopout = useShowPopout();
+	const hidePopout = useHidePopout();
+	/** `"index"` and an optional leading slash normalize to the full path. */
+	const pageTo = (page) => page.path === "index" ? "/" : `/${page.path.replace(/^\//, "")}`;
+	return {
+		push: ((pageOrOptions, params, rest) => params === void 0 ? navigate({
+			...pageOrOptions,
+			replace: false
+		}) : navigate({
+			to: pageTo(pageOrOptions),
+			params,
+			replace: false,
+			...rest
+		})),
+		replace: ((pageOrOptions, params, rest) => params === void 0 ? navigate({
+			...pageOrOptions,
+			replace: true
+		}) : navigate({
+			to: pageTo(pageOrOptions),
+			params,
+			replace: true,
+			...rest
+		})),
+		back: () => {
+			router.history.back();
+		},
+		backToFirst: () => {
+			const index = location.state?.__TSR_index ?? 0;
+			if (index > 0) router.history.go(-index);
+		},
+		showModal: ({ props, ...options }) => {
+			let nested = false;
+			if (modalOpen && typeof options.to === "string") for (let i = router.state.matches.length - 1; i >= 0; i--) {
+				const matchRouteId = router.state.matches[i]?.routeId;
+				if (matchRouteId === void 0) continue;
+				const route = looseRouteOf(router, matchRouteId);
+				if (route?.options.staticData?.modal === void 0) continue;
+				nested = route.fullPath !== void 0 && options.to.startsWith(`${route.fullPath}/`);
+				break;
+			}
+			const withProps = props !== void 0 ? { state: {
+				...options.state,
+				[MODAL_STATE_KEY]: { props }
+			} } : {};
+			return navigate({
+				...options,
+				search: options.search ?? true,
+				replace: nested ? false : modalOpen,
+				...withProps
+			});
+		},
+		hideModal: () => {
+			if (router.history.canGoBack()) {
+				router.history.back();
+				return;
+			}
+			const parentPath = location.pathname.replace(/\/[^/]+$/, "") || "/";
+			router.navigate({
+				href: parentPath,
+				replace: true
+			});
+		},
+		showPopout: (id, props) => {
+			showPopout(id, props);
+		},
+		hidePopout: () => {
+			hidePopout();
+		},
+		showGlobalModal: (id, { state, props, ...rest } = {}) => {
+			const { pathname, searchStr, hash } = router.state.location;
+			const params = new URLSearchParams(searchStr.replace(/^\?/, ""));
+			const already = params.get("modal") === id;
+			params.set("modal", id);
+			const href = `${pathname}?${params.toString()}${hash}`;
+			const maskParams = new URLSearchParams(params);
+			maskParams.delete("modal");
+			const maskQuery = maskParams.toString();
+			const maskHref = `${pathname}${maskQuery !== "" ? `?${maskQuery}` : ""}${hash}`;
+			const nextState = state !== void 0 || props !== void 0 ? { state: {
+				...state,
+				...props !== void 0 ? { [MODAL_STATE_KEY]: { props } } : {}
+			} } : {};
+			return navigate({
+				href,
+				mask: { to: maskHref },
+				replace: already || modalOpen,
+				...rest,
+				...nextState
+			});
+		},
+		block: (onLeave) => {
+			return router.history.block({ blockerFn: (args) => onLeave({
+				currentLocation: args.currentLocation,
+				nextLocation: args.nextLocation,
+				action: args.action === "PUSH" || args.action === "REPLACE" ? args.action : "POP"
+			}) });
+		}
+	};
+}
+//#endregion
+export { useNavigator };
+
+//# sourceMappingURL=navigator.js.map

package/dist/preset/navigator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigator.js","names":[],"sources":["../../src/preset/navigator.ts"],"sourcesContent":["import {\n\tuseNavigate,\n\tuseRouter,\n\tuseRouterState,\n\ttype NavigateOptions,\n} from \"@tanstack/react-router\";\nimport { looseRouteOf } from \"../core/loose-route.ts\";\nimport { MODAL_STATE_KEY } from \"../core/state-keys.ts\";\nimport { useHidePopout, useShowPopout } from \"../vkui/popouts.tsx\";\n\n/**\n * The parity navigator over TanStack primitives: push/replace/back/\n * backToFirst/showModal/hideModal/showPopout/hidePopout. Modal→modal\n * navigation REPLACES the entry (the host closes one modal before opening\n * the next — there is no modal stack); back from a modal returns to its\n * panel. `push`/`replace`/`showModal` accept full TanStack NavigateOptions\n * — typed by the registered route tree.\n */\n\nexport interface VkNavigator {\n\tpush<TParams extends Record<string, string>>(\n\t\tpage: PanelPage<TParams>,\n\t\tparams: TParams,\n\t\toptions?: Omit<NavigateOptions, \"to\" | \"params\">,\n\t): Promise<void>;\n\tpush(options: NavigateOptions): Promise<void>;\n\treplace<TParams extends Record<string, string>>(\n\t\tpage: PanelPage<TParams>,\n\t\tparams: TParams,\n\t\toptions?: Omit<NavigateOptions, \"to\" | \"params\">,\n\t): Promise<void>;\n\treplace(options: NavigateOptions): Promise<void>;\n\tback(): void;\n\t/** Pop all the way to the first history entry. */\n\tbackToFirst(): void;\n\t/** Open a modal route; replaces the entry if another modal is open.\n\t * `props` (serializable) land in history.state and are read by\n\t * `useModalProps()` inside the modal component. */\n\tshowModal(options: NavigateOptions & { props?: unknown }): Promise<void>;\n\t/** Close the current modal (back, or replace to the panel on first entry). */\n\thideModal(): void;\n\t/**\n\t * Open a global (`?modal=<id>`) modal from any panel, masking the URL so\n\t * the visible path stays at the panel. Back closes it.\n\t */\n\tshowGlobalModal(\n\t\tid: string,\n\t\toptions?: { state?: Record<string, unknown>; props?: unknown },\n\t): Promise<void>;\n\tshowPopout(id: string, props?: Record<string, unknown>): void;\n\thidePopout(): void;\n\t/**\n\t * Block navigation while `onLeave` returns true (old router's\n\t * `RouteNavigator.block`). The callback receives the current and the\n\t * next location plus the action — PUSH/REPLACE as-is, back/forward/go\n\t * mapped to POP (old-router `BlockerFunction` parity). Returns the\n\t * unblock function.\n\t */\n\tblock(onLeave: (args: BlockerArgs) => boolean): () => void;\n}\n\nfunction isModalRouteId(router: ReturnType<typeof useRouter>, routeId: string): boolean {\n\treturn looseRouteOf(router, routeId)?.options.staticData?.modal !== undefined;\n}\n\nexport interface BlockerArgs {\n\t/** The location the navigation starts from (TanStack history location). */\n\tcurrentLocation: { href: string; pathname: string };\n\t/** The location the navigation is heading to. */\n\tnextLocation: { href: string; pathname: string };\n\t/** PUSH/REPLACE as-is; back, forward and go are one POP (old-router parity). */\n\taction: \"PUSH\" | \"REPLACE\" | \"POP\";\n}\n\n/**\n * A typed page object — a panel definition (`defineView().panel(...)`) or\n * a panel handle (`app.panels[...]`). The params type flows from the\n * definition's phantom `types`, so `navigator.push(postPanel, { id })`\n * type-checks the params (old-router `Page`/`PageWithParams` parity,\n * without the `hasParams` discriminator quirk).\n */\nexport interface PanelPage<TParams = Record<string, string>> {\n\tpath: string;\n\ttypes?: { params: TParams };\n}\n\nexport function useNavigator(): VkNavigator {\n\tconst router = useRouter();\n\tconst navigate = useNavigate();\n\tconst location = useRouterState({ select: state => state.location });\n\tconst modalOpen = useRouterState({\n\t\tselect: state => state.matches.some(match => isModalRouteId(router, match.routeId)),\n\t});\n\tconst showPopout = useShowPopout();\n\tconst hidePopout = useHidePopout();\n\n\t/** `\"index\"` and an optional leading slash normalize to the full path. */\n\tconst pageTo = (page: PanelPage): string =>\n\t\tpage.path === \"index\" ? \"/\" : `/${page.path.replace(/^\\//, \"\")}`;\n\n\treturn {\n\t\tpush: ((\n\t\t\tpageOrOptions: NavigateOptions | PanelPage,\n\t\t\tparams?: Record<string, string>,\n\t\t\trest?: Omit<NavigateOptions, \"to\" | \"params\">,\n\t\t) =>\n\t\t\tparams === undefined\n\t\t\t\t? navigate({\n\t\t\t\t\t\t...(pageOrOptions as NavigateOptions),\n\t\t\t\t\t\treplace: false,\n\t\t\t\t\t})\n\t\t\t\t: navigate({\n\t\t\t\t\t\tto: pageTo(pageOrOptions as PanelPage),\n\t\t\t\t\t\tparams,\n\t\t\t\t\t\treplace: false,\n\t\t\t\t\t\t...rest,\n\t\t\t\t\t})) as VkNavigator[\"push\"],\n\t\treplace: ((\n\t\t\tpageOrOptions: NavigateOptions | PanelPage,\n\t\t\tparams?: Record<string, string>,\n\t\t\trest?: Omit<NavigateOptions, \"to\" | \"params\">,\n\t\t) =>\n\t\t\tparams === undefined\n\t\t\t\t? navigate({\n\t\t\t\t\t\t...(pageOrOptions as NavigateOptions),\n\t\t\t\t\t\treplace: true,\n\t\t\t\t\t})\n\t\t\t\t: navigate({\n\t\t\t\t\t\tto: pageTo(pageOrOptions as PanelPage),\n\t\t\t\t\t\tparams,\n\t\t\t\t\t\treplace: true,\n\t\t\t\t\t\t...rest,\n\t\t\t\t\t})) as VkNavigator[\"replace\"],\n\t\tback: () => {\n\t\t\trouter.history.back();\n\t\t},\n\t\tbackToFirst: () => {\n\t\t\tconst index =\n\t\t\t\t(location.state as { __TSR_index?: number } | undefined)?.__TSR_index ?? 0;\n\t\t\tif (index > 0) {\n\t\t\t\trouter.history.go(-index);\n\t\t\t}\n\t\t},\n\t\tshowModal: ({ props, ...options }) => {\n\t\t\t// nested modal: the target route is a CHILD of the currently open\n\t\t\t// modal — PUSH (back unwinds the stack); sibling modals keep the\n\t\t\t// old-router replace parity\n\t\t\tlet nested = false;\n\t\t\tif (modalOpen && typeof options.to === \"string\") {\n\t\t\t\tfor (let i = router.state.matches.length - 1; i >= 0; i--) {\n\t\t\t\t\tconst matchRouteId = router.state.matches[i]?.routeId;\n\t\t\t\t\tif (matchRouteId === undefined) {\n\t\t\t\t\t\tcontinue;\n\t\t\t\t\t}\n\t\t\t\t\tconst route = looseRouteOf(router, matchRouteId);\n\t\t\t\t\tif (route?.options.staticData?.modal === undefined) {\n\t\t\t\t\t\tcontinue;\n\t\t\t\t\t}\n\t\t\t\t\tnested =\n\t\t\t\t\t\troute.fullPath !== undefined && options.to.startsWith(`${route.fullPath}/`);\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t\t// TanStack types history state as its own updater shape — arbitrary\n\t\t\t// serializable keys go through a cast (same as the popout state)\n\t\t\tconst withProps =\n\t\t\t\tprops !== undefined\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tstate: {\n\t\t\t\t\t\t\t\t...(options.state as Record<string, unknown> | undefined),\n\t\t\t\t\t\t\t\t[MODAL_STATE_KEY]: { props },\n\t\t\t\t\t\t\t} as never,\n\t\t\t\t\t\t}\n\t\t\t\t\t: {};\n\t\t\treturn navigate({\n\t\t\t\t...options,\n\t\t\t\t// a modal open never changes the panel behind it — carry the\n\t\t\t\t// panel's search (?tab=…) onto the modal entry, or the covered\n\t\t\t\t// panel would snap to its default search for the whole time the\n\t\t\t\t// modal is open (and snap back on close). An explicit `search`\n\t\t\t\t// from the caller always wins.\n\t\t\t\tsearch: options.search ?? true,\n\t\t\t\treplace: nested ? false : modalOpen,\n\t\t\t\t...withProps,\n\t\t\t});\n\t\t},\n\t\thideModal: () => {\n\t\t\tif (router.history.canGoBack()) {\n\t\t\t\trouter.history.back();\n\t\t\t\treturn;\n\t\t\t}\n\t\t\t// deep-linked modal on the first entry: replace down to the panel\n\t\t\tconst parentPath = location.pathname.replace(/\\/[^/]+$/, \"\") || \"/\";\n\t\t\tvoid router.navigate({ href: parentPath, replace: true });\n\t\t},\n\t\tshowPopout: (id, props) => {\n\t\t\tshowPopout(id, props);\n\t\t},\n\t\thidePopout: () => {\n\t\t\thidePopout();\n\t\t},\n\t\tshowGlobalModal: (id, { state, props, ...rest } = {}) => {\n\t\t\tconst { pathname, searchStr, hash } = router.state.location;\n\t\t\tconst params = new URLSearchParams(searchStr.replace(/^\\?/, \"\"));\n\t\t\tconst already = params.get(\"modal\") === id;\n\t\t\tparams.set(\"modal\", id);\n\t\t\tconst href = `${pathname}?${params.toString()}${hash}`;\n\t\t\t// the mask keeps the visible URL at the panel path while the modal\n\t\t\t// is open (the modal param rides in history.state)\n\t\t\tconst maskParams = new URLSearchParams(params);\n\t\t\tmaskParams.delete(\"modal\");\n\t\t\tconst maskQuery = maskParams.toString();\n\t\t\tconst maskHref = `${pathname}${maskQuery !== \"\" ? `?${maskQuery}` : \"\"}${hash}`;\n\t\t\tconst nextState =\n\t\t\t\tstate !== undefined || props !== undefined\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tstate: {\n\t\t\t\t\t\t\t\t...state,\n\t\t\t\t\t\t\t\t...(props !== undefined ? { [MODAL_STATE_KEY]: { props } } : {}),\n\t\t\t\t\t\t\t} as never,\n\t\t\t\t\t\t}\n\t\t\t\t\t: {};\n\t\t\treturn navigate({\n\t\t\t\thref,\n\t\t\t\tmask: { to: maskHref },\n\t\t\t\treplace: already || modalOpen,\n\t\t\t\t...rest,\n\t\t\t\t...nextState,\n\t\t\t});\n\t\t},\n\t\tblock: onLeave => {\n\t\t\tconst unblock = router.history.block({\n\t\t\t\t// args infer as TanStack's BlockerFnArgs (HistoryLocation × 2 +\n\t\t\t\t// action) — assignable to our structural BlockerArgs\n\t\t\t\tblockerFn: args =>\n\t\t\t\t\tonLeave({\n\t\t\t\t\t\tcurrentLocation: args.currentLocation,\n\t\t\t\t\t\tnextLocation: args.nextLocation,\n\t\t\t\t\t\t// TanStack distinguishes BACK/FORWARD/GO; the old router's\n\t\t\t\t\t\t// BlockerFunction saw one POP — keep the parity\n\t\t\t\t\t\taction:\n\t\t\t\t\t\t\targs.action === \"PUSH\" || args.action === \"REPLACE\"\n\t\t\t\t\t\t\t\t? args.action\n\t\t\t\t\t\t\t\t: \"POP\",\n\t\t\t\t\t}),\n\t\t\t});\n\t\t\treturn unblock;\n\t\t},\n\t};\n}\n"],"mappings":"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"}

package/dist/preset.d.ts

@@ -0,0 +1,17 @@
+import { createVkHistory } from "./core/vk-history.js";
+import { VkBridgeLike, normalizeBridgeEvent } from "./core/bridge-like.js";
+import { createBridgeSync } from "./core/bridge-sync.js";
+import { createSwipeBackManager } from "./core/swipe-back.js";
+import { ModalCardSurface, ModalEntry, ModalPageSurface, Modals } from "./vkui/modals.js";
+import { Popouts, useHidePopout, usePopoutState, useShowPopout } from "./vkui/popouts.js";
+import { PanelDefinition, definePanel, panelRouteId } from "./preset/define-panel.js";
+import { ViewDefinition, defineView } from "./preset/define-view.js";
+import { AppHandle, AppOptions, ModalComponent, ModalDeclaration, ModalEntryComponent, PanelHandle, PanelHandlesOf, PanelOptions, TypedAppHandle, ViewOptions, createApp, panel } from "./preset/builders.js";
+import { AppRootShell, useActiveStory, useInflate } from "./preset/app.js";
+import { deriveInflateChain } from "./preset/inflate.js";
+import { VkNavigator, useNavigator } from "./preset/navigator.js";
+import { VkView } from "./vkui/vk-view.js";
+import { NotFound } from "./vkui/not-found.js";
+import "./vkui.js";
+import { PanelRef, useEnableSwipeBack, useModalProps, usePanelLoaderData, usePanelParams, usePanelSearch, usePanelsHistory } from "./react/hooks.js";
+export { type AppHandle, type AppOptions, AppRootShell, ModalCardSurface, type ModalComponent, type ModalDeclaration, type ModalEntry, type ModalEntryComponent, ModalPageSurface, Modals, NotFound, type PanelDefinition, type PanelHandle, type PanelHandlesOf, type PanelOptions, type PanelRef, Popouts, type TypedAppHandle, type ViewDefinition, type ViewOptions, type VkBridgeLike, type VkNavigator, VkView, createApp, createBridgeSync, createSwipeBackManager, createVkHistory, definePanel, defineView, deriveInflateChain, normalizeBridgeEvent, panel, panelRouteId, useActiveStory, useEnableSwipeBack, useHidePopout, useInflate, useModalProps, useNavigator, usePanelLoaderData, usePanelParams, usePanelSearch, usePanelsHistory, usePopoutState, useShowPopout };

package/dist/preset.js

@@ -0,0 +1,16 @@
+import { createVkHistory } from "./core/vk-history.js";
+import { normalizeBridgeEvent } from "./core/bridge-like.js";
+import { createBridgeSync } from "./core/bridge-sync.js";
+import { createSwipeBackManager } from "./core/swipe-back.js";
+import { useEnableSwipeBack, useModalProps, usePanelLoaderData, usePanelParams, usePanelSearch, usePanelsHistory } from "./react/hooks.js";
+import { VkView } from "./vkui/vk-view.js";
+import { ModalCardSurface, ModalPageSurface, Modals } from "./vkui/modals.js";
+import { Popouts, useHidePopout, usePopoutState, useShowPopout } from "./vkui/popouts.js";
+import { NotFound } from "./vkui/not-found.js";
+import { deriveInflateChain } from "./preset/inflate.js";
+import { AppRootShell, useActiveStory, useInflate } from "./preset/app.js";
+import { definePanel, panelRouteId } from "./preset/define-panel.js";
+import { defineView } from "./preset/define-view.js";
+import { createApp, panel } from "./preset/builders.js";
+import { useNavigator } from "./preset/navigator.js";
+export { AppRootShell, ModalCardSurface, ModalPageSurface, Modals, NotFound, Popouts, VkView, createApp, createBridgeSync, createSwipeBackManager, createVkHistory, definePanel, defineView, deriveInflateChain, normalizeBridgeEvent, panel, panelRouteId, useActiveStory, useEnableSwipeBack, useHidePopout, useInflate, useModalProps, useNavigator, usePanelLoaderData, usePanelParams, usePanelSearch, usePanelsHistory, usePopoutState, useShowPopout };

package/dist/react/hooks.d.ts

@@ -0,0 +1,69 @@
+import { PanelsStackState } from "../core/panels-stack.js";
+//#region src/react/hooks.d.ts
+/**
+ * The departing-panel freeze (spike 1): raw TanStack data hooks throw
+ * `Invariant failed: Could not find an active match` when the panel's
+ * route stops matching while VKUI still keeps the panel mounted during the
+ * back animation — the error flies past the router's error boundary and
+ * remounts the whole tree. These hooks never throw and retain the last
+ * resolved value while the panel is mounted but unmatched.
+ *
+ * Pass the TYPED panel handle (`app.panels["feed/post/$id"]`) — params /
+ * search / loaderData are derived from the panel's declared options
+ * (validateSearch return, loader return, $param path segments). A plain
+ * route-id string also works, with loose types.
+ */
+/**
+ * Structural twin of the preset's `PanelHandle` — the phantom `types`
+ * member carries the panel's data types without coupling this layer to
+ * the preset.
+ */
+export interface PanelRef<TParams = Record<string, string>, TSearch = Record<string, unknown>, TLoaderData = unknown> {
+  readonly routeId: string;
+  readonly types?: {
+    params: TParams;
+    search: TSearch;
+    loaderData: TLoaderData;
+  };
+}
+export declare function useLastWhileUndefined<T>(value: T | undefined): T | undefined;
+export declare function usePanelParams<P extends Record<string, string>>(ref: PanelRef<P | undefined, any, any>): P;
+export declare function usePanelParams(from: string): Record<string, string>;
+export declare function usePanelSearch<S>(ref: PanelRef<any, S | undefined, any>): S | undefined;
+export declare function usePanelSearch(from: string): Record<string, unknown>;
+export declare function usePanelLoaderData<D>(ref: PanelRef<any, any, D | undefined>): D | undefined;
+export declare function usePanelLoaderData(from: string): unknown;
+/**
+ * Runtime props of the open modal — `showModal({ to, params, props })` /
+ * `showGlobalModal(id, { props })` stash them in `history.state` (so they
+ * survive reload and back/forward) and the modal entry component reads them
+ * here. Serializable values only (structured clone); same freeze semantics
+ * as the panel hooks — the departing modal keeps its last props while it
+ * animates out.
+ */
+export declare function useModalProps<T = unknown>(): T | undefined;
+/**
+ * Mirror of the history stack in panel ids, driven by `__TSR_index`.
+ * Applies only when the router is idle — between the location commit and
+ * the match resolution there is an intermediate render with a stale
+ * activePanel (spike 1: `[home, home]` flash, self-healed by the
+ * replace-on-same-index rule).
+ */
+export declare function usePanelsStack(activePanel: string): PanelsStackState;
+/** VKUI `View.history` prop: panels in open order. */
+export declare function usePanelsHistory(activePanel: string): string[];
+/**
+ * The old router's `useEnableSwipeBack`: override the automatic
+ * swipe-back decision while it applies. Panels are permanently mounted
+ * static children here, so pass the panel ref — the override applies only
+ * while that panel is the deepest matched one and is released when the
+ * user navigates away. Without a ref the override is app-global.
+ *
+ * `false` turns the native gesture off (drawing pads, drag surfaces);
+ * `true` forces it on even on the first entry (the system back then
+ * closes the app — you asked for it). `createSwipeBackManager({
+ * enabled: false })` is the hard opt-out that wins over this hook.
+ */
+export declare function useEnableSwipeBack(enabled: boolean, ref?: PanelRef | string): void;
+//#endregion
+//# sourceMappingURL=hooks.d.ts.map

package/dist/react/hooks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.d.ts","names":[],"sources":["../../src/react/hooks.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;iBA+BiB,SAChB,UAAU,wBACV,UAAU,yBACV;WAES;WACA;IAAU,QAAQ;IAAS,QAAQ;IAAS,YAAY;;;wBAGlD,sBAAsB,GAAG,OAAO,gBAAgB;wBAoBhD,eAAe,UAAU,wBACxC,KAAK,SAAS,2BACZ;wBACa,eAAe,eAAe;wBAK9B,eAAe,GAAG,KAAK,cAAc,sBAAsB;wBAC3D,eAAe,eAAe;wBAK9B,mBAAmB,GAAG,KAAK,mBAAmB,iBAAiB;wBAC/D,mBAAmB;;;;;;;;;wBAanB,cAAc,gBAAgB;;;;;;;;wBAY9B,eAAe,sBAAsB;;wBAkBrC,iBAAiB;;;;;;;;;;;;;wBAsCjB,mBAAmB,kBAAkB,MAAM"}

package/dist/react/hooks.js

@@ -0,0 +1,101 @@
+import { applyLocation, initialPanelsStack, panelsHistoryOf } from "../core/panels-stack.js";
+import { readModalState } from "../core/state-keys.js";
+import { setSwipeBackOverride } from "../core/swipe-back.js";
+import { looseRouteOf } from "../core/loose-route.js";
+import { useMatch, useRouter, useRouterState } from "@tanstack/react-router";
+import { useEffect, useRef } from "react";
+//#region src/react/hooks.ts
+function useLastWhileUndefined(value) {
+	const ref = useRef(value);
+	if (value !== void 0) ref.current = value;
+	return value === void 0 ? ref.current : value;
+}
+/** Shared body of the panel data hooks — they differ only in the match field. */
+function usePanelMatchField(refOrFrom, field) {
+	const routeId = typeof refOrFrom === "string" ? refOrFrom : refOrFrom.routeId;
+	return useLastWhileUndefined(useMatch({
+		from: routeId,
+		shouldThrow: false
+	})?.[field]);
+}
+function usePanelParams(refOrFrom) {
+	return usePanelMatchField(refOrFrom, "params") ?? {};
+}
+function usePanelSearch(refOrFrom) {
+	return usePanelMatchField(refOrFrom, "search");
+}
+function usePanelLoaderData(refOrFrom) {
+	return usePanelMatchField(refOrFrom, "loaderData");
+}
+/**
+* Runtime props of the open modal — `showModal({ to, params, props })` /
+* `showGlobalModal(id, { props })` stash them in `history.state` (so they
+* survive reload and back/forward) and the modal entry component reads them
+* here. Serializable values only (structured clone); same freeze semantics
+* as the panel hooks — the departing modal keeps its last props while it
+* animates out.
+*/
+function useModalProps() {
+	return useLastWhileUndefined(useRouterState({ select: (state) => readModalState(state.location.state) })?.props);
+}
+/**
+* Mirror of the history stack in panel ids, driven by `__TSR_index`.
+* Applies only when the router is idle — between the location commit and
+* the match resolution there is an intermediate render with a stale
+* activePanel (spike 1: `[home, home]` flash, self-healed by the
+* replace-on-same-index rule).
+*/
+function usePanelsStack(activePanel) {
+	const snapshot = useRouterState({ select: (state) => ({
+		status: state.status,
+		index: state.location.state?.__TSR_index ?? null
+	}) });
+	const ref = useRef(initialPanelsStack());
+	if (snapshot.status === "idle") ref.current = applyLocation(ref.current, snapshot.index, activePanel);
+	return ref.current;
+}
+/** VKUI `View.history` prop: panels in open order. */
+function usePanelsHistory(activePanel) {
+	return panelsHistoryOf(usePanelsStack(activePanel));
+}
+/**
+* The deepest matched panel's route id — what "the active panel" means
+* when every panel is a permanently mounted static child.
+*/
+function useActivePanelRouteId() {
+	const router = useRouter();
+	return useRouterState({ select: (state) => {
+		for (let i = state.matches.length - 1; i >= 0; i--) {
+			const routeId = state.matches[i]?.routeId;
+			if (routeId === void 0) continue;
+			if (looseRouteOf(router, routeId)?.options.staticData?.panel !== void 0) return routeId;
+		}
+		return null;
+	} });
+}
+/**
+* The old router's `useEnableSwipeBack`: override the automatic
+* swipe-back decision while it applies. Panels are permanently mounted
+* static children here, so pass the panel ref — the override applies only
+* while that panel is the deepest matched one and is released when the
+* user navigates away. Without a ref the override is app-global.
+*
+* `false` turns the native gesture off (drawing pads, drag surfaces);
+* `true` forces it on even on the first entry (the system back then
+* closes the app — you asked for it). `createSwipeBackManager({
+* enabled: false })` is the hard opt-out that wins over this hook.
+*/
+function useEnableSwipeBack(enabled, ref) {
+	const activeRouteId = useActivePanelRouteId();
+	const routeId = typeof ref === "string" ? ref : ref?.routeId;
+	const applies = ref === void 0 ? true : routeId !== void 0 && routeId === activeRouteId;
+	useEffect(() => {
+		if (!applies) return;
+		setSwipeBackOverride(enabled);
+		return () => setSwipeBackOverride(null);
+	}, [applies, enabled]);
+}
+//#endregion
+export { useEnableSwipeBack, useLastWhileUndefined, useModalProps, usePanelLoaderData, usePanelParams, usePanelSearch, usePanelsHistory, usePanelsStack };
+
+//# sourceMappingURL=hooks.js.map

package/dist/react/hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.js","names":[],"sources":["../../src/react/hooks.ts"],"sourcesContent":["import { useMatch, useRouter, useRouterState } from \"@tanstack/react-router\";\nimport { useEffect, useRef } from \"react\";\nimport { looseRouteOf } from \"../core/loose-route.ts\";\nimport {\n\tapplyLocation,\n\tinitialPanelsStack,\n\ttype PanelsStackState,\n\tpanelsHistoryOf,\n} from \"../core/panels-stack.ts\";\nimport { readModalState } from \"../core/state-keys.ts\";\nimport { setSwipeBackOverride } from \"../core/swipe-back.ts\";\n\n/**\n * The departing-panel freeze (spike 1): raw TanStack data hooks throw\n * `Invariant failed: Could not find an active match` when the panel's\n * route stops matching while VKUI still keeps the panel mounted during the\n * back animation — the error flies past the router's error boundary and\n * remounts the whole tree. These hooks never throw and retain the last\n * resolved value while the panel is mounted but unmatched.\n *\n * Pass the TYPED panel handle (`app.panels[\"feed/post/$id\"]`) — params /\n * search / loaderData are derived from the panel's declared options\n * (validateSearch return, loader return, $param path segments). A plain\n * route-id string also works, with loose types.\n */\n\n/**\n * Structural twin of the preset's `PanelHandle` — the phantom `types`\n * member carries the panel's data types without coupling this layer to\n * the preset.\n */\nexport interface PanelRef<\n\tTParams = Record<string, string>,\n\tTSearch = Record<string, unknown>,\n\tTLoaderData = unknown,\n> {\n\treadonly routeId: string;\n\treadonly types?: { params: TParams; search: TSearch; loaderData: TLoaderData };\n}\n\nexport function useLastWhileUndefined<T>(value: T | undefined): T | undefined {\n\tconst ref = useRef(value);\n\tif (value !== undefined) {\n\t\tref.current = value;\n\t}\n\treturn value === undefined ? ref.current : value;\n}\n\n/** Shared body of the panel data hooks — they differ only in the match field. */\nfunction usePanelMatchField(\n\trefOrFrom: PanelRef | string,\n\tfield: \"params\" | \"search\" | \"loaderData\",\n): unknown {\n\tconst routeId = typeof refOrFrom === \"string\" ? refOrFrom : refOrFrom.routeId;\n\tconst match = useMatch({ from: routeId, shouldThrow: false } as never);\n\treturn useLastWhileUndefined(\n\t\t(match as unknown as Record<string, unknown> | undefined)?.[field],\n\t);\n}\n\nexport function usePanelParams<P extends Record<string, string>>(\n\tref: PanelRef<P | undefined, any, any>,\n): P;\nexport function usePanelParams(from: string): Record<string, string>;\nexport function usePanelParams(refOrFrom: PanelRef | string): unknown {\n\treturn usePanelMatchField(refOrFrom, \"params\") ?? {};\n}\n\nexport function usePanelSearch<S>(ref: PanelRef<any, S | undefined, any>): S | undefined;\nexport function usePanelSearch(from: string): Record<string, unknown>;\nexport function usePanelSearch(refOrFrom: PanelRef | string): unknown {\n\treturn usePanelMatchField(refOrFrom, \"search\");\n}\n\nexport function usePanelLoaderData<D>(ref: PanelRef<any, any, D | undefined>): D | undefined;\nexport function usePanelLoaderData(from: string): unknown;\nexport function usePanelLoaderData(refOrFrom: PanelRef | string): unknown {\n\treturn usePanelMatchField(refOrFrom, \"loaderData\");\n}\n\n/**\n * Runtime props of the open modal — `showModal({ to, params, props })` /\n * `showGlobalModal(id, { props })` stash them in `history.state` (so they\n * survive reload and back/forward) and the modal entry component reads them\n * here. Serializable values only (structured clone); same freeze semantics\n * as the panel hooks — the departing modal keeps its last props while it\n * animates out.\n */\nexport function useModalProps<T = unknown>(): T | undefined {\n\tconst modal = useRouterState({ select: state => readModalState(state.location.state) });\n\treturn useLastWhileUndefined(modal?.props) as T | undefined;\n}\n\n/**\n * Mirror of the history stack in panel ids, driven by `__TSR_index`.\n * Applies only when the router is idle — between the location commit and\n * the match resolution there is an intermediate render with a stale\n * activePanel (spike 1: `[home, home]` flash, self-healed by the\n * replace-on-same-index rule).\n */\nexport function usePanelsStack(activePanel: string): PanelsStackState {\n\tconst snapshot = useRouterState({\n\t\tselect: state => ({\n\t\t\tstatus: state.status,\n\t\t\tindex:\n\t\t\t\t(state.location.state as { __TSR_index?: number } | undefined)?.__TSR_index ?? null,\n\t\t}),\n\t});\n\tconst ref = useRef<PanelsStackState>(initialPanelsStack());\n\n\tif (snapshot.status === \"idle\") {\n\t\tref.current = applyLocation(ref.current, snapshot.index, activePanel);\n\t}\n\n\treturn ref.current;\n}\n\n/** VKUI `View.history` prop: panels in open order. */\nexport function usePanelsHistory(activePanel: string): string[] {\n\treturn panelsHistoryOf(usePanelsStack(activePanel));\n}\n\n/**\n * The deepest matched panel's route id — what \"the active panel\" means\n * when every panel is a permanently mounted static child.\n */\nfunction useActivePanelRouteId(): string | null {\n\tconst router = useRouter();\n\treturn useRouterState({\n\t\tselect: (state): string | null => {\n\t\t\tfor (let i = state.matches.length - 1; i >= 0; i--) {\n\t\t\t\tconst routeId = state.matches[i]?.routeId;\n\t\t\t\tif (routeId === undefined) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\t\t\t\tif (looseRouteOf(router, routeId)?.options.staticData?.panel !== undefined) {\n\t\t\t\t\treturn routeId;\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn null;\n\t\t},\n\t});\n}\n\n/**\n * The old router's `useEnableSwipeBack`: override the automatic\n * swipe-back decision while it applies. Panels are permanently mounted\n * static children here, so pass the panel ref — the override applies only\n * while that panel is the deepest matched one and is released when the\n * user navigates away. Without a ref the override is app-global.\n *\n * `false` turns the native gesture off (drawing pads, drag surfaces);\n * `true` forces it on even on the first entry (the system back then\n * closes the app — you asked for it). `createSwipeBackManager({\n * enabled: false })` is the hard opt-out that wins over this hook.\n */\nexport function useEnableSwipeBack(enabled: boolean, ref?: PanelRef | string): void {\n\tconst activeRouteId = useActivePanelRouteId();\n\tconst routeId = typeof ref === \"string\" ? ref : ref?.routeId;\n\tconst applies = ref === undefined ? true : routeId !== undefined && routeId === activeRouteId;\n\tuseEffect(() => {\n\t\tif (!applies) {\n\t\t\treturn;\n\t\t}\n\t\tsetSwipeBackOverride(enabled);\n\t\treturn () => setSwipeBackOverride(null);\n\t}, [applies, enabled]);\n}\n"],"mappings":";;;;;;;AAwCA,SAAgB,sBAAyB,OAAqC;CAC7E,MAAM,MAAM,OAAO,KAAK;CACxB,IAAI,UAAU,KAAA,GACb,IAAI,UAAU;CAEf,OAAO,UAAU,KAAA,IAAY,IAAI,UAAU;AAC5C;;AAGA,SAAS,mBACR,WACA,OACU;CACV,MAAM,UAAU,OAAO,cAAc,WAAW,YAAY,UAAU;CAEtE,OAAO,sBADO,SAAS;EAAE,MAAM;EAAS,aAAa;CAAM,CAErD,CAAC,GAAsD,MAC7D;AACD;AAMA,SAAgB,eAAe,WAAuC;CACrE,OAAO,mBAAmB,WAAW,QAAQ,KAAK,CAAC;AACpD;AAIA,SAAgB,eAAe,WAAuC;CACrE,OAAO,mBAAmB,WAAW,QAAQ;AAC9C;AAIA,SAAgB,mBAAmB,WAAuC;CACzE,OAAO,mBAAmB,WAAW,YAAY;AAClD;;;;;;;;;AAUA,SAAgB,gBAA4C;CAE3D,OAAO,sBADO,eAAe,EAAE,SAAQ,UAAS,eAAe,MAAM,SAAS,KAAK,EAAE,CACpD,CAAC,EAAE,KAAK;AAC1C;;;;;;;;AASA,SAAgB,eAAe,aAAuC;CACrE,MAAM,WAAW,eAAe,EAC/B,SAAQ,WAAU;EACjB,QAAQ,MAAM;EACd,OACE,MAAM,SAAS,OAAgD,eAAe;CACjF,GACD,CAAC;CACD,MAAM,MAAM,OAAyB,mBAAmB,CAAC;CAEzD,IAAI,SAAS,WAAW,QACvB,IAAI,UAAU,cAAc,IAAI,SAAS,SAAS,OAAO,WAAW;CAGrE,OAAO,IAAI;AACZ;;AAGA,SAAgB,iBAAiB,aAA+B;CAC/D,OAAO,gBAAgB,eAAe,WAAW,CAAC;AACnD;;;;;AAMA,SAAS,wBAAuC;CAC/C,MAAM,SAAS,UAAU;CACzB,OAAO,eAAe,EACrB,SAAS,UAAyB;EACjC,KAAK,IAAI,IAAI,MAAM,QAAQ,SAAS,GAAG,KAAK,GAAG,KAAK;GACnD,MAAM,UAAU,MAAM,QAAQ,EAAE,EAAE;GAClC,IAAI,YAAY,KAAA,GACf;GAED,IAAI,aAAa,QAAQ,OAAO,CAAC,EAAE,QAAQ,YAAY,UAAU,KAAA,GAChE,OAAO;EAET;EACA,OAAO;CACR,EACD,CAAC;AACF;;;;;;;;;;;;;AAcA,SAAgB,mBAAmB,SAAkB,KAA+B;CACnF,MAAM,gBAAgB,sBAAsB;CAC5C,MAAM,UAAU,OAAO,QAAQ,WAAW,MAAM,KAAK;CACrD,MAAM,UAAU,QAAQ,KAAA,IAAY,OAAO,YAAY,KAAA,KAAa,YAAY;CAChF,gBAAgB;EACf,IAAI,CAAC,SACJ;EAED,qBAAqB,OAAO;EAC5B,aAAa,qBAAqB,IAAI;CACvC,GAAG,CAAC,SAAS,OAAO,CAAC;AACtB"}

package/dist/react.d.ts

@@ -0,0 +1,2 @@
+import { PanelRef, useEnableSwipeBack, useLastWhileUndefined, useModalProps, usePanelLoaderData, usePanelParams, usePanelSearch, usePanelsHistory, usePanelsStack } from "./react/hooks.js";
+export { type PanelRef, useEnableSwipeBack, useLastWhileUndefined, useModalProps, usePanelLoaderData, usePanelParams, usePanelSearch, usePanelsHistory, usePanelsStack };

package/dist/react.js

@@ -0,0 +1 @@
+export { useEnableSwipeBack, useLastWhileUndefined, useModalProps, usePanelLoaderData, usePanelParams, usePanelSearch, usePanelsHistory, usePanelsStack } from "./react/hooks.js";

package/dist/vkui/choreography.js

@@ -0,0 +1,59 @@
+//#region src/vkui/choreography.ts
+const idleChoreography = () => ({
+	target: null,
+	stack: [],
+	exiting: null,
+	awaitingExitId: null
+});
+function reconcile(previous, target) {
+	if (previous.awaitingExitId !== null) {
+		const exiting = previous.exiting;
+		if (exiting !== null && target?.id === exiting.id) return {
+			...previous,
+			target,
+			stack: [...previous.stack, exiting],
+			exiting: null,
+			awaitingExitId: null
+		};
+		return {
+			...previous,
+			target
+		};
+	}
+	const top = previous.stack[previous.stack.length - 1] ?? null;
+	if (top === null) return target === null ? {
+		...previous,
+		target: null
+	} : {
+		...previous,
+		target,
+		stack: [target]
+	};
+	if (target !== null && target.id === top.id) return {
+		...previous,
+		target
+	};
+	if (target !== null && target.routeId.startsWith(`${top.routeId}/`)) return {
+		...previous,
+		target,
+		stack: [...previous.stack, target]
+	};
+	if (target !== null && top.routeId.startsWith(`${target.routeId}/`)) return {
+		...previous,
+		target,
+		stack: previous.stack.slice(0, -1),
+		exiting: top,
+		awaitingExitId: top.id
+	};
+	return {
+		...previous,
+		target,
+		stack: previous.stack.slice(0, -1),
+		exiting: top,
+		awaitingExitId: top.id
+	};
+}
+//#endregion
+export { idleChoreography, reconcile };
+
+//# sourceMappingURL=choreography.js.map

package/dist/vkui/choreography.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"choreography.js","names":[],"sources":["../../src/vkui/choreography.ts"],"sourcesContent":["/**\n * Modal choreography state machine — pure, React-free; the `<Modals>` host\n * in `modals.tsx` drives it and completes exits from the surface's\n * `onClosed`. One step per reconcile: every close is an animated exit whose\n * completion triggers the next step. Route ids are hierarchical\n * (`/view:feed/post/$id/comments`), so the nested/sibling relation is a\n * string prefix check.\n *\n * - a SIBLING retarget (comments → share) closes the displayed sheet first\n *   and opens the new one only after the exit completes — never two sibling\n *   sheets at once (the user-reported bug from the first spike);\n * - a NESTED open (the target is a child route of the displayed modal)\n *   keeps the displayed sheet open and stacks the child ON TOP of it — two\n *   open sheets by design; back unwinds the stack one level per entry;\n * - back to the parent modal closes the top and reveals the parent.\n *\n * While an exit is in flight:\n * - retargeting BACK to the exiting sheet CANCELS the exit — VKUI reverses\n *   the transition mid-flight (`open` flips back to `true`), so there is no\n *   close-then-reopen bounce;\n * - any OTHER target is QUEUED: the state's `target` carries the LATEST\n *   router request and the exit's completion re-reconciles toward it.\n *   Dropping it would leave the host showing a modal the router no longer\n *   matches, desynced until the next navigation.\n */\n\ninterface ChoreographyEntry {\n\t/** Modal id — also the VKUI `nav`. */\n\tid: string;\n\t/** Full route id of the modal route. */\n\trouteId: string;\n}\n\nexport interface ChoreographyState<T extends ChoreographyEntry> {\n\t/** the modal route that should be open on top right now */\n\ttarget: T | null;\n\t/** open entries, bottom → top (nested modals stack) */\n\tstack: T[];\n\t/** the entry animating out (mounted with open=false) */\n\texiting: T | null;\n\t/** the exiting id whose `onClosed` completes the transition */\n\tawaitingExitId: string | null;\n}\n\nexport const idleChoreography = <T extends ChoreographyEntry>(): ChoreographyState<T> => ({\n\ttarget: null,\n\tstack: [],\n\texiting: null,\n\tawaitingExitId: null,\n});\n\nexport function reconcile<T extends ChoreographyEntry>(\n\tprevious: ChoreographyState<T>,\n\ttarget: T | null,\n): ChoreographyState<T> {\n\tif (previous.awaitingExitId !== null) {\n\t\tconst exiting = previous.exiting;\n\t\tif (exiting !== null && target?.id === exiting.id) {\n\t\t\t// retargeting the exiting sheet: CANCEL the exit and restore it\n\t\t\treturn {\n\t\t\t\t...previous,\n\t\t\t\ttarget,\n\t\t\t\tstack: [...previous.stack, exiting],\n\t\t\t\texiting: null,\n\t\t\t\tawaitingExitId: null,\n\t\t\t};\n\t\t}\n\t\t// any other target mid-exit: queue it — the exit's completion\n\t\t// (handleClosed) re-reconciles toward this latest request\n\t\treturn { ...previous, target };\n\t}\n\tconst top = previous.stack[previous.stack.length - 1] ?? null;\n\tif (top === null) {\n\t\treturn target === null\n\t\t\t? { ...previous, target: null }\n\t\t\t: { ...previous, target, stack: [target] };\n\t}\n\tif (target !== null && target.id === top.id) {\n\t\treturn { ...previous, target }; // already on top — settle\n\t}\n\tif (target !== null && target.routeId.startsWith(`${top.routeId}/`)) {\n\t\t// NESTED open: the target is a child route of the displayed modal —\n\t\t// keep it open and stack the child on top\n\t\treturn { ...previous, target, stack: [...previous.stack, target] };\n\t}\n\tif (target !== null && top.routeId.startsWith(`${target.routeId}/`)) {\n\t\t// back to an ANCESTOR modal: close the top, the parent stays open\n\t\treturn {\n\t\t\t...previous,\n\t\t\ttarget,\n\t\t\tstack: previous.stack.slice(0, -1),\n\t\t\texiting: top,\n\t\t\tawaitingExitId: top.id,\n\t\t};\n\t}\n\t// sibling/unrelated modal or close-everything: close the top first —\n\t// the target opens when the exit completes\n\treturn {\n\t\t...previous,\n\t\ttarget,\n\t\tstack: previous.stack.slice(0, -1),\n\t\texiting: top,\n\t\tawaitingExitId: top.id,\n\t};\n}\n"],"mappings":";AA4CA,MAAa,0BAA6E;CACzF,QAAQ;CACR,OAAO,CAAC;CACR,SAAS;CACT,gBAAgB;AACjB;AAEA,SAAgB,UACf,UACA,QACuB;CACvB,IAAI,SAAS,mBAAmB,MAAM;EACrC,MAAM,UAAU,SAAS;EACzB,IAAI,YAAY,QAAQ,QAAQ,OAAO,QAAQ,IAE9C,OAAO;GACN,GAAG;GACH;GACA,OAAO,CAAC,GAAG,SAAS,OAAO,OAAO;GAClC,SAAS;GACT,gBAAgB;EACjB;EAID,OAAO;GAAE,GAAG;GAAU;EAAO;CAC9B;CACA,MAAM,MAAM,SAAS,MAAM,SAAS,MAAM,SAAS,MAAM;CACzD,IAAI,QAAQ,MACX,OAAO,WAAW,OACf;EAAE,GAAG;EAAU,QAAQ;CAAK,IAC5B;EAAE,GAAG;EAAU;EAAQ,OAAO,CAAC,MAAM;CAAE;CAE3C,IAAI,WAAW,QAAQ,OAAO,OAAO,IAAI,IACxC,OAAO;EAAE,GAAG;EAAU;CAAO;CAE9B,IAAI,WAAW,QAAQ,OAAO,QAAQ,WAAW,GAAG,IAAI,QAAQ,EAAE,GAGjE,OAAO;EAAE,GAAG;EAAU;EAAQ,OAAO,CAAC,GAAG,SAAS,OAAO,MAAM;CAAE;CAElE,IAAI,WAAW,QAAQ,IAAI,QAAQ,WAAW,GAAG,OAAO,QAAQ,EAAE,GAEjE,OAAO;EACN,GAAG;EACH;EACA,OAAO,SAAS,MAAM,MAAM,GAAG,EAAE;EACjC,SAAS;EACT,gBAAgB,IAAI;CACrB;CAID,OAAO;EACN,GAAG;EACH;EACA,OAAO,SAAS,MAAM,MAAM,GAAG,EAAE;EACjC,SAAS;EACT,gBAAgB,IAAI;CACrB;AACD"}

package/dist/vkui/modals.d.ts

@@ -0,0 +1,49 @@
+import { ComponentType, LazyExoticComponent } from "react";
+import { ModalCardProps, ModalPageProps } from "@vkontakte/vkui";
+//#region src/vkui/modals.d.ts
+/**
+ * Modal choreography host. The state machine lives in `choreography.ts`
+ * (pure — sibling closes first, nested stacks on top, back reveals the
+ * parent, retarget-during-exit cancels or queues). This host binds it to
+ * VKUI: exit completion is EVENT-DRIVEN — VKUI fires `onClosed` at the
+ * transition end and backs it with an internal timer computed from the
+ * element's real `transitionDuration` (adapts to platform/theme/reduced-
+ * motion — more accurate than any host-side constant). The host
+ * `exitDuration` is only a WATCHDOG for the one case VKUI cannot report:
+ * the modal unmounting before the exit finishes (its entry vanished from
+ * `entries`).
+ */
+/** A renderable modal entry component — plain or React.lazy. */
+export type ModalEntryComponent = ComponentType | LazyExoticComponent<ComponentType>;
+export interface ModalEntry {
+  /** Full route id of the modal route (e.g. `/item/$id/details`). */
+  routeId: string;
+  /** Modal id — also the VKUI `nav`. */
+  id: string;
+  /**
+   * The modal content. Its root must be a ModalPageSurface or
+   * ModalCardSurface — the host binds nav/open/close choreography to it
+   * through context; the component owns every other prop at runtime.
+   */
+  Component: ModalEntryComponent;
+}
+export interface ModalsProps {
+  entries: ModalEntry[];
+  /**
+   * Watchdog bound for an exit whose `onClosed` never arrives (the modal
+   * unmounted mid-animation), ms. Default 420 — well past any VKUI modal
+   * exit animation; a healthy `onClosed` lands long before it fires.
+   */
+  exitDuration?: number;
+}
+/** ModalPage surface for a modal entry — the host owns nav/open/close choreography. */
+export declare function ModalPageSurface({ children, ...surface }: Omit<ModalPageProps, "nav" | "open" | "onClose" | "onClosed" | "keepMounted">): import("react").JSX.Element;
+/**
+ * ModalCard surface for a modal entry — same contract as
+ * ModalPageSurface, with the card's icon/title/description/actions as
+ * ordinary runtime props.
+ */
+export declare function ModalCardSurface({ children, ...surface }: Omit<ModalCardProps, "nav" | "open" | "onClose" | "onClosed" | "keepMounted">): import("react").JSX.Element;
+export declare function Modals({ entries, exitDuration }: ModalsProps): import("react").JSX.Element;
+//#endregion
+//# sourceMappingURL=modals.d.ts.map

package/dist/vkui/modals.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"modals.d.ts","names":[],"sources":["../../src/vkui/modals.tsx"],"mappings":";;;;;;;;;;;;;;;;YA2BY,sBAAsB,gBAAgB,oBAAoB;iBAErD;;EAEhB;;EAEA;;;;;;EAMA,WAAW;;iBAGK;EAChB,SAAS;;;;;;EAMT;;;wBA0Ce,mBACf,aACG,WACD,KAAK,2FAAwE,IAAA;;;;;;wBAmBhE,mBACf,aACG,WACD,KAAK,2FAAwE,IAAA;wBAchE,SAAS,SAAS,gBAAsB,8BAAW,IAAA"}