@fuzdev/fuz_ui 0.177.0 → 0.178.0

package/README.md

@@ -4,11 +4,11 @@
 
 > friendly user zystem 🧶 [fuz.dev](https://ui.fuz.dev/)
 
-Fuz UI is a [Svelte](https://svelte.dev/) UI library
+fuz_ui is a [Svelte](https://svelte.dev/) UI library
 with components and helpers for making zippy websites.
 It's in early alpha and it will go through many breaking changes.
 
-Fuz UI is being made to support
+fuz_ui is being made to support
 [my other projects](https://www.ryanatkn.com/)
 that focus on end-users.
 Fuz emphasizes capability and efficiency and tries to be simple for those goals.
@@ -19,9 +19,9 @@ Feel free to take the ideas and code for your own purposes.
 
 The Svelte components and helpers:
 
-- builds on [Fuz CSS](https://github.com/fuzdev/fuz_css)
+- builds on [fuz_css](https://github.com/fuzdev/fuz_css)
 - plain CSS and minimal abstraction
-- near-zero dependencies except for Svelte, SvelteKit, Fuz CSS,
+- near-zero dependencies except for Svelte, SvelteKit, fuz_css,
   and my utility library [`@fuzdev/fuz_util`](https://github.com/fuzdev/fuz_util)
   (not all components require SvelteKit but some do import its modules, needs more consideration)
 - not a fully-featured enterprise-ready set of components,
@@ -36,7 +36,7 @@ The Svelte components and helpers:
 > thank you see [contributing.md](contributing.md), your input is appreciated.
 >
 > If you feel comfortable looking at the source code,
-> Fuz UI is ready to use in your own projects,
+> fuz_ui is ready to use in your own projects,
 > with the major caveat that there will be a lot of breaking changes ahead.
 > The code is significantly incomplete but I think it's stable enough to use
 > if you're willing to keep up with the relatively fast-moving changelog.
@@ -45,17 +45,17 @@ The Svelte components and helpers:
 npm i -D @fuzdev/fuz_ui
 ```
 
-Fuz uses my style framework [Fuz CSS](https://github.com/fuzdev/fuz_css).
+Fuz uses my style framework [fuz_css](https://github.com/fuzdev/fuz_css).
 Import modules at their full paths:
 
 ```ts
-// Fuz CSS has one main plain CSS stylesheet:
+// fuz_css has one main plain CSS stylesheet:
 import '@fuzdev/fuz_css/style.css';
 
-// and import a Fuz CSS theme:
+// and import a fuz_css theme:
 import '@fuzdev/fuz_css/theme.css'; // or bring your own
 
-// using Gro generates Fuz CSS' utility classes stylesheet by default:
+// using Gro generates fuz_css' utility classes stylesheet by default:
 import '$routes/fuz.css';
 
 // then import Fuz Svelte components:

package/dist/ApiDeclarationList.svelte

@@ -25,7 +25,7 @@
 	{#each declarations as declaration (`${declaration.module_path}:${declaration.name}`)}
 		<TomeSection>
 			<TomeSectionHeader text={declaration.name}>
-				<div class="word_break_break_all">{declaration.name}</div>
+				<div class="word-break:break-all">{declaration.name}</div>
 			</TomeSectionHeader>
 			<article id={declaration.name}>
 				<DeclarationDetail {declaration} />

package/dist/ApiIndex.svelte

@@ -31,7 +31,7 @@
 		minimal?: boolean;
 	} = $props();
 
-	const search = create_declaration_search(library);
+	const search = $derived(create_declaration_search(library));
 </script>
 
 <svelte:head>

package/dist/ContextmenuRoot.svelte

@@ -267,8 +267,8 @@
 		}
 	};
 
-	const keyboard_handlers = contextmenu_create_keyboard_handlers(contextmenu);
-	const keydown = contextmenu_create_keydown_handler(keyboard_handlers);
+	const keyboard_handlers = $derived(contextmenu_create_keyboard_handlers(contextmenu));
+	const keydown = $derived(contextmenu_create_keydown_handler(keyboard_handlers));
 </script>
 
 <svelte:window

package/dist/ContextmenuRootForSafariCompatibility.svelte

@@ -376,8 +376,8 @@
 		}
 	};
 
-	const keyboard_handlers = contextmenu_create_keyboard_handlers(contextmenu);
-	const keydown = contextmenu_create_keydown_handler(keyboard_handlers);
+	const keyboard_handlers = $derived(contextmenu_create_keyboard_handlers(contextmenu));
+	const keydown = $derived(contextmenu_create_keydown_handler(keyboard_handlers));
 
 	/**
 	 * Creates an attachment that registers touch event listeners with { passive: false }

package/dist/DeclarationDetail.svelte

@@ -12,7 +12,7 @@
 </script>
 
 <!-- Metadata -->
-<p class="row justify_content_space_between">
+<p class="row justify-content:space-between">
 	<ModuleLink module_path={declaration.module_path} />
 	{#if declaration.url_github}
 		<!-- eslint-disable-next-line svelte/no-navigation-without-resolve -->
@@ -31,7 +31,7 @@
 
 <!-- type signature -->
 {#if declaration.type_signature}
-	<Code content={declaration.type_signature} lang="ts" class="mb_lg" />
+	<Code lang="ts" content={declaration.type_signature} />
 {/if}
 
 <!-- documentation -->
@@ -63,7 +63,7 @@
 						{/if}
 						{#if param.default_value}
 							<strong>default</strong>
-							<Code content={param.default_value} lang="ts" />
+							<Code lang="ts" content={param.default_value} />
 						{/if}
 					</div>
 				{/if}
@@ -99,7 +99,7 @@
 						{/if}
 						{#if prop.default_value}
 							<strong>default</strong>
-							<Code content={prop.default_value} lang="ts" />
+							<Code lang="ts" content={prop.default_value} />
 						{/if}
 					</div>
 				{/if}
@@ -112,7 +112,7 @@
 {#if declaration.return_type}
 	<section>
 		<h4>returns</h4>
-		<Code content={declaration.return_type} lang="ts" />
+		<Code lang="ts" content={declaration.return_type} />
 		{#if declaration.return_description}
 			<Mdz content={declaration.return_description} />
 		{/if}
@@ -203,7 +203,7 @@
 		{#each declaration.examples as example, i (example)}
 			<Details>
 				{#snippet summary()}Example {i + 1}{/snippet}
-				<Code content={example} lang="ts" />
+				<Code lang="ts" content={example} />
 			</Details>
 		{/each}
 	</section>
@@ -273,7 +273,7 @@
 										{/if}
 										{#if param.default_value}
 											<strong>default</strong>
-											<Code content={param.default_value} lang="ts" />
+											<Code lang="ts" content={param.default_value} />
 										{/if}
 									</div>
 								{/if}

package/dist/DeclarationLink.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
 	import type {SvelteHTMLElements} from 'svelte/elements';
+	import {ensure_start} from '@fuzdev/fuz_util/string.js';
 
 	import {library_context} from './library.svelte.js';
 	import {contextmenu_attachment} from './contextmenu_state.svelte.js';
@@ -7,11 +8,14 @@
 
 	const {
 		name,
+		hash,
 		children,
 		class: class_prop = 'chip',
 		...rest
 	}: SvelteHTMLElements['a'] & {
 		name: string;
+		/** URL fragment to append, with or without the `#`. */
+		hash?: string;
 	} = $props();
 
 	const library = library_context.get();
@@ -31,7 +35,7 @@
 	<a
 		{...rest}
 		class="declaration_link {class_prop}"
-		href={declaration.url_api}
+		href={declaration.url_api + (hash ? ensure_start(hash, '#') : '')}
 		{@attach contextmenu_attachment(contextmenu_entries)}
 	>
 		{#if children}

package/dist/DeclarationLink.svelte.d.ts

@@ -1,6 +1,8 @@
 import type { SvelteHTMLElements } from 'svelte/elements';
 type $$ComponentProps = SvelteHTMLElements['a'] & {
     name: string;
+    /** URL fragment to append, with or without the `#`. */
+    hash?: string;
 };
 declare const DeclarationLink: import("svelte").Component<$$ComponentProps, {}, "">;
 type DeclarationLink = ReturnType<typeof DeclarationLink>;

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

@@ -1 +1 @@
-{"version":3,"file":"DeclarationLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DeclarationLink.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAMvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,GAAG,CAAC,GAAG;IAClD,IAAI,EAAE,MAAM,CAAC;CACb,CAAC;AA+CH,QAAA,MAAM,eAAe,sDAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}
+{"version":3,"file":"DeclarationLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DeclarationLink.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAOvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,GAAG,CAAC,GAAG;IAClD,IAAI,EAAE,MAAM,CAAC;IACb,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAiDH,QAAA,MAAM,eAAe,sDAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/DocsContent.svelte

@@ -22,7 +22,7 @@
 	} = $props();
 </script>
 
-<div {...rest} class="width_upto_md {rest.class}">
+<div {...rest} class="width_atmost_md {rest.class}">
 	{#if header}
 		{@render header()}
 	{:else}

package/dist/DocsLink.svelte

@@ -9,10 +9,13 @@
 
 	const {
 		reference,
+		hash,
 		display_text,
 		children: children_prop,
 	}: {
 		reference: string;
+		/** URL fragment to append, with or without the `#`. */
+		hash?: string;
 		display_text?: string | null;
 		children?: Snippet<[Declaration | undefined, Module | undefined]>;
 	} = $props();
@@ -24,11 +27,11 @@
 </script>
 
 {#if declaration}
-	<DeclarationLink name={reference}>
+	<DeclarationLink name={reference} {hash}>
 		{@render children()}
 	</DeclarationLink>
 {:else if module}
-	<ModuleLink module_path={module.path}>
+	<ModuleLink module_path={module.path} {hash}>
 		{@render children()}
 	</ModuleLink>
 {:else}

package/dist/DocsLink.svelte.d.ts

@@ -3,6 +3,8 @@ import type { Declaration } from './declaration.svelte.js';
 import type { Module } from './module.svelte.js';
 type $$ComponentProps = {
     reference: string;
+    /** URL fragment to append, with or without the `#`. */
+    hash?: string;
     display_text?: string | null;
     children?: Snippet<[Declaration | undefined, Module | undefined]>;
 };

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

@@ -1 +1 @@
-{"version":3,"file":"DocsLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsLink.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AAKpC,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,yBAAyB,CAAC;AACzD,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,oBAAoB,CAAC;AAE9C,KAAK,gBAAgB,GAAI;IACxB,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,WAAW,GAAG,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC;CAClE,CAAC;AAyCH,QAAA,MAAM,QAAQ,sDAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"DocsLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsLink.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AAKpC,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,yBAAyB,CAAC;AACzD,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,oBAAoB,CAAC;AAE9C,KAAK,gBAAgB,GAAI;IACxB,SAAS,EAAE,MAAM,CAAC;IAClB,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,WAAW,GAAG,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC;CAClE,CAAC;AA0CH,QAAA,MAAM,QAAQ,sDAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}

package/dist/DocsPageLinks.svelte

@@ -30,7 +30,7 @@
 </DocsList>
 
 {#snippet content()}
-	<nav aria-label="on this page" class="width_100">
+	<nav aria-label="on this page" class="width:100%">
 		<ul class="unstyled">
 			{#each docs_links.docs_links as item (item.id)}
 				<li

package/dist/DocsSearch.svelte

@@ -23,12 +23,12 @@
 	const has_search = $derived(search_query.trim().length > 0);
 </script>
 
-<label class="display_block position_relative">
+<label class="display:block position:relative">
 	<input {...rest} type="search" {placeholder} bind:value={search_query} />
 	{#if has_search}
 		<button
 			type="button"
-			class="plain icon_button position_absolute right_0 top_0"
+			class="plain icon_button position:absolute right:0 top:0"
 			onclick={() => {
 				search_query = '';
 			}}

package/dist/GithubLink.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import {strip_start} from '@fuzdev/fuz_util/string.js';
+	import {ensure_start, strip_start} from '@fuzdev/fuz_util/string.js';
 	import type {SvelteHTMLElements} from 'svelte/elements';
 	import {DEV} from 'esm-env';
 
@@ -8,6 +8,7 @@
 
 	const {
 		path,
+		hash,
 		href: href_prop,
 		children,
 		...rest
@@ -19,6 +20,8 @@
 		 * @example https://github.com/fuzdev/fuz_ui/issues/123
 		 */
 		path?: string;
+		/** URL fragment to append, with or without the `#`. */
+		hash?: string;
 	} = $props();
 
 	if (DEV) {
@@ -30,12 +33,12 @@
 	}
 
 	const href = $derived(
-		href_prop ??
+		(href_prop ??
 			(path
 				? path.startsWith('https://')
 					? path
 					: `https://github.com/${strip_start(path, '/')}`
-				: ''),
+				: '')) + (hash ? ensure_start(hash, '#') : ''),
 	);
 
 	// extract meaningful display text from the path
@@ -63,8 +66,8 @@
 
 <!-- TODO -next-line doesnt work? -->
 <!-- eslint-disable svelte/no-navigation-without-resolve -->
-<a {...rest} {href} class="github_link white_space_nowrap {rest.class}" rel="noopener"
-	><Svg data={logo_github} inline size="var(--icon_size_xs)" class="mx_xs3 vertical_align_middle" />
+<a {...rest} {href} class="github_link white-space:nowrap {rest.class}" rel="noopener"
+	><Svg data={logo_github} inline size="var(--icon_size_xs)" class="mx_xs3 vertical-align:middle" />
 	{#if typeof final_children === 'string'}
 		<span class="font_family_mono">{final_children}</span>
 	{:else if final_children}

package/dist/GithubLink.svelte.d.ts

@@ -7,6 +7,8 @@ type $$ComponentProps = SvelteHTMLElements['a'] & {
      * @example https://github.com/fuzdev/fuz_ui/issues/123
      */
     path?: string;
+    /** URL fragment to append, with or without the `#`. */
+    hash?: string;
 };
 declare const GithubLink: import("svelte").Component<$$ComponentProps, {}, "">;
 type GithubLink = ReturnType<typeof GithubLink>;

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

@@ -1 +1 @@
-{"version":3,"file":"GithubLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/GithubLink.svelte"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAMvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,GAAG,CAAC,GAAG;IAClD;;;;;OAKG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAmEH,QAAA,MAAM,UAAU,sDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
+{"version":3,"file":"GithubLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/GithubLink.svelte"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAMvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,GAAG,CAAC,GAAG;IAClD;;;;;OAKG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAoEH,QAAA,MAAM,UAAU,sDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}

package/dist/Glyph.svelte

@@ -18,7 +18,7 @@
 
 <span
 	{...rest}
-	class="glyph display_inline_block text_align_center line_height_1 white_space_nowrap font_weight_400 {rest.class}"
+	class="glyph display:inline-block text-align:center line-height:1 white-space:nowrap font-weight:400 {rest.class}"
 	style:width={final_size}
 	style:height={final_size}
 	style:min-width={final_size}

package/dist/ImgOrSvg.svelte

@@ -44,7 +44,7 @@
 		style:width={final_width}
 		style:height={final_height}
 	>
-		<image href={src} class="width_100 height_100" />
+		<image href={src} class="width:100% height:100%" />
 	</svg>
 {:else}
 	<img

package/dist/LibraryDetail.svelte

@@ -48,7 +48,7 @@
 <div class="library_detail">
 	<!-- TODO maybe continue this snippet pattern, or maybe simplify? -->
 	<div class="info">
-		<div class="display_flex flex_1">
+		<div class="display:flex flex:1">
 			<!-- add yet another wrapper so it flows like we want -->
 			<div>
 				<header>

package/dist/LibrarySummary.svelte

@@ -65,7 +65,7 @@
 		{#if description}
 			{@render description(package_json.description, package_json.glyph)}
 		{:else}
-			<p class="text_align_center">
+			<p class="text-align:center">
 				{package_json.description}
 				{#if !package_json.motto}
 					{package_json.glyph}

package/dist/MdnLink.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import {strip_end, strip_start} from '@fuzdev/fuz_util/string.js';
+	import {ensure_start, strip_end, strip_start} from '@fuzdev/fuz_util/string.js';
 	import type {SvelteHTMLElements} from 'svelte/elements';
 
 	import Svg from './Svg.svelte';
@@ -7,16 +7,20 @@
 
 	const {
 		path,
+		hash,
 		children,
 		...rest
 	}: SvelteHTMLElements['a'] & {
 		path: string;
+		/** URL fragment to append, with or without the `#`. */
+		hash?: string;
 	} = $props();
 
 	const href = $derived(
-		path.startsWith('https://')
+		(path.startsWith('https://')
 			? path
-			: `https://developer.mozilla.org/en-US/docs/${strip_start(path, '/')}`,
+			: `https://developer.mozilla.org/en-US/docs/${strip_start(path, '/')}`) +
+			(hash ? ensure_start(hash, '#') : ''),
 	);
 
 	const final_children = $derived(children ?? strip_end(path, '/').split('/').at(-1)!);
@@ -24,8 +28,8 @@
 
 <!-- TODO -next-line doesnt work? -->
 <!-- eslint-disable svelte/no-navigation-without-resolve -->
-<a {...rest} {href} class="mdn_link white_space_nowrap {rest.class}" rel="noopener"
-	><Svg data={logo_mdn} inline size="var(--icon_size_xs)" class="mx_xs3 vertical_align_middle" />
+<a {...rest} {href} class="mdn_link white-space:nowrap {rest.class}" rel="noopener"
+	><Svg data={logo_mdn} inline size="var(--icon_size_xs)" class="mx_xs3 vertical-align:middle" />
 	{#if typeof final_children === 'string'}
 		<span class="font_family_mono">{final_children}</span>
 	{:else}

package/dist/MdnLink.svelte.d.ts

@@ -1,6 +1,8 @@
 import type { SvelteHTMLElements } from 'svelte/elements';
 type $$ComponentProps = SvelteHTMLElements['a'] & {
     path: string;
+    /** URL fragment to append, with or without the `#`. */
+    hash?: string;
 };
 declare const MdnLink: import("svelte").Component<$$ComponentProps, {}, "">;
 type MdnLink = ReturnType<typeof MdnLink>;

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

@@ -1 +1 @@
-{"version":3,"file":"MdnLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/MdnLink.svelte"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAKvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,GAAG,CAAC,GAAG;IAClD,IAAI,EAAE,MAAM,CAAC;CACb,CAAC;AAkCH,QAAA,MAAM,OAAO,sDAAwC,CAAC;AACtD,KAAK,OAAO,GAAG,UAAU,CAAC,OAAO,OAAO,CAAC,CAAC;AAC1C,eAAe,OAAO,CAAC"}
+{"version":3,"file":"MdnLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/MdnLink.svelte"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAKvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,GAAG,CAAC,GAAG;IAClD,IAAI,EAAE,MAAM,CAAC;IACb,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAoCH,QAAA,MAAM,OAAO,sDAAwC,CAAC;AACtD,KAAK,OAAO,GAAG,UAAU,CAAC,OAAO,OAAO,CAAC,CAAC;AAC1C,eAAe,OAAO,CAAC"}

package/dist/Mdz.svelte

@@ -21,8 +21,7 @@
 <svelte:element
 	this={inline ? 'span' : 'div'}
 	{...rest}
-	class:white_space_pre={nowrap}
-	class:white_space_pre_wrap={!nowrap}
+	class="{rest.class} {nowrap ? 'white-space:pre' : 'white-space:pre-wrap'}"
 >
 	{#each nodes as node (node)}
 		<MdzNodeView {node} />

package/dist/ModuleLink.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
 	import type {SvelteHTMLElements} from 'svelte/elements';
+	import {ensure_start} from '@fuzdev/fuz_util/string.js';
 
 	import {library_context} from './library.svelte.js';
 	import {contextmenu_attachment} from './contextmenu_state.svelte.js';
@@ -7,11 +8,14 @@
 
 	const {
 		module_path,
+		hash,
 		children,
 		class: class_prop = 'chip',
 		...rest
 	}: SvelteHTMLElements['a'] & {
 		module_path: string; // TODO maybe rename?
+		/** URL fragment to append, with or without the `#`. */
+		hash?: string;
 	} = $props();
 
 	const library = library_context.get();
@@ -28,7 +32,7 @@
 	<a
 		{...rest}
 		class="module_link {class_prop}"
-		href={module.url_api}
+		href={module.url_api + (hash ? ensure_start(hash, '#') : '')}
 		{@attach contextmenu_attachment(contextmenu_entries)}
 	>
 		<!-- eslint-enable svelte/no-navigation-without-resolve -->

package/dist/ModuleLink.svelte.d.ts

@@ -1,6 +1,8 @@
 import type { SvelteHTMLElements } from 'svelte/elements';
 type $$ComponentProps = SvelteHTMLElements['a'] & {
     module_path: string;
+    /** URL fragment to append, with or without the `#`. */
+    hash?: string;
 };
 declare const ModuleLink: import("svelte").Component<$$ComponentProps, {}, "">;
 type ModuleLink = ReturnType<typeof ModuleLink>;

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

@@ -1 +1 @@
-{"version":3,"file":"ModuleLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/ModuleLink.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAMvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,GAAG,CAAC,GAAG;IAClD,WAAW,EAAE,MAAM,CAAC;CACpB,CAAC;AA6CH,QAAA,MAAM,UAAU,sDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
+{"version":3,"file":"ModuleLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/ModuleLink.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAOvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,GAAG,CAAC,GAAG;IAClD,WAAW,EAAE,MAAM,CAAC;IACpB,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AA+CH,QAAA,MAAM,UAAU,sDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}

package/dist/PendingAnimation.svelte

@@ -21,11 +21,10 @@
 
 <span
 	{...rest}
-	class="pending_animation {rest.class}"
+	class="pending_animation {rest.class} {inline
+		? 'display:inline-flex align-items:center'
+		: 'display:flex'}"
 	class:running
-	class:display_flex={!inline}
-	class:display_inline_flex={inline}
-	class:align_items_center={inline}
 	><span {...item_attrs} style:animation-delay="0s"
 		>{#if children}{@render children(0)}{:else}•{/if}</span
 	><span {...item_attrs} style:animation-delay="0.09s"

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

@@ -1 +1 @@
-{"version":3,"file":"PendingAnimation.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/PendingAnimation.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AAC1D,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAEvD,KAAK,gBAAgB,GAAI,UAAU,CAAC,kBAAkB,CAAC,MAAM,CAAC,EAAE,UAAU,CAAC,GAAG;IAC7E,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC;CACpC,CAAC;AAuBH,QAAA,MAAM,gBAAgB,sDAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"PendingAnimation.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/PendingAnimation.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AAC1D,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAEvD,KAAK,gBAAgB,GAAI,UAAU,CAAC,kBAAkB,CAAC,MAAM,CAAC,EAAE,UAAU,CAAC,GAAG;IAC7E,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC;CACpC,CAAC;AAyBH,QAAA,MAAM,gBAAgB,sDAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}

package/dist/ProjectLinks.svelte

@@ -46,9 +46,9 @@
 	<!-- eslint-disable-next-line svelte/no-navigation-without-resolve -->
 	<a class="thumbnail row bg 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_upto_sm">
+		<div class="pl_lg width_atmost_sm">
 			<div class="thumbnail_name {project_item.color_class}">{project_item.name}</div>
-			<div class="thumbnail_description font_size_md text_color_3 font_weight_500">
+			<div class="thumbnail_description font_size_md text_color_3 font-weight:500">
 				{project_item.description}
 				{project_item.glyph}
 			</div>

package/dist/Svg.svelte

@@ -81,11 +81,10 @@
 	{...data.attrs}
 	{...rest}
 	aria-label={label ?? data.label}
-	class:display_inline_block={inline}
-	class:position_relative={inline}
+	class="{data.attrs?.class} {rest.class}"
+	class:inline
 	style:width={final_width}
 	style:height={final_height}
-	style:top={inline ? '0.1em' : undefined}
 	style:flex-shrink={shrink ? 1 : 0}
 	{style}
 >
@@ -96,3 +95,12 @@
 		{/each}
 	{/if}
 </svg>
+
+<style>
+	.inline {
+		display: inline-block;
+		position: relative;
+		/* TODO idk about this, but vertical align doesnt seem quite right either */
+		top: 0.1em;
+	}
+</style>

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

@@ -1 +1 @@
-{"version":3,"file":"Svg.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/Svg.svelte"],"names":[],"mappings":"AAIC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAExD,MAAM,WAAW,OAAO;IACvB;;;;OAIG;IACH,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACpB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAC,GAAG,kBAAkB,CAAC,MAAM,CAAC,CAAC,GAAG,IAAI,CAAC;IAC/D,KAAK,CAAC,EAAE,kBAAkB,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC;IACzC,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACxB;AAED,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,KAAK,CAAC,GAAG;IACpD,IAAI,EAAE,OAAO,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAyCH,QAAA,MAAM,GAAG,sDAAwC,CAAC;AAClD,KAAK,GAAG,GAAG,UAAU,CAAC,OAAO,GAAG,CAAC,CAAC;AAClC,eAAe,GAAG,CAAC"}
+{"version":3,"file":"Svg.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/Svg.svelte"],"names":[],"mappings":"AAIC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAExD,MAAM,WAAW,OAAO;IACvB;;;;OAIG;IACH,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACpB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAC,GAAG,kBAAkB,CAAC,MAAM,CAAC,CAAC,GAAG,IAAI,CAAC;IAC/D,KAAK,CAAC,EAAE,kBAAkB,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC;IACzC,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACxB;AAED,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,KAAK,CAAC,GAAG;IACpD,IAAI,EAAE,OAAO,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AA2CH,QAAA,MAAM,GAAG,sDAAwC,CAAC;AAClD,KAAK,GAAG,GAAG,UAAU,CAAC,OAAO,GAAG,CAAC,CAAC;AAClC,eAAe,GAAG,CAAC"}

package/dist/TomeContent.svelte

@@ -24,13 +24,13 @@
 
 	tome_context.set(tome); // TODO make reactive?
 
-	const fragment = docs_slugify(tome.name);
+	const fragment = $derived(docs_slugify(tome.name));
 
 	const at_root = $derived(page.url.pathname === resolve(docs_path as any));
 </script>
 
 <section
-	class="tome_content width_upto_md mb_xl9"
+	class="tome_content width_atmost_md mb_xl9"
 	{@attach intersect(() =>
 		at_root
 			? ({intersecting}) => {
@@ -44,7 +44,7 @@
 	)}
 >
 	<header
-		class="mb_xl3 position_sticky top_0"
+		class="mb_xl3 position:sticky top:0"
 		{@attach intersect(() =>
 			at_root
 				? null

package/dist/TomeLink.svelte

@@ -15,10 +15,15 @@
 	}: SvelteHTMLElements['a'] & {
 		name: string; // TODO type, generate from `tomes`?
 		docs_path?: string;
+		/** URL fragment to append, with or without the `#`. */
 		hash?: string;
 	} = $props();
 
-	if (DEV) get_tome_by_name(name); // throws if not found
+	if (DEV) {
+		$effect(() => {
+			get_tome_by_name(name); // throws if not found
+		});
+	}
 
 	// TODO add contextmenu behavior
 </script>

package/dist/TomeLink.svelte.d.ts

@@ -2,6 +2,7 @@ import type { SvelteHTMLElements } from 'svelte/elements';
 type $$ComponentProps = SvelteHTMLElements['a'] & {
     name: string;
     docs_path?: string;
+    /** URL fragment to append, with or without the `#`. */
     hash?: string;
 };
 declare const TomeLink: import("svelte").Component<$$ComponentProps, {}, "">;

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

@@ -1 +1 @@
-{"version":3,"file":"TomeLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/TomeLink.svelte"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAKvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,GAAG,CAAC,GAAG;IAClD,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AA2BH,QAAA,MAAM,QAAQ,sDAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"TomeLink.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/TomeLink.svelte"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAKvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,GAAG,CAAC,GAAG;IAClD,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AA+BH,QAAA,MAAM,QAAQ,sDAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}

package/dist/TomeSectionHeader.svelte

@@ -24,7 +24,7 @@
 		children?: Snippet;
 	} = $props();
 
-	const fragment = docs_slugify(text);
+	const fragment = $derived(docs_slugify(text));
 
 	const register_section_header = register_section_header_context.get();
 	if (!register_section_header) {
@@ -35,7 +35,7 @@
 
 	// Auto-detect tag based on depth if not explicitly provided
 	const depth = section_depth_context.get();
-	const final_tag = tag ?? (depth === 1 ? 'h2' : depth === 2 ? 'h3' : 'h4');
+	const final_tag = $derived(tag ?? (depth === 1 ? 'h2' : depth === 2 ? 'h3' : 'h4'));
 
 	// Get own section's ID from context
 	const my_section_id = section_id_context.get();
@@ -65,7 +65,7 @@
 
 <header>
 	<svelte:element this={final_tag} {...rest} class:tome_section_header={true}>
-		<div class="flex_1">
+		<div class="flex:1">
 			{#if children}
 				{@render children()}
 			{:else}

package/dist/TypeLink.svelte

@@ -4,7 +4,14 @@
 	import DeclarationLink from './DeclarationLink.svelte';
 	import {library_context} from './library.svelte.js';
 
-	const {type}: {type: string} = $props();
+	const {
+		type,
+		hash,
+	}: {
+		type: string;
+		/** URL fragment to append, with or without the `#`. */
+		hash?: string;
+	} = $props();
 
 	const library = library_context.get();
 
@@ -13,7 +20,7 @@
 </script>
 
 {#if library.lookup_declaration(type)}
-	<DeclarationLink name={type} />
+	<DeclarationLink name={type} {hash} />
 {:else}
-	<Code inline content={type} lang="ts" />
+	<Code lang="ts" content={type} inline />
 {/if}

package/dist/TypeLink.svelte.d.ts

@@ -1,5 +1,7 @@
 type $$ComponentProps = {
     type: string;
+    /** URL fragment to append, with or without the `#`. */
+    hash?: string;
 };
 declare const TypeLink: import("svelte").Component<$$ComponentProps, {}, "">;
 type TypeLink = ReturnType<typeof 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":"AAQC,KAAK,gBAAgB,GAAI;IAAC,IAAI,EAAE,MAAM,CAAA;CAAC,CAAC;AAuBzC,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":"AAQC,KAAK,gBAAgB,GAAI;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AA0BH,QAAA,MAAM,QAAQ,sDAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}

package/dist/constants.js

@@ -1,3 +1,3 @@
 // TODO the 60px is a hack, need `--docs_primary_nav_height` exported or :root values from Fuz -- the --space_lg also needs to be kept in sync
-// see also the same issue in Fuz CSS
+// see also the same issue in fuz_css
 export const MAIN_HEADER_MARGIN_TOP = 'calc(60px + var(--space_lg))';

package/dist/contextmenu_helpers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"contextmenu_helpers.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/contextmenu_helpers.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,+BAA+B,CAAC;AAGpE,eAAO,MAAM,iCAAiC,KAAK,CAAC;AACpD,eAAO,MAAM,iCAAiC,KAAK,CAAC;AACpD,eAAO,MAAM,iCAAiC,MAAM,CAAC;AACrD,eAAO,MAAM,yCAAyC,KAAK,CAAC;AAC5D,eAAO,MAAM,sCAAsC,MAAM,CAAC;AAC1D,eAAO,MAAM,4CAA4C,KAAK,CAAC;AAE/D;;GAEG;AACH,eAAO,MAAM,2BAA2B,GACvC,QAAQ,WAAW,GAAG,IAAI,EAC1B,UAAU,OAAO,KACf,MAAM,IAAI,WAAW,GAAG,UAIF,CAAC;AAI1B,eAAO,MAAM,oCAAoC,GAChD,aAAa,gBAAgB,KAC3B,GAAG,CAAC,MAAM,EAAE,MAAM,IAAI,CAWtB,CAAC;AAEJ,eAAO,MAAM,kCAAkC,GAC9C,mBAAmB,GAAG,CAAC,MAAM,EAAE,MAAM,IAAI,CAAC,KACxC,CAAC,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,CAO7B,CAAC;AAEF,eAAO,MAAM,mCAAmC,GAC/C,QAAQ,MAAM,EACd,YAAY,MAAM,EAClB,cAAc,MAAM,KAClB,MAAoE,CAAC;AAExE,eAAO,MAAM,mCAAmC,GAC/C,QAAQ,MAAM,EACd,aAAa,MAAM,EACnB,eAAe,MAAM,KACnB,MAAsE,CAAC"}
+{"version":3,"file":"contextmenu_helpers.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/contextmenu_helpers.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,+BAA+B,CAAC;AAGpE,eAAO,MAAM,iCAAiC,KAAK,CAAC;AACpD,eAAO,MAAM,iCAAiC,KAAK,CAAC;AACpD,eAAO,MAAM,iCAAiC,MAAM,CAAC;AACrD,eAAO,MAAM,yCAAyC,KAAK,CAAC;AAC5D,eAAO,MAAM,sCAAsC,MAAM,CAAC;AAC1D,eAAO,MAAM,4CAA4C,KAAK,CAAC;AAE/D;;GAEG;AACH,eAAO,MAAM,2BAA2B,GACvC,QAAQ,WAAW,GAAG,IAAI,EAC1B,UAAU,OAAO,KACf,MAAM,IAAI,WAAW,GAAG,UAIF,CAAC;AAI1B,eAAO,MAAM,oCAAoC,GAChD,aAAa,gBAAgB,KAC3B,GAAG,CAAC,MAAM,EAAE,MAAM,IAAI,CAWtB,CAAC;AAEJ,eAAO,MAAM,kCAAkC,GAC7C,mBAAmB,GAAG,CAAC,MAAM,EAAE,MAAM,IAAI,CAAC,KAAG,CAAC,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,CAMxE,CAAC;AAEH,eAAO,MAAM,mCAAmC,GAC/C,QAAQ,MAAM,EACd,YAAY,MAAM,EAClB,cAAc,MAAM,KAClB,MAAoE,CAAC;AAExE,eAAO,MAAM,mCAAmC,GAC/C,QAAQ,MAAM,EACd,aAAa,MAAM,EACnB,eAAe,MAAM,KACnB,MAAsE,CAAC"}

package/dist/contextmenu_helpers.js

@@ -26,14 +26,12 @@ export const contextmenu_create_keyboard_handlers = (contextmenu) => new Map([
     [' ', () => contextmenu.activate_selected()],
     ['Enter', () => contextmenu.activate_selected()],
 ]);
-export const contextmenu_create_keydown_handler = (keyboard_handlers) => {
-    return (e) => {
-        const handler = keyboard_handlers.get(e.key);
-        if (!handler || is_editable(e.target))
-            return;
-        swallow(e);
-        handler();
-    };
+export const contextmenu_create_keydown_handler = (keyboard_handlers) => (e) => {
+    const handler = keyboard_handlers.get(e.key);
+    if (!handler || is_editable(e.target))
+        return;
+    swallow(e);
+    handler();
 };
 export const contextmenu_calculate_constrained_x = (menu_x, menu_width, layout_width) => menu_x + Math.min(0, layout_width - (menu_x + menu_width));
 export const contextmenu_calculate_constrained_y = (menu_y, menu_height, layout_height) => menu_y + Math.min(0, layout_height - (menu_y + menu_height));

package/dist/library.svelte.d.ts

@@ -138,6 +138,7 @@ export declare class Library {
             module_comment?: string | undefined;
             dependencies?: string[] | undefined;
             dependents?: string[] | undefined;
+            star_exports?: string[] | undefined;
         }[] | undefined;
     };
     name: string;

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

@@ -1 +1 @@
-{"version":3,"file":"library.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/library.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,kCAAkC,CAAC;AAGlE,OAAO,EAAC,WAAW,EAAC,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAC,MAAM,EAAC,MAAM,oBAAoB,CAAC;AAE1C;;;;;;;;GAQG;AACH,qBAAa,OAAO;IACnB,QAAQ,CAAC,YAAY,EAAE,WAAW,CAAiB;IAEnD,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAA4C;IACxD,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAA2C;IAEtD,IAAI,SAAoC;IACxC,SAAS,SAAyC;IAClD,QAAQ,wCAAwC;IAChD,UAAU,gBAA0C;IACpD,YAAY,+CAA4C;IACxD,QAAQ,+CAAwC;IAChD,QAAQ,SAAwC;IAChD,OAAO,+CAAuC;IAC9C,aAAa,+CAA6C;IAC1D,SAAS,UAAyC;IAElD;;OAEG;IACH,OAAO,gBAML;IAEF;;OAEG;IACH,OAAO,WAIL;IAEF;;OAEG;IACH,cAAc,WAA4E;IAE1F;;OAEG;IACH,YAAY,gBAAmE;IAE/E;;OAEG;IACH,eAAe,2BAAgE;gBAEnE,YAAY,EAAE,WAAW;IAIrC;;OAEG;IACH,kBAAkB,CAAC,IAAI,EAAE,MAAM,GAAG,WAAW,GAAG,SAAS;IAIzD;;OAEG;IACH,eAAe,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAItC;;OAEG;IACH,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS;IAI/C;;OAEG;IACH,mBAAmB,CAAC,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,WAAW,CAAC;CAGtD;AAED,eAAO,MAAM,eAAe;;;;CAA4B,CAAC"}
+{"version":3,"file":"library.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/library.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,kCAAkC,CAAC;AAGlE,OAAO,EAAC,WAAW,EAAC,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAC,MAAM,EAAC,MAAM,oBAAoB,CAAC;AAE1C;;;;;;;;GAQG;AACH,qBAAa,OAAO;IACnB,QAAQ,CAAC,YAAY,EAAE,WAAW,CAAiB;IAEnD,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAA4C;IACxD,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAA2C;IAEtD,IAAI,SAAoC;IACxC,SAAS,SAAyC;IAClD,QAAQ,wCAAwC;IAChD,UAAU,gBAA0C;IACpD,YAAY,+CAA4C;IACxD,QAAQ,+CAAwC;IAChD,QAAQ,SAAwC;IAChD,OAAO,+CAAuC;IAC9C,aAAa,+CAA6C;IAC1D,SAAS,UAAyC;IAElD;;OAEG;IACH,OAAO,gBAML;IAEF;;OAEG;IACH,OAAO,WAIL;IAEF;;OAEG;IACH,cAAc,WAA4E;IAE1F;;OAEG;IACH,YAAY,gBAAmE;IAE/E;;OAEG;IACH,eAAe,2BAAgE;gBAEnE,YAAY,EAAE,WAAW;IAIrC;;OAEG;IACH,kBAAkB,CAAC,IAAI,EAAE,MAAM,GAAG,WAAW,GAAG,SAAS;IAIzD;;OAEG;IACH,eAAe,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAItC;;OAEG;IACH,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS;IAI/C;;OAEG;IACH,mBAAmB,CAAC,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,WAAW,CAAC;CAGtD;AAED,eAAO,MAAM,eAAe;;;;CAA4B,CAAC"}

package/dist/library_analysis.d.ts

@@ -91,7 +91,7 @@ export interface ModuleAnalysis {
  * Analyze a source file and extract module metadata.
  *
  * Unified entry point that dispatches to the appropriate analyzer based on file type:
- * - TypeScript/JavaScript files → `ts_analyze_module`
+ * - TypeScript/JS files → `ts_analyze_module`
  * - Svelte components → `svelte_analyze_module`
  *
  * Returns raw analysis data including `nodocs` flags on declarations.

package/dist/library_analysis.js

@@ -50,7 +50,7 @@ import { module_extract_path, } from './module_helpers.js';
  * Analyze a source file and extract module metadata.
  *
  * Unified entry point that dispatches to the appropriate analyzer based on file type:
- * - TypeScript/JavaScript files → `ts_analyze_module`
+ * - TypeScript/JS files → `ts_analyze_module`
  * - Svelte components → `svelte_analyze_module`
  *
  * Returns raw analysis data including `nodocs` flags on declarations.

package/dist/library_gen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"library_gen.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/library_gen.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAC,GAAG,EAAC,MAAM,eAAe,CAAC;AAEvC,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,2BAA2B,CAAC;AAExD,OAAO,EACN,KAAK,cAAc,EACnB,KAAK,mBAAmB,EACxB,KAAK,mBAAmB,EAKxB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAmB,KAAK,oBAAoB,EAAC,MAAM,uBAAuB,CAAC;AAElF,0CAA0C;AAC1C,MAAM,WAAW,iBAAiB;IACjC;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,mBAAmB,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC;IAC5D;;;;;;;;;;;;;;;;;;OAkBG;IACH,aAAa,CAAC,EAAE,oBAAoB,CAAC;CACrC;AAED;;;;;;GAMG;AACH,eAAO,MAAM,yBAAyB,GAAI,UAAU,QAAQ,KAAG,cAY9D,CAAC;AAEF;;;;;;;;;;GAUG;AACH,eAAO,MAAM,2CAA2C,GACvD,WAAW,QAAQ,CAAC,QAAQ,CAAC,EAC7B,SAAS,mBAAmB,EAC5B,MAAM;IAAC,IAAI,EAAE,CAAC,GAAG,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IAAC,IAAI,EAAE,CAAC,GAAG,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,IAAI,CAAA;CAAC,KACtF,KAAK,CAAC,cAAc,CA6BtB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,WAAW,GAAI,UAAU,iBAAiB,KAAG,GA0CzD,CAAC"}
+{"version":3,"file":"library_gen.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/library_gen.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAC,GAAG,EAAC,MAAM,eAAe,CAAC;AAEvC,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,2BAA2B,CAAC;AAExD,OAAO,EACN,KAAK,cAAc,EACnB,KAAK,mBAAmB,EACxB,KAAK,mBAAmB,EAKxB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAmB,KAAK,oBAAoB,EAAC,MAAM,uBAAuB,CAAC;AAElF,0CAA0C;AAC1C,MAAM,WAAW,iBAAiB;IACjC;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,mBAAmB,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC;IAC5D;;;;;;;;;;;;;;;;;;OAkBG;IACH,aAAa,CAAC,EAAE,oBAAoB,CAAC;CACrC;AAED;;;;;;GAMG;AACH,eAAO,MAAM,yBAAyB,GAAI,UAAU,QAAQ,KAAG,cAY9D,CAAC;AAEF;;;;;;;;;;GAUG;AACH,eAAO,MAAM,2CAA2C,GACvD,WAAW,QAAQ,CAAC,QAAQ,CAAC,EAC7B,SAAS,mBAAmB,EAC5B,MAAM;IAAC,IAAI,EAAE,CAAC,GAAG,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IAAC,IAAI,EAAE,CAAC,GAAG,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,IAAI,CAAA;CAAC,KACtF,KAAK,CAAC,cAAc,CA6BtB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,WAAW,GAAI,UAAU,iBAAiB,KAAG,GA2CzD,CAAC"}

package/dist/library_gen.js

@@ -91,6 +91,7 @@ export const library_collect_source_files_from_disknodes = (disknodes, options,
  */
 export const library_gen = (options) => {
     return {
+        dependencies: 'all',
         generate: async ({ log, filer }) => {
             log.info('generating library metadata with full TypeScript analysis...');
             // Build source options with project_root from cwd

package/dist/logos.js

@@ -9,7 +9,7 @@ Logo colors are the midpoint between the light and dark versions of color varian
 --color_c: #d93636;
 --color_d: #8866cc;
 --color_e: #d8bc31;
---color_f: #84522a; // TODO this one isn't the midpoint bc Fuz CSS's color needs tweaking, too light in dark mode
+--color_f: #84522a; // TODO this one isn't the midpoint bc fuz_css's color needs tweaking, too light in dark mode
 --color_g: #e55d95;
 --color_h: #f4672f;
 --color_i: #36e2e2;

package/dist/module_helpers.d.ts

@@ -11,7 +11,7 @@
 /**
  * Analyzer type for source files.
  *
- * - `'typescript'` - TypeScript/JavaScript files analyzed via TypeScript Compiler API
+ * - `'typescript'` - TypeScript/JS files analyzed via TypeScript Compiler API
  * - `'svelte'` - Svelte components analyzed via svelte2tsx + TypeScript Compiler API
  */
 export type AnalyzerType = 'typescript' | 'svelte';
@@ -243,7 +243,7 @@ export declare const module_get_component_name: (module_path: string) => string;
  */
 export declare const module_get_key: (module_path: string) => string;
 /**
- * Check if a path is a TypeScript or JavaScript file.
+ * Check if a path is a TypeScript or JS file.
  *
  * Includes both `.ts` and `.js` files since JS files are valid in TS projects.
  * Excludes `.d.ts` declaration files - use a custom `get_analyzer` to include them.

package/dist/module_helpers.js

@@ -213,7 +213,7 @@ export const module_get_component_name = (module_path) => module_path.replace(/^
  */
 export const module_get_key = (module_path) => `./${module_path}`;
 /**
- * Check if a path is a TypeScript or JavaScript file.
+ * Check if a path is a TypeScript or JS file.
  *
  * Includes both `.ts` and `.js` files since JS files are valid in TS projects.
  * Excludes `.d.ts` declaration files - use a custom `get_analyzer` to include them.

package/dist/tome.d.ts

@@ -9,6 +9,9 @@ export declare const Tome: z.ZodObject<{
     related_declarations: z.ZodArray<z.ZodString>;
 }, z.core.$strip>;
 export type Tome = z.infer<typeof Tome>;
+/**
+ * @param hash - URL fragment to append, with or without the `#`.
+ */
 export declare const to_tome_pathname: (item: Tome | string, docs_path?: string, hash?: string) => string;
 export declare const tomes_context: {
     get: (error_message?: string) => Map<string, {

package/dist/tome.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tome.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/tome.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,QAAQ,CAAC;AACtC,OAAO,EAAC,CAAC,EAAC,MAAM,KAAK,CAAC;AAKtB,eAAO,MAAM,IAAI;;;;;;;iBAQf,CAAC;AACH,MAAM,MAAM,IAAI,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,IAAI,CAAC,CAAC;AAExC,eAAO,MAAM,gBAAgB,GAC5B,MAAM,IAAI,GAAG,MAAM,EACnB,kBAA6B,EAC7B,OAAO,MAAM,KACX,MAIF,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAsC,CAAC;AAEjE,eAAO,MAAM,gBAAgB,GAAI,MAAM,MAAM,KAAG,IAK/C,CAAC;AAEF,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAyB,CAAC"}
+{"version":3,"file":"tome.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/tome.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,QAAQ,CAAC;AACtC,OAAO,EAAC,CAAC,EAAC,MAAM,KAAK,CAAC;AAMtB,eAAO,MAAM,IAAI;;;;;;;iBAQf,CAAC;AACH,MAAM,MAAM,IAAI,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,IAAI,CAAC,CAAC;AAExC;;GAEG;AACH,eAAO,MAAM,gBAAgB,GAC5B,MAAM,IAAI,GAAG,MAAM,EACnB,kBAA6B,EAC7B,OAAO,MAAM,KACX,MAIF,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAsC,CAAC;AAEjE,eAAO,MAAM,gBAAgB,GAAI,MAAM,MAAM,KAAG,IAK/C,CAAC;AAEF,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAyB,CAAC"}

package/dist/tome.js

@@ -1,5 +1,6 @@
 import { resolve } from '$app/paths';
 import { z } from 'zod';
+import { ensure_start } from '@fuzdev/fuz_util/string.js';
 import { create_context } from './context_helpers.js';
 import { DOCS_PATH_DEFAULT, docs_slugify } from './docs_helpers.svelte.js';
 export const Tome = z.object({
@@ -11,10 +12,13 @@ export const Tome = z.object({
     related_modules: z.array(z.string()),
     related_declarations: z.array(z.string()),
 });
+/**
+ * @param hash - URL fragment to append, with or without the `#`.
+ */
 export const to_tome_pathname = (item, docs_path = DOCS_PATH_DEFAULT, hash) => {
     const name = typeof item === 'string' ? item : item.name;
     const path = docs_path + '/' + docs_slugify(name);
-    return resolve((hash ? path + '#' + hash : path));
+    return resolve((hash ? path + ensure_start(hash, '#') : path));
 };
 export const tomes_context = create_context();
 export const get_tome_by_name = (name) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fuzdev/fuz_ui",
-  "version": "0.177.0",
+  "version": "0.178.0",
   "description": "Svelte UI library",
   "motto": "friendly user zystem",
   "glyph": "🧶",
@@ -61,9 +61,9 @@
   },
   "devDependencies": {
     "@changesets/changelog-git": "^0.2.1",
-    "@fuzdev/fuz_code": "^0.38.0",
-    "@fuzdev/fuz_css": "^0.42.1",
-    "@fuzdev/fuz_util": "^0.45.1",
+    "@fuzdev/fuz_code": "^0.39.0",
+    "@fuzdev/fuz_css": "^0.44.0",
+    "@fuzdev/fuz_util": "^0.45.3",
     "@jridgewell/trace-mapping": "^0.3.31",
     "@ryanatkn/eslint-config": "^0.9.0",
     "@ryanatkn/gro": "^0.183.0",
@@ -72,6 +72,7 @@
     "@sveltejs/package": "^2.5.7",
     "@sveltejs/vite-plugin-svelte": "^6.2.1",
     "@types/node": "^24.10.1",
+    "@webref/css": "^8.2.0",
     "eslint": "^9.39.1",
     "eslint-plugin-svelte": "^3.13.1",
     "esm-env": "^1.2.2",

package/src/lib/constants.ts

@@ -1,3 +1,3 @@
 // TODO the 60px is a hack, need `--docs_primary_nav_height` exported or :root values from Fuz -- the --space_lg also needs to be kept in sync
-// see also the same issue in Fuz CSS
+// see also the same issue in fuz_css
 export const MAIN_HEADER_MARGIN_TOP = 'calc(60px + var(--space_lg))';

package/src/lib/contextmenu_helpers.ts

@@ -39,16 +39,14 @@ export const contextmenu_create_keyboard_handlers = (
 		['Enter', () => contextmenu.activate_selected()],
 	]);
 
-export const contextmenu_create_keydown_handler = (
-	keyboard_handlers: Map<string, () => void>,
-): ((e: KeyboardEvent) => void) => {
-	return (e: KeyboardEvent): void => {
+export const contextmenu_create_keydown_handler =
+	(keyboard_handlers: Map<string, () => void>): ((e: KeyboardEvent) => void) =>
+	(e: KeyboardEvent): void => {
 		const handler = keyboard_handlers.get(e.key);
 		if (!handler || is_editable(e.target)) return;
 		swallow(e);
 		handler();
 	};
-};
 
 export const contextmenu_calculate_constrained_x = (
 	menu_x: number,

package/src/lib/library_analysis.ts

@@ -103,7 +103,7 @@ export interface ModuleAnalysis {
  * Analyze a source file and extract module metadata.
  *
  * Unified entry point that dispatches to the appropriate analyzer based on file type:
- * - TypeScript/JavaScript files → `ts_analyze_module`
+ * - TypeScript/JS files → `ts_analyze_module`
  * - Svelte components → `svelte_analyze_module`
  *
  * Returns raw analysis data including `nodocs` flags on declarations.

package/src/lib/library_gen.ts

@@ -150,6 +150,7 @@ export const library_collect_source_files_from_disknodes = (
  */
 export const library_gen = (options?: LibraryGenOptions): Gen => {
 	return {
+		dependencies: 'all',
 		generate: async ({log, filer}) => {
 			log.info('generating library metadata with full TypeScript analysis...');
 

package/src/lib/logos.ts

@@ -12,7 +12,7 @@ Logo colors are the midpoint between the light and dark versions of color varian
 --color_c: #d93636;
 --color_d: #8866cc;
 --color_e: #d8bc31;
---color_f: #84522a; // TODO this one isn't the midpoint bc Fuz CSS's color needs tweaking, too light in dark mode
+--color_f: #84522a; // TODO this one isn't the midpoint bc fuz_css's color needs tweaking, too light in dark mode
 --color_g: #e55d95;
 --color_h: #f4672f;
 --color_i: #36e2e2;

package/src/lib/module_helpers.ts

@@ -12,7 +12,7 @@
 /**
  * Analyzer type for source files.
  *
- * - `'typescript'` - TypeScript/JavaScript files analyzed via TypeScript Compiler API
+ * - `'typescript'` - TypeScript/JS files analyzed via TypeScript Compiler API
  * - `'svelte'` - Svelte components analyzed via svelte2tsx + TypeScript Compiler API
  */
 export type AnalyzerType = 'typescript' | 'svelte';
@@ -362,7 +362,7 @@ export const module_get_component_name = (module_path: string): string =>
 export const module_get_key = (module_path: string): string => `./${module_path}`;
 
 /**
- * Check if a path is a TypeScript or JavaScript file.
+ * Check if a path is a TypeScript or JS file.
  *
  * Includes both `.ts` and `.js` files since JS files are valid in TS projects.
  * Excludes `.d.ts` declaration files - use a custom `get_analyzer` to include them.

package/src/lib/tome.ts

@@ -1,6 +1,7 @@
 import {resolve} from '$app/paths';
 import type {Component} from 'svelte';
 import {z} from 'zod';
+import {ensure_start} from '@fuzdev/fuz_util/string.js';
 
 import {create_context} from './context_helpers.js';
 import {DOCS_PATH_DEFAULT, docs_slugify} from './docs_helpers.svelte.js';
@@ -16,6 +17,9 @@ export const Tome = z.object({
 });
 export type Tome = z.infer<typeof Tome>;
 
+/**
+ * @param hash - URL fragment to append, with or without the `#`.
+ */
 export const to_tome_pathname = (
 	item: Tome | string,
 	docs_path = DOCS_PATH_DEFAULT,
@@ -23,7 +27,7 @@ export const to_tome_pathname = (
 ): string => {
 	const name = typeof item === 'string' ? item : item.name;
 	const path = docs_path + '/' + docs_slugify(name);
-	return resolve((hash ? path + '#' + hash : path) as any);
+	return resolve((hash ? path + ensure_start(hash, '#') : path) as any);
 };
 
 export const tomes_context = create_context<Map<string, Tome>>();