@fuzdev/fuz_ui 0.206.9 → 0.208.0

package/README.md

@@ -60,7 +60,7 @@ See [the library](https://ui.fuz.dev/docs) for more.
 
 ## Contributing
 
-See [contributing.md](contributing.md).
+[fuz.dev/contributing](https://www.fuz.dev/contributing)
 
 ## Develop
 

package/dist/ApiIndex.svelte

@@ -6,7 +6,7 @@
 	import DocsSearch from './DocsSearch.svelte';
 	import ApiModulesList from './ApiModulesList.svelte';
 	import ApiDeclarationList from './ApiDeclarationList.svelte';
-	import { create_api_search } from './api_search.svelte.js';
+	import { ApiSearchState } from './api_search.svelte.js';
 
 	const {
 		library: library_prop,
@@ -33,7 +33,7 @@
 	const get_library = set_library_context_with_fallback(() => library_prop, 'ApiIndex');
 	const library = $derived(get_library());
 
-	const search = $derived(create_api_search(library));
+	const search = $derived(new ApiSearchState(library));
 </script>
 
 <svelte:head>
@@ -49,21 +49,21 @@
 		<section>
 			<p>{library.pkg_json.description}</p>
 
-			{#if search.modules.all.length + search.declarations.all.length > 1}
+			{#if search.modules.length + search.declarations.length > 1}
 				<DocsSearch
-					module_count={search.modules.all.length}
-					declaration_count={search.declarations.all.length}
-					filtered_module_count={search.query.trim() ? search.modules.filtered.length : undefined}
+					module_count={search.modules.length}
+					declaration_count={search.declarations.length}
+					filtered_module_count={search.query.trim() ? search.modules_filtered.length : undefined}
 					filtered_declaration_count={search.query.trim()
-						? search.declarations.filtered.length
+						? search.declarations_filtered.length
 						: undefined}
 					bind:search_query={search.query}
 				/>
 			{/if}
 		</section>
 
-		<ApiModulesList modules={search.modules.filtered} search_query={search.query} />
+		<ApiModulesList modules={search.modules_filtered} search_query={search.query} />
 
-		<ApiDeclarationList declarations={search.declarations.filtered} search_query={search.query} />
+		<ApiDeclarationList declarations={search.declarations_filtered} search_query={search.query} />
 	{/if}
 </TomeContent>

package/dist/ApiModule.svelte

@@ -17,7 +17,7 @@
 	import DocsLink from './DocsLink.svelte';
 	import DeclarationLink from './DeclarationLink.svelte';
 	import ApiDeclarationList from './ApiDeclarationList.svelte';
-	import { create_module_declaration_search } from './api_search.svelte.js';
+	import { DeclarationSearchState } from './api_search.svelte.js';
 
 	const {
 		module_path: module_path_param,
@@ -64,7 +64,7 @@
 		module?.path || (directory_modules ? module_path : '[missing module]')
 	);
 
-	const search = $derived(create_module_declaration_search(module?.declarations ?? []));
+	const search = $derived(new DeclarationSearchState(module?.declarations ?? []));
 
 	// GitHub source URL for the module
 	const source_url = $derived(module?.url_github);
@@ -117,11 +117,11 @@
 			<TomeSection>
 				<TomeSectionHeader text="Declarations" />
 
-				{#if search.all.length > 1}
+				{#if search.declarations.length > 1}
 					<section>
 						<DocsSearch
 							placeholder="search declarations in this module..."
-							declaration_count={search.all.length}
+							declaration_count={search.declarations.length}
 							filtered_declaration_count={search.query.trim() ? search.filtered.length : undefined}
 							bind:search_query={search.query}
 						/>

package/dist/DeclarationDetail.svelte

@@ -4,10 +4,10 @@
 Renders the full detail view for an exported declaration.
 Handles all svelte-docinfo declaration kinds (function, class, interface,
 type, variable, enum, component, snippet) and their kind-specific fields
-including parameters, props, members, overloads, intersects, and more.
+including parameters, props, members, overloads, external types, and more.
 
 @see `declaration.svelte.ts` for the `Declaration` wrapper class
-@see {@link https://github.com/ryanatkn/svelte-docinfo svelte-docinfo} for the analysis library
+@see {@link https://github.com/fuzdev/svelte-docinfo svelte-docinfo} for the analysis library
 -->
 <script lang="ts">
 	import Code from '@fuzdev/fuz_code/Code.svelte';
@@ -22,11 +22,24 @@ including parameters, props, members, overloads, intersects, and more.
 
 	import type { Declaration } from './declaration.svelte.js';
 	import TypeLink from './TypeLink.svelte';
+	import TypeJsonView from './TypeJsonView.svelte';
 	import ModuleLink from './ModuleLink.svelte';
 	import DocsLink from './DocsLink.svelte';
 
 	const { declaration }: { declaration: Declaration } = $props();
 
+	// external types not already shown in the inheritance section — on direct
+	// heritage (`interface Props extends HTMLButtonAttributes`) the producer
+	// deliberately records the same name in both fields, so the external-types
+	// section keeps only what heritage doesn't already display
+	const external_types_not_inherited = $derived.by(() => {
+		const external_types = declaration.external_types;
+		if (!external_types?.length) return undefined;
+		const heritage = (declaration.extends_types ?? []).concat(declaration.implements_types ?? []);
+		const filtered = external_types.filter((t) => !heritage.includes(t));
+		return filtered.length ? filtered : undefined;
+	});
+
 	// render mdz inline `code` as API-linking `DocsLink` and fenced blocks as syntax-highlighted
 	// `Code`, matching the rest of the docs — the injection mdz core leaves open
 	mdz_set_context_with_fallback(mdz_code_context, () => DocsLink);
@@ -37,6 +50,7 @@ including parameters, props, members, overloads, intersects, and more.
 	// sections for the same fields instead).
 	interface DocExtras {
 		deprecatedMessage?: string;
+		internalMessage?: string;
 		since?: string;
 		examples?: Array<string>;
 		seeAlso?: Array<string>;
@@ -57,7 +71,7 @@ including parameters, props, members, overloads, intersects, and more.
 		{/if}
 		<div class="row gap_md mb_sm">
 			<strong>type</strong>
-			<TypeLink type={param.type} />
+			<TypeLink type={param.type} type_info={param.typeInfo} />
 		</div>
 		{#if param.optional || param.defaultValue}
 			<div class="row gap_md">
@@ -79,11 +93,11 @@ including parameters, props, members, overloads, intersects, and more.
 		<code>
 			{param.name}{#if param.optional}?{/if}
 		</code>
-		<TypeLink type={param.type} />
+		<TypeLink type={param.type} type_info={param.typeInfo} />
 	</div>
 {/snippet}
 
-<!-- Compact prose metadata for props and members (deprecated, since, examples, see also, throws). -->
+<!-- Compact prose metadata for props and members (deprecated, internal, since, examples, see also, throws). -->
 {#snippet doc_extras(item: DocExtras)}
 	<!-- eslint-disable-next-line @typescript-eslint/no-deprecated -->
 	{#if item.deprecatedMessage !== undefined}
@@ -93,6 +107,12 @@ including parameters, props, members, overloads, intersects, and more.
 			{#if item.deprecatedMessage}{item.deprecatedMessage}{/if}
 		</p>
 	{/if}
+	{#if item.internalMessage !== undefined}
+		<p class="row gap_md">
+			<span class="chip">internal</span>
+			{#if item.internalMessage}{item.internalMessage}{/if}
+		</p>
+	{/if}
 	{#if item.since}
 		<p><strong>since</strong> {item.since}</p>
 	{/if}
@@ -125,7 +145,7 @@ including parameters, props, members, overloads, intersects, and more.
 	{/if}
 {/snippet}
 
-<!-- A comma-separated inline list of type links (extends, implements, intersects are rarely more than one). -->
+<!-- A comma-separated inline list of type links (extends, implements, external types are rarely more than one). -->
 {#snippet type_list(types: Array<string>)}
 	{#each types as type, i (type)}
 		{#if i > 0}
@@ -146,8 +166,10 @@ including parameters, props, members, overloads, intersects, and more.
 <!-- chips -->
 <!-- eslint-disable-next-line @typescript-eslint/no-deprecated -->
 {#if declaration.is_deprecated ||
+	declaration.is_internal ||
 	declaration.reactivity ||
 	declaration.accepts_children ||
+	declaration.merged_value ||
 	declaration.alias_of
 }
 	<p class="row gap_md flex-wrap:wrap">
@@ -155,12 +177,18 @@ including parameters, props, members, overloads, intersects, and more.
 		{#if declaration.is_deprecated}
 			<span class="chip">⚠️ deprecated</span>
 		{/if}
+		{#if declaration.is_internal}
+			<span class="chip">internal</span>
+		{/if}
 		{#if declaration.reactivity}
 			<span class="chip">{declaration.reactivity}</span>
 		{/if}
 		{#if declaration.accepts_children}
 			<span class="chip">accepts children</span>
 		{/if}
+		{#if declaration.merged_value}
+			<span class="chip">value + type</span>
+		{/if}
 		{#if declaration.alias_of}
 			<span class="chip">
 				alias of {declaration.alias_of.name}{#if declaration.alias_of.module}
@@ -189,11 +217,34 @@ including parameters, props, members, overloads, intersects, and more.
 	</p>
 {/if}
 
+{#if declaration.internal_message}
+	<p>{declaration.internal_message}</p>
+{/if}
+
 <!-- type signature -->
 {#if declaration.type_signature}
 	<Code lang="ts" content={declaration.type_signature} />
 {/if}
 
+<!-- structured type (variables and type aliases; carries what the flat
+	signature lost — union members, recovered alias names — with links);
+	`type_info_expanded` strips a self-aliased root so a union alias expands
+	into its members here instead of linking circularly to itself -->
+{#if declaration.type_info_expanded}
+	<p class="row gap_md">
+		<strong>type</strong>
+		<TypeJsonView type_info={declaration.type_info_expanded} title={declaration.type_signature} />
+	</p>
+{/if}
+
+<!-- default (top-level variables; params, props, and members render theirs inline) -->
+{#if declaration.default_value}
+	<p class="row gap_md">
+		<strong>default</strong>
+		<Code lang="ts" content={declaration.default_value} />
+	</p>
+{/if}
+
 <!-- import statement -->
 <Code lang="ts" content={declaration.import_statement} />
 
@@ -226,7 +277,7 @@ including parameters, props, members, overloads, intersects, and more.
 				{/if}
 				<div class="row gap_md mb_sm">
 					<strong>type</strong>
-					<TypeLink type={prop.type} />
+					<TypeLink type={prop.type} type_info={prop.typeInfo} />
 				</div>
 				{#if prop.optional || prop.bindable || prop.defaultValue}
 					<div class="row gap_md">
@@ -274,7 +325,7 @@ including parameters, props, members, overloads, intersects, and more.
 				{#if overload.returnType}
 					<div class="row gap_md">
 						<strong>returns</strong>
-						<TypeLink type={overload.returnType} />
+						<TypeLink type={overload.returnType} type_info={overload.returnTypeInfo} />
 					</div>
 					{#if overload.returnDescription}
 						<Mdz content={overload.returnDescription} />
@@ -285,12 +336,13 @@ including parameters, props, members, overloads, intersects, and more.
 	</section>
 {/if}
 
-<!-- intersects (component/type intersection types) -->
-{#if declaration.intersects?.length}
+<!-- external types whose contributions are filtered out of (or, on
+	interfaces/classes, never enumerated in) props/members -->
+{#if external_types_not_inherited}
 	<section>
-		<h4>intersects</h4>
+		<h4>external types</h4>
 		<div class="row gap_md flex-wrap:wrap">
-			{@render type_list(declaration.intersects)}
+			{@render type_list(external_types_not_inherited)}
 		</div>
 	</section>
 {/if}
@@ -299,7 +351,14 @@ including parameters, props, members, overloads, intersects, and more.
 {#if declaration.return_type}
 	<section>
 		<h4>returns</h4>
-		<Code lang="ts" content={declaration.return_type} />
+		{#if declaration.return_type_info}
+			<!-- the flat expansion stays visible in the type signature above -->
+			<p>
+				<TypeJsonView type_info={declaration.return_type_info} title={declaration.return_type} />
+			</p>
+		{:else}
+			<Code lang="ts" content={declaration.return_type} />
+		{/if}
 		{#if declaration.return_description}
 			<Mdz content={declaration.return_description} />
 		{/if}
@@ -334,17 +393,13 @@ including parameters, props, members, overloads, intersects, and more.
 {/if}
 
 <!-- Extends/Implements -->
-{#if declaration.extends_type || declaration.implements_types?.length}
+{#if declaration.extends_types?.length || declaration.implements_types?.length}
 	<section>
 		<h4>inheritance</h4>
-		{#if declaration.extends_type}
+		{#if declaration.extends_types?.length}
 			<div class="row gap_md flex-wrap:wrap">
 				<strong>extends:</strong>
-				{@render type_list(
-					Array.isArray(declaration.extends_type)
-						? declaration.extends_type
-						: [declaration.extends_type]
-				)}
+				{@render type_list(declaration.extends_types)}
 			</div>
 		{/if}
 		{#if declaration.implements_types?.length}
@@ -440,6 +495,7 @@ including parameters, props, members, overloads, intersects, and more.
 							type={member.kind === 'constructor'
 								? `new ${member.typeSignature}`
 								: member.typeSignature}
+							type_info={member.kind === 'variable' ? member.typeInfo : undefined}
 						/>
 					</p>
 				{/if}
@@ -455,7 +511,7 @@ including parameters, props, members, overloads, intersects, and more.
 						{/if}
 					</div>
 				{/if}
-				{#if member.kind === 'variable' && member.defaultValue}
+				{#if (member.kind === 'variable' || member.kind === 'function') && member.defaultValue}
 					<div class="row gap_md">
 						<strong>default</strong>
 						<Code lang="ts" content={member.defaultValue} />
@@ -475,7 +531,7 @@ including parameters, props, members, overloads, intersects, and more.
 				{#if member.kind === 'function' && member.returnType}
 					<div class="row gap_md">
 						<strong>returns</strong>
-						<TypeLink type={member.returnType} />
+						<TypeLink type={member.returnType} type_info={member.returnTypeInfo} />
 					</div>
 					{#if member.returnDescription}
 						<Mdz content={member.returnDescription} />

package/dist/DeclarationDetail.svelte.d.ts

@@ -6,10 +6,10 @@ type $$ComponentProps = {
  * Renders the full detail view for an exported declaration.
  * Handles all svelte-docinfo declaration kinds (function, class, interface,
  * type, variable, enum, component, snippet) and their kind-specific fields
- * including parameters, props, members, overloads, intersects, and more.
+ * including parameters, props, members, overloads, external types, and more.
  *
  * @see `declaration.svelte.ts` for the `Declaration` wrapper class
- * @see {@link https://github.com/ryanatkn/svelte-docinfo svelte-docinfo} for the analysis library
+ * @see {@link https://github.com/fuzdev/svelte-docinfo svelte-docinfo} for the analysis library
  */
 declare const DeclarationDetail: import("svelte").Component<$$ComponentProps, {}, "">;
 type DeclarationDetail = ReturnType<typeof DeclarationDetail>;

package/dist/DeclarationDetail.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DeclarationDetail.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DeclarationDetail.svelte"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAgB1D,KAAK,gBAAgB,GAAI;IAAE,WAAW,EAAE,WAAW,CAAA;CAAE,CAAC;AA+cvD;;;;;;;;GAQG;AACH,QAAA,MAAM,iBAAiB,sDAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"DeclarationDetail.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DeclarationDetail.svelte"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAkB1D,KAAK,gBAAgB,GAAI;IAAE,WAAW,EAAE,WAAW,CAAA;CAAE,CAAC;AAigBvD;;;;;;;;GAQG;AACH,QAAA,MAAM,iBAAiB,sDAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}

package/dist/ProjectLinks.svelte

@@ -19,16 +19,20 @@
 	{/each}
 </menu>
 <small class="display:block text-align:right">
-	the charts show public commit activity<br />since Gro planted on August 7, 2019
+	the charts show public commit activity<br />since Gro started in August 2019 -<br />most of the
+	repos created in 2023-2024 are<br />history-resetting forks from 2020~2023 attempts
 </small>
 
 {#snippet package_thumbnail(project_item: ProjectItem)}
 	{@const counts = series_by_name.get(project_item.name)}
-	<!-- eslint-disable-next-line svelte/no-navigation-without-resolve -->
-	<a class="thumbnail row shade_00 px_md py_xs border_radius_sm mb_lg" href={project_item.url}>
+	<!-- eslint-disable svelte/no-navigation-without-resolve -->
+	<a
+		class="thumbnail row align-items:start shade_00 px_md py_xs border_radius_sm mb_lg"
+		href={project_item.url}
+	>
 		<Svg shrink={false} data={project_item.logo} size="var(--icon_size_lg)" />
 		<div class="pl_lg width_atmost_sm">
-			<div class="thumbnail-name row align-items:start {project_item.color_class}">
+			<div class="thumbnail-name row {project_item.color_class}">
 				{project_item.name}
 				{#if counts}
 					{@const stats_label = label_by_name.get(project_item.name)}
@@ -43,6 +47,7 @@
 			</div>
 		</div>
 	</a>
+	<!-- eslint-enable svelte/no-navigation-without-resolve -->
 {/snippet}
 
 <style>

package/dist/ProjectLinks.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProjectLinks.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/ProjectLinks.svelte"],"names":[],"mappings":"AA4DA,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,YAAY;;kBAA+E,CAAC;AAChF,KAAK,YAAY,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,CAAC;AACxD,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ProjectLinks.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/ProjectLinks.svelte"],"names":[],"mappings":"AA8DA,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,YAAY;;kBAA+E,CAAC;AAChF,KAAK,YAAY,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,CAAC;AACxD,eAAe,YAAY,CAAC"}

package/dist/TypeJsonView.svelte

@@ -0,0 +1,90 @@
+<!--
+@component
+
+Renders svelte-docinfo's structured `TypeJson` tree as inline code: `reference`
+nodes (and alias-carrying unions/intersections) link to API docs via
+`DeclarationLink` when the name resolves in the library — scoped to the token's
+declaring module when the analysis names one — terminal type text is
+syntax-highlighted via fuz_code's `Code`, and structural punctuation comes
+from svelte-docinfo's `typeJsonToTokens`, which owns spacing and
+parenthesization so rendering is whitespace-exact.
+
+The structured sibling of `TypeLink`, which renders flat type strings —
+`TypeLink` delegates here when given `type_info`, and svelte-docinfo omits the
+tree wherever the flat string is the whole story, so the two compose as
+"structured when it says something, flat otherwise". Pass `title` (typically
+the flat sibling string) to keep the expansion reachable on hover where the
+tree replaced it with a recovered name.
+-->
+<script lang="ts">
+	import Code from '@fuzdev/fuz_code/Code.svelte';
+	import type { TypeJson } from 'svelte-docinfo/types.js';
+	import { typeJsonToTokens } from 'svelte-docinfo/declaration-helpers.js';
+
+	import DeclarationLink from './DeclarationLink.svelte';
+	import { library_context } from './library.svelte.js';
+
+	const {
+		type_info,
+		title
+	}: {
+		type_info: TypeJson;
+		/** Hover text for the root element — pass the flat type string so the checker's expansion stays reachable. */
+		title?: string;
+	} = $props();
+
+	const get_library = library_context.get();
+	const library = $derived(get_library());
+
+	const tokens = $derived(typeJsonToTokens(type_info));
+
+	// a bare name renders without the code wrapper, matching the plain chip
+	// link `TypeLink` produces for whole-string matches
+	const bare_name_token = $derived(
+		tokens.length === 1 && tokens[0]!.kind === 'name' ? tokens[0]! : undefined
+	);
+
+	// the gate mirrors `DeclarationLink`'s resolution exactly — a moduled token
+	// (registry-recovered reference) is scoped to its declaring module with no
+	// by-name fallback, so the gate can't admit a name the link then fails on
+	const resolves = (name: string, module?: string): boolean =>
+		module === undefined
+			? library.declaration_by_name.has(name)
+			: library.module_by_path.get(module)?.get_declaration_by_name(name) !== undefined;
+</script>
+
+{#snippet name_view(name: string, module: string | undefined, root_title?: string)}
+	{#if resolves(name, module)}
+		<DeclarationLink {name} module_path={module} title={root_title} />
+	{:else}
+		<Code lang="ts" content={name} inline title={root_title} />
+	{/if}
+{/snippet}
+
+{#if bare_name_token}
+	{@render name_view(bare_name_token.name, bare_name_token.module, title)}
+{:else}
+	<!-- token adjacency survives the multi-line template: Svelte trims
+		block-boundary whitespace here, locked by the `TypeJsonView` render tests
+		(`textContent` equality would catch stray spaces) -->
+	<code class="type-json-view" {title}>
+		{#each tokens as token, i (i)}
+			{#if token.kind === 'text'}
+				{token.text}
+			{:else if token.kind === 'name'}
+				{@render name_view(token.name, token.module)}
+			{:else}
+				<Code lang="ts" content={token.text} inline />
+			{/if}
+		{/each}
+	</code>
+{/if}
+
+<style>
+	/* the outer element is the one code pill; inner `Code` fragments contribute
+	   syntax coloring only */
+	.type-json-view :global(code) {
+		background: transparent;
+		padding: 0;
+	}
+</style>

package/dist/TypeJsonView.svelte.d.ts

@@ -0,0 +1,26 @@
+import type { TypeJson } from 'svelte-docinfo/types.js';
+type $$ComponentProps = {
+    type_info: TypeJson;
+    /** Hover text for the root element — pass the flat type string so the checker's expansion stays reachable. */
+    title?: string;
+};
+/**
+ * Renders svelte-docinfo's structured `TypeJson` tree as inline code: `reference`
+ * nodes (and alias-carrying unions/intersections) link to API docs via
+ * `DeclarationLink` when the name resolves in the library — scoped to the token's
+ * declaring module when the analysis names one — terminal type text is
+ * syntax-highlighted via fuz_code's `Code`, and structural punctuation comes
+ * from svelte-docinfo's `typeJsonToTokens`, which owns spacing and
+ * parenthesization so rendering is whitespace-exact.
+ *
+ * The structured sibling of `TypeLink`, which renders flat type strings —
+ * `TypeLink` delegates here when given `type_info`, and svelte-docinfo omits the
+ * tree wherever the flat string is the whole story, so the two compose as
+ * "structured when it says something, flat otherwise". Pass `title` (typically
+ * the flat sibling string) to keep the expansion reachable on hover where the
+ * tree replaced it with a recovered name.
+ */
+declare const TypeJsonView: import("svelte").Component<$$ComponentProps, {}, "">;
+type TypeJsonView = ReturnType<typeof TypeJsonView>;
+export default TypeJsonView;
+//# sourceMappingURL=TypeJsonView.svelte.d.ts.map

package/dist/TypeJsonView.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TypeJsonView.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/TypeJsonView.svelte"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAMvD,KAAK,gBAAgB,GAAI;IACxB,SAAS,EAAE,QAAQ,CAAC;IACpB,8GAA8G;IAC9G,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAgEH;;;;;;;;;;;;;;;GAeG;AACH,QAAA,MAAM,YAAY,sDAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}

package/dist/TypeLink.svelte

@@ -1,12 +1,26 @@
+<!--
+@component
+
+Renders a type reference, linking the parts that resolve to library declarations.
+
+With `type_info` it delegates to `TypeJsonView`, which renders the structured
+tree — reference names become `DeclarationLink`s and everything else is
+syntax-highlighted in place, so `Map<string, Tome> | null` links `Map` and
+`Tome` independently, with the flat `type` as hover text. Without it the whole
+`type` string links only when it names a declaration outright.
+-->
 <script lang="ts">
 	import Code from '@fuzdev/fuz_code/Code.svelte';
 	import type { HTMLAttributes, SvelteHTMLElements } from 'svelte/elements';
+	import type { TypeJson } from 'svelte-docinfo/types.js';
 
 	import DeclarationLink from './DeclarationLink.svelte';
+	import TypeJsonView from './TypeJsonView.svelte';
 	import { library_context } from './library.svelte.js';
 
 	const {
 		type,
+		type_info,
 		hash,
 		a_attrs,
 		code_attrs,
@@ -14,6 +28,15 @@
 	}: // generic element attrs, the common denominator of the rendered roots - // assignable to the anchor rest of `DeclarationLink` and the code rest of `Code`
 		HTMLAttributes<HTMLElement> & {
 			type: string;
+			/**
+			 * Structured type tree, when svelte-docinfo emitted one beside the flat
+			 * string — rendered via `TypeJsonView` (per-node linkification, with
+			 * `type` as hover text) instead of the whole-string match below. An
+			 * absent tree falls through to `type`, so call sites pass both fields
+			 * unconditionally. `hash` and the rest/`a_attrs`/`code_attrs`
+			 * attributes apply only to the flat branches, not the delegated tree.
+			 */
+			type_info?: TypeJson;
 			/** URL fragment to append, with or without the `#`. */
 			hash?: string;
 			/** Anchor attributes, applied only when the type resolves to a declaration link. */
@@ -28,7 +51,11 @@
 	// TODO maybe better name?
 </script>
 
-{#if library.declaration_by_name.has(type)}
+{#if type_info}
+	<!-- the flat string rides along as hover text so the checker's expansion
+		stays reachable where the tree replaced it with a recovered name -->
+	<TypeJsonView {type_info} title={type} />
+{:else if library.declaration_by_name.has(type)}
 	<DeclarationLink {...rest} {...a_attrs} name={type} {hash} />
 {:else}
 	<Code {...rest} {...code_attrs} lang="ts" content={type} inline />

package/dist/TypeLink.svelte.d.ts

@@ -1,7 +1,17 @@
 import type { HTMLAttributes, SvelteHTMLElements } from 'svelte/elements';
+import type { TypeJson } from 'svelte-docinfo/types.js';
 type $$ComponentProps = // generic element attrs, the common denominator of the rendered roots - // assignable to the anchor rest of `DeclarationLink` and the code rest of `Code`
 HTMLAttributes<HTMLElement> & {
     type: string;
+    /**
+     * Structured type tree, when svelte-docinfo emitted one beside the flat
+     * string — rendered via `TypeJsonView` (per-node linkification, with
+     * `type` as hover text) instead of the whole-string match below. An
+     * absent tree falls through to `type`, so call sites pass both fields
+     * unconditionally. `hash` and the rest/`a_attrs`/`code_attrs`
+     * attributes apply only to the flat branches, not the delegated tree.
+     */
+    type_info?: TypeJson;
     /** URL fragment to append, with or without the `#`. */
     hash?: string;
     /** Anchor attributes, applied only when the type resolves to a declaration link. */
@@ -9,6 +19,15 @@ HTMLAttributes<HTMLElement> & {
     /** Code attributes, applied only to the fallback `Code` when the type doesn't resolve. */
     code_attrs?: SvelteHTMLElements['code'];
 };
+/**
+ * Renders a type reference, linking the parts that resolve to library declarations.
+ *
+ * With `type_info` it delegates to `TypeJsonView`, which renders the structured
+ * tree — reference names become `DeclarationLink`s and everything else is
+ * syntax-highlighted in place, so `Map<string, Tome> | null` links `Map` and
+ * `Tome` independently, with the flat `type` as hover text. Without it the whole
+ * `type` string links only when it names a declaration outright.
+ */
 declare const TypeLink: import("svelte").Component<$$ComponentProps, {}, "">;
 type TypeLink = ReturnType<typeof TypeLink>;
 export default TypeLink;

package/dist/TypeLink.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TypeLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/TypeLink.svelte"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAKzE,KAAK,gBAAgB,GACpB,AADwB,0JAA0J;AAClL,cAAc,CAAC,WAAW,CAAC,GAAG;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oFAAoF;IACpF,OAAO,CAAC,EAAE,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAClC,0FAA0F;IAC1F,UAAU,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,CAAC;CACxC,CAAC;AA8BJ,QAAA,MAAM,QAAQ,sDAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"TypeLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/TypeLink.svelte"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAMvD,KAAK,gBAAgB,GACpB,AADwB,0JAA0J;AAClL,cAAc,CAAC,WAAW,CAAC,GAAG;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC;IACrB,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oFAAoF;IACpF,OAAO,CAAC,EAAE,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAClC,0FAA0F;IAC1F,UAAU,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,CAAC;CACxC,CAAC;AAqCJ;;;;;;;;GAQG;AACH,QAAA,MAAM,QAAQ,sDAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}

package/dist/api_search.svelte.d.ts

@@ -1,28 +1,25 @@
 import type { Declaration } from './declaration.svelte.js';
 import type { Library } from './library.svelte.js';
 import type { Module } from './module.svelte.js';
-export interface DeclarationSearchState {
-    query: string;
-    all: Array<Declaration>;
-    filtered: Array<Declaration>;
-}
-export interface ApiSearchState {
-    query: string;
-    modules: {
-        all: Array<Module>;
-        filtered: Array<Module>;
-    };
-    declarations: {
-        all: Array<Declaration>;
-        filtered: Array<Declaration>;
-    };
-}
 /**
- * Creates unified search state for the API index page (modules and declarations).
+ * Unified search state for the API index page (modules and declarations).
  */
-export declare const create_api_search: (library: Library) => ApiSearchState;
+export declare class ApiSearchState {
+    readonly library: Library;
+    query: string;
+    readonly modules: Array<Module>;
+    readonly modules_filtered: Array<Module>;
+    readonly declarations: Array<Declaration>;
+    readonly declarations_filtered: Array<Declaration>;
+    constructor(library: Library);
+}
 /**
- * Creates search state for module-specific declaration lists.
+ * Search state for a module-specific declaration list.
  */
-export declare const create_module_declaration_search: (declarations: Array<Declaration>) => DeclarationSearchState;
+export declare class DeclarationSearchState {
+    readonly declarations: Array<Declaration>;
+    query: string;
+    readonly filtered: Array<Declaration>;
+    constructor(declarations: Array<Declaration>);
+}
 //# sourceMappingURL=api_search.svelte.d.ts.map