@joewinke/jatui 0.26.0 → 0.27.1

package/dist/components/basic/Empty.svelte

@@ -1,17 +1,181 @@
 <script lang="ts">
+	import type { Snippet } from 'svelte';
+
+	/**
+	 * Empty — the STANDARD "nothing here yet" surface, now at full strength (v2).
+	 *
+	 * v1 API (unchanged, still supported): `copy` + `children` render the
+	 * original thin zero-state block.
+	 *
+	 * v2 API (upstreamed from the JAT IDE's ui/EmptyState.svelte, additive):
+	 * pass `title` to opt into the full hero layout — named glyph or custom
+	 * `icon` snippet, three sizes, an optional ambient pulse for
+	 * "listening / waiting" states, CTA `actions` and extra `children` below.
+	 *
+	 * Design-system conformance:
+	 * - Color routes through DaisyUI semantic tokens (`text-base-content`
+	 *   with opacity), so it survives a theme switch. No hardcoded state hues.
+	 * - Motion (the optional ambient pulse on the icon) is reduced-motion gated
+	 *   and tinted with the theme's `--color-primary` token.
+	 *
+	 * Usage — named glyph + CTA:
+	 *   <Empty title="Inbox zero" description="No items need triage.">
+	 *     {#snippet actions()}
+	 *       <button class="btn btn-sm btn-primary" onclick={create}>New task</button>
+	 *     {/snippet}
+	 *   </Empty>
+	 *
+	 * Usage — custom icon snippet:
+	 *   <Empty title="No sessions">
+	 *     {#snippet icon()}<MyIcon class="w-12 h-12" />{/snippet}
+	 *   </Empty>
+	 */
+
+	/** Named glyph from the curated Heroicons (outline) set. */
+	export type EmptyGlyph =
+		| 'inbox'
+		| 'search'
+		| 'tasks'
+		| 'folder'
+		| 'server'
+		| 'sparkles'
+		| 'document'
+		| 'database'
+		| 'bell'
+		| 'check'
+		| 'radar';
+
 	interface Props {
+		/** v2 headline — what's missing, in plain words. Opts into the v2 hero layout. */
+		title?: string;
+		/** v2 optional one-line guidance: what the operator can do about it. */
+		description?: string;
+		/** v2 named glyph from the curated set. Ignored if an `icon` snippet is passed. */
+		glyph?: EmptyGlyph;
+		/** v2 visual scale. `sm` for inline panels, `lg` for full-page first-runs. */
+		size?: 'sm' | 'md' | 'lg';
+		/** v2 subtle ambient pulse on the icon (reduced-motion gated). For "listening / waiting" states. */
+		pulse?: boolean;
+		/** v2 override the glyph with arbitrary icon markup. */
+		icon?: Snippet;
+		/** v2 right-aligned CTA buttons rendered under the description. */
+		actions?: Snippet;
+		/** v1 legacy copy line (ignored when `title` is set). */
 		copy?: string;
+		/** Extra class on the outer container (both layouts). */
 		class?: string;
-		children?: import('svelte').Snippet;
+		/** v1 freeform content (v1 body) / v2 extra content rendered below actions. */
+		children?: Snippet;
 	}
 
-	let { copy = 'Nothing here yet.', class: className = '', children }: Props = $props();
+	let {
+		title,
+		description = '',
+		glyph = 'inbox',
+		size = 'md',
+		pulse = false,
+		icon,
+		actions,
+		copy = 'Nothing here yet.',
+		class: className = '',
+		children
+	}: Props = $props();
+
+	// Heroicons (outline) — curated to the empty-states the IDE actually shows.
+	const GLYPHS: Record<EmptyGlyph, string> = {
+		inbox:
+			'M2.25 13.5h3.86a2.25 2.25 0 0 1 2.012 1.244l.256.512a2.25 2.25 0 0 0 2.013 1.244h3.218a2.25 2.25 0 0 0 2.013-1.244l.256-.512a2.25 2.25 0 0 1 2.013-1.244h3.859m-19.5.338V18a2.25 2.25 0 0 0 2.25 2.25h15A2.25 2.25 0 0 0 21.75 18v-4.162c0-.224-.034-.447-.1-.661L19.24 5.338a2.25 2.25 0 0 0-2.15-1.588H6.911a2.25 2.25 0 0 0-2.15 1.588L2.35 13.177a2.25 2.25 0 0 0-.1.661Z',
+		search: 'M21 21l-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z',
+		tasks:
+			'M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2M9 5a2 2 0 0 0 2 2h2a2 2 0 0 0 2-2M9 5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01',
+		folder:
+			'M2.25 12.75V12A2.25 2.25 0 0 1 4.5 9.75h15A2.25 2.25 0 0 1 21.75 12v.75m-8.69-6.44-2.12-2.12a1.5 1.5 0 0 0-1.061-.44H4.5A2.25 2.25 0 0 0 2.25 6v12a2.25 2.25 0 0 0 2.25 2.25h15A2.25 2.25 0 0 0 21.75 18V9a2.25 2.25 0 0 0-2.25-2.25h-5.379a1.5 1.5 0 0 1-1.06-.44Z',
+		server:
+			'M5.25 14.25h13.5m-13.5 0a3 3 0 0 1-3-3m3 3a3 3 0 1 0 0 6h13.5a3 3 0 1 0 0-6m-16.5-3a3 3 0 0 1 3-3h13.5a3 3 0 0 1 3 3m-19.5 0a4.5 4.5 0 0 1 .9-2.7L5.737 5.1a3.375 3.375 0 0 1 2.7-1.35h7.126c1.062 0 2.062.5 2.7 1.35l2.587 3.45a4.5 4.5 0 0 1 .9 2.7m0 0a3 3 0 0 1-3 3m0 3h.008v.008h-.008v-.008Zm0-6h.008v.008h-.008v-.008Z',
+		sparkles:
+			'M9.813 15.904 9 18.75l-.813-2.846a4.5 4.5 0 0 0-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 0 0 3.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 0 0 3.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 0 0-3.09 3.09ZM18.259 8.715 18 9.75l-.259-1.035a3.375 3.375 0 0 0-2.455-2.456L14.25 6l1.036-.259a3.375 3.375 0 0 0 2.455-2.456L18 2.25l.259 1.035a3.375 3.375 0 0 0 2.456 2.456L21.75 6l-1.035.259a3.375 3.375 0 0 0-2.456 2.456Z',
+		document:
+			'M19.5 14.25v-2.625a3.375 3.375 0 0 0-3.375-3.375h-1.5A1.125 1.125 0 0 1 13.5 7.125v-1.5a3.375 3.375 0 0 0-3.375-3.375H8.25m2.25 0H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 0 0-9-9Z',
+		database:
+			'M20.25 6.375c0 2.278-3.694 4.125-8.25 4.125S3.75 8.653 3.75 6.375m16.5 0c0-2.278-3.694-4.125-8.25-4.125S3.75 4.097 3.75 6.375m16.5 0v11.25c0 2.278-3.694 4.125-8.25 4.125s-8.25-1.847-8.25-4.125V6.375m16.5 0v3.75m-16.5-3.75v3.75m16.5 0v3.75C20.25 16.153 16.556 18 12 18s-8.25-1.847-8.25-4.125v-3.75',
+		bell: 'M14.857 17.082a23.848 23.848 0 0 0 5.454-1.31A8.967 8.967 0 0 1 18 9.75V9A6 6 0 0 0 6 9v.75a8.967 8.967 0 0 1-2.312 6.022c1.733.64 3.56 1.085 5.455 1.31m5.714 0a24.255 24.255 0 0 1-5.714 0m5.714 0a3 3 0 1 1-5.714 0',
+		check:
+			'M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z',
+		radar:
+			'M9.348 14.651a3.75 3.75 0 0 1 0-5.303m5.304-.001a3.75 3.75 0 0 1 0 5.304m-7.425 2.122a6.75 6.75 0 0 1 0-9.546m9.546.001a6.75 6.75 0 0 1 0 9.547m-11.667 2.12a10.5 10.5 0 0 1 0-13.787m13.787.001a10.5 10.5 0 0 1 0 13.787M12 12h.008v.008H12V12Z'
+	};
+
+	const SIZES = {
+		sm: { pad: 'py-8 px-4', icon: 'w-9 h-9', box: 'w-14 h-14', title: 'text-sm', desc: 'text-xs', gap: 'gap-1.5' },
+		md: { pad: 'py-14 px-6', icon: 'w-12 h-12', box: 'w-20 h-20', title: 'text-base', desc: 'text-sm', gap: 'gap-2' },
+		lg: { pad: 'py-20 px-8', icon: 'w-16 h-16', box: 'w-28 h-28', title: 'text-lg', desc: 'text-sm', gap: 'gap-2.5' }
+	} as const;
+
+	const s = $derived(SIZES[size]);
+	const path = $derived(GLYPHS[glyph] ?? GLYPHS.inbox);
+	const v2 = $derived(title !== undefined);
 </script>
 
-<div class="text-base-content/45 flex flex-col items-center justify-center gap-2 py-8 text-sm {className}">
-	{#if children}
-		{@render children()}
-	{:else}
-		<span>{copy}</span>
-	{/if}
-</div>
+{#if v2}
+	<div class="flex flex-col items-center justify-center text-center {s.pad} {s.gap} {className}" role="status" aria-live="polite">
+		<div
+			class="flex items-center justify-center rounded-2xl {s.box} mb-1 bg-base-content/[0.04] border border-base-content/10"
+			class:empty-pulse={pulse}
+		>
+			{#if icon}
+				{@render icon()}
+			{:else}
+				<svg
+					xmlns="http://www.w3.org/2000/svg"
+					fill="none"
+					viewBox="0 0 24 24"
+					stroke-width="1.5"
+					stroke="currentColor"
+					class="{s.icon} text-base-content/40"
+					aria-hidden="true"
+				>
+					<path stroke-linecap="round" stroke-linejoin="round" d={path} />
+				</svg>
+			{/if}
+		</div>
+
+		<p class="{s.title} font-semibold text-base-content/80 max-w-md">{title}</p>
+
+		{#if description}
+			<p class="{s.desc} text-base-content/50 max-w-md leading-relaxed">{description}</p>
+		{/if}
+
+		{#if actions}
+			<div class="flex flex-wrap items-center justify-center gap-2 mt-2">
+				{@render actions()}
+			</div>
+		{/if}
+
+		{#if children}
+			<div class="mt-1 w-full">{@render children()}</div>
+		{/if}
+	</div>
+{:else}
+	<div class="text-base-content/45 flex flex-col items-center justify-center gap-2 py-8 text-sm {className}">
+		{#if children}
+			{@render children()}
+		{:else}
+			<span>{copy}</span>
+		{/if}
+	</div>
+{/if}
+
+<style>
+	/* Ambient "listening" pulse for waiting/empty states — gated for a11y.
+	   Tinted with the theme's primary color token, never a hardcoded hue. */
+	.empty-pulse {
+		animation: empty-pulse 3s ease-in-out infinite;
+	}
+	@keyframes empty-pulse {
+		0%, 100% { box-shadow: 0 0 0 0 color-mix(in oklch, var(--color-primary) 18%, transparent); }
+		50% { box-shadow: 0 0 0 8px color-mix(in oklch, var(--color-primary) 0%, transparent); }
+	}
+	@media (prefers-reduced-motion: reduce) {
+		.empty-pulse { animation: none !important; }
+	}
+</style>

package/dist/components/basic/Empty.svelte.d.ts

@@ -1,7 +1,56 @@
+import type { Snippet } from 'svelte';
+/**
+ * Empty — the STANDARD "nothing here yet" surface, now at full strength (v2).
+ *
+ * v1 API (unchanged, still supported): `copy` + `children` render the
+ * original thin zero-state block.
+ *
+ * v2 API (upstreamed from the JAT IDE's ui/EmptyState.svelte, additive):
+ * pass `title` to opt into the full hero layout — named glyph or custom
+ * `icon` snippet, three sizes, an optional ambient pulse for
+ * "listening / waiting" states, CTA `actions` and extra `children` below.
+ *
+ * Design-system conformance:
+ * - Color routes through DaisyUI semantic tokens (`text-base-content`
+ *   with opacity), so it survives a theme switch. No hardcoded state hues.
+ * - Motion (the optional ambient pulse on the icon) is reduced-motion gated
+ *   and tinted with the theme's `--color-primary` token.
+ *
+ * Usage — named glyph + CTA:
+ *   <Empty title="Inbox zero" description="No items need triage.">
+ *     {#snippet actions()}
+ *       <button class="btn btn-sm btn-primary" onclick={create}>New task</button>
+ *     {/snippet}
+ *   </Empty>
+ *
+ * Usage — custom icon snippet:
+ *   <Empty title="No sessions">
+ *     {#snippet icon()}<MyIcon class="w-12 h-12" />{/snippet}
+ *   </Empty>
+ */
+/** Named glyph from the curated Heroicons (outline) set. */
+export type EmptyGlyph = 'inbox' | 'search' | 'tasks' | 'folder' | 'server' | 'sparkles' | 'document' | 'database' | 'bell' | 'check' | 'radar';
 interface Props {
+    /** v2 headline — what's missing, in plain words. Opts into the v2 hero layout. */
+    title?: string;
+    /** v2 optional one-line guidance: what the operator can do about it. */
+    description?: string;
+    /** v2 named glyph from the curated set. Ignored if an `icon` snippet is passed. */
+    glyph?: EmptyGlyph;
+    /** v2 visual scale. `sm` for inline panels, `lg` for full-page first-runs. */
+    size?: 'sm' | 'md' | 'lg';
+    /** v2 subtle ambient pulse on the icon (reduced-motion gated). For "listening / waiting" states. */
+    pulse?: boolean;
+    /** v2 override the glyph with arbitrary icon markup. */
+    icon?: Snippet;
+    /** v2 right-aligned CTA buttons rendered under the description. */
+    actions?: Snippet;
+    /** v1 legacy copy line (ignored when `title` is set). */
     copy?: string;
+    /** Extra class on the outer container (both layouts). */
     class?: string;
-    children?: import('svelte').Snippet;
+    /** v1 freeform content (v1 body) / v2 extra content rendered below actions. */
+    children?: Snippet;
 }
 declare const Empty: import("svelte").Component<Props, {}, "">;
 type Empty = ReturnType<typeof Empty>;

package/dist/components/basic/ErrorState.svelte

@@ -0,0 +1,128 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+
+	/**
+	 * ErrorState — the STANDARD "this failed to load" surface.
+	 *
+	 * Upstreamed from the JAT IDE's ui/ErrorState.svelte so error handling
+	 * stops being a per-route art project: message, an optional Retry, and an
+	 * optional collapsible details block for the raw error.
+	 *
+	 * Design-system conformance:
+	 * - The error hue comes from the DaisyUI semantic `error` token
+	 *   (`text-error`, `border-error`, `bg-error`), never an inlined red. This
+	 *   keeps it aligned with the canonical "needs attention" family and
+	 *   themes cleanly.
+	 * - Centered card layout mirrors `Empty` v2 so the two read as siblings.
+	 *
+	 * Usage:
+	 *   {#if error}
+	 *     <ErrorState message={error} onRetry={() => load()} />
+	 *   {/if}
+	 *
+	 *   <ErrorState
+	 *     title="Couldn't reach the agent relay"
+	 *     message={err.message}
+	 *     details={err.stack}
+	 *     onRetry={reload}
+	 *   />
+	 */
+
+	interface Props {
+		/** Short headline. Defaults to a generic failure line. */
+		title?: string;
+		/** Human-readable failure description (the caught error message). */
+		message?: string;
+		/** Optional raw detail (stack / response body) shown in a collapsible block. */
+		details?: string;
+		/** Label for the retry button. */
+		retryLabel?: string;
+		/** When provided, renders a Retry button wired to this callback. */
+		onRetry?: () => void;
+		/** Visual scale. */
+		size?: 'sm' | 'md' | 'lg';
+		/** Extra action buttons rendered alongside Retry. */
+		actions?: Snippet;
+	}
+
+	let {
+		title = 'Something went wrong',
+		message = '',
+		details = '',
+		retryLabel = 'Retry',
+		onRetry,
+		size = 'md',
+		actions
+	}: Props = $props();
+
+	const SIZES = {
+		sm: { pad: 'py-8 px-4', icon: 'w-9 h-9', box: 'w-14 h-14', title: 'text-sm', body: 'text-xs', gap: 'gap-1.5' },
+		md: { pad: 'py-14 px-6', icon: 'w-12 h-12', box: 'w-20 h-20', title: 'text-base', body: 'text-sm', gap: 'gap-2' },
+		lg: { pad: 'py-20 px-8', icon: 'w-16 h-16', box: 'w-28 h-28', title: 'text-lg', body: 'text-sm', gap: 'gap-2.5' }
+	} as const;
+
+	const s = $derived(SIZES[size]);
+</script>
+
+<div class="flex flex-col items-center justify-center text-center {s.pad} {s.gap}" role="alert">
+	<div class="flex items-center justify-center rounded-2xl {s.box} mb-1 bg-error/10 border border-error/25">
+		<svg
+			xmlns="http://www.w3.org/2000/svg"
+			fill="none"
+			viewBox="0 0 24 24"
+			stroke-width="1.5"
+			stroke="currentColor"
+			class="{s.icon} text-error/80"
+			aria-hidden="true"
+		>
+			<path
+				stroke-linecap="round"
+				stroke-linejoin="round"
+				d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126ZM12 15.75h.007v.008H12v-.008Z"
+			/>
+		</svg>
+	</div>
+
+	<p class="{s.title} font-semibold text-base-content/85 max-w-md">{title}</p>
+
+	{#if message}
+		<p class="{s.body} text-base-content/55 max-w-md leading-relaxed break-words">{message}</p>
+	{/if}
+
+	{#if onRetry || actions}
+		<div class="flex flex-wrap items-center justify-center gap-2 mt-2">
+			{#if onRetry}
+				<button type="button" class="btn btn-sm btn-outline btn-error gap-1.5" onclick={() => onRetry?.()}>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						fill="none"
+						viewBox="0 0 24 24"
+						stroke-width="2"
+						stroke="currentColor"
+						class="w-4 h-4"
+						aria-hidden="true"
+					>
+						<path
+							stroke-linecap="round"
+							stroke-linejoin="round"
+							d="M16.023 9.348h4.992V4.356m0 4.992-3.181-3.183a8.25 8.25 0 0 0-13.803 3.7M2.985 14.652h4.992m-4.992 0v4.992m0-4.992 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7"
+						/>
+					</svg>
+					{retryLabel}
+				</button>
+			{/if}
+			{#if actions}
+				{@render actions()}
+			{/if}
+		</div>
+	{/if}
+
+	{#if details}
+		<details class="mt-3 w-full max-w-md text-left">
+			<summary class="cursor-pointer text-xs text-base-content/40 hover:text-base-content/70 transition-colors select-none">
+				Technical details
+			</summary>
+			<pre class="mt-2 max-h-48 overflow-auto rounded-lg bg-base-300/60 border border-base-content/10 p-3 text-[0.7rem] leading-relaxed text-base-content/60 whitespace-pre-wrap break-words">{details}</pre>
+		</details>
+	{/if}
+</div>

package/dist/components/basic/ErrorState.svelte.d.ts

@@ -0,0 +1,46 @@
+import type { Snippet } from 'svelte';
+/**
+ * ErrorState — the STANDARD "this failed to load" surface.
+ *
+ * Upstreamed from the JAT IDE's ui/ErrorState.svelte so error handling
+ * stops being a per-route art project: message, an optional Retry, and an
+ * optional collapsible details block for the raw error.
+ *
+ * Design-system conformance:
+ * - The error hue comes from the DaisyUI semantic `error` token
+ *   (`text-error`, `border-error`, `bg-error`), never an inlined red. This
+ *   keeps it aligned with the canonical "needs attention" family and
+ *   themes cleanly.
+ * - Centered card layout mirrors `Empty` v2 so the two read as siblings.
+ *
+ * Usage:
+ *   {#if error}
+ *     <ErrorState message={error} onRetry={() => load()} />
+ *   {/if}
+ *
+ *   <ErrorState
+ *     title="Couldn't reach the agent relay"
+ *     message={err.message}
+ *     details={err.stack}
+ *     onRetry={reload}
+ *   />
+ */
+interface Props {
+    /** Short headline. Defaults to a generic failure line. */
+    title?: string;
+    /** Human-readable failure description (the caught error message). */
+    message?: string;
+    /** Optional raw detail (stack / response body) shown in a collapsible block. */
+    details?: string;
+    /** Label for the retry button. */
+    retryLabel?: string;
+    /** When provided, renders a Retry button wired to this callback. */
+    onRetry?: () => void;
+    /** Visual scale. */
+    size?: 'sm' | 'md' | 'lg';
+    /** Extra action buttons rendered alongside Retry. */
+    actions?: Snippet;
+}
+declare const ErrorState: import("svelte").Component<Props, {}, "">;
+type ErrorState = ReturnType<typeof ErrorState>;
+export default ErrorState;

package/dist/components/basic/JumpToLatest.svelte

@@ -0,0 +1,60 @@
+<script lang="ts">
+	/**
+	 * "Jump to latest" affordance for streaming transcripts. Pairs with
+	 * `createStickToBottom` (`src/lib/actions/stickToBottom`): show it when the
+	 * reader has scrolled away from the live edge, optionally badge it with the
+	 * number of messages that arrived off-screen, and on click jump to the bottom
+	 * and resume following.
+	 *
+	 * Theme-token only (no colour literals); motion is transform/opacity only and
+	 * respects the global reduced-motion guard via Svelte transitions. Upstreamed
+	 * from the JAT IDE (adoption audit U3, jatui-rl7w6.3).
+	 *
+	 * Position it inside a `relative` wrapper that also holds the scroll element.
+	 */
+	import { scale } from 'svelte/transition';
+	import { cubicOut } from 'svelte/easing';
+
+	let {
+		visible = false,
+		unreadCount = 0,
+		label = 'Jump to latest',
+		onclick
+	}: {
+		visible?: boolean;
+		unreadCount?: number;
+		label?: string;
+		onclick?: () => void;
+	} = $props();
+</script>
+
+{#if visible}
+	<div class="pointer-events-none absolute inset-x-0 bottom-3 z-10 flex justify-center">
+		<button
+			type="button"
+			class="btn btn-primary btn-sm pointer-events-auto gap-1 rounded-full"
+			aria-label={unreadCount > 0 ? `${label} (${unreadCount} new)` : label}
+			onclick={() => onclick?.()}
+			transition:scale={{ duration: 150, start: 0.85, easing: cubicOut }}
+		>
+			{#if unreadCount > 0}
+				<span class="font-semibold tabular-nums">{unreadCount}</span>
+				<span>new</span>
+			{/if}
+			<svg
+				xmlns="http://www.w3.org/2000/svg"
+				class="size-4"
+				viewBox="0 0 24 24"
+				fill="none"
+				stroke="currentColor"
+				stroke-width="2"
+				stroke-linecap="round"
+				stroke-linejoin="round"
+				aria-hidden="true"
+			>
+				<path d="M12 5v14" />
+				<path d="m19 12-7 7-7-7" />
+			</svg>
+		</button>
+	</div>
+{/if}

package/dist/components/basic/JumpToLatest.svelte.d.ts

@@ -0,0 +1,9 @@
+type $$ComponentProps = {
+    visible?: boolean;
+    unreadCount?: number;
+    label?: string;
+    onclick?: () => void;
+};
+declare const JumpToLatest: import("svelte").Component<$$ComponentProps, {}, "">;
+type JumpToLatest = ReturnType<typeof JumpToLatest>;
+export default JumpToLatest;