@fuzdev/fuz_ui 0.171.0 → 0.173.0

package/LICENSE

@@ -1,6 +1,6 @@
-The MIT License (MIT)
+MIT License
 
-Copyright (c) Ryan Atkinson <mail@ryanatkn.com> <https://ryanatkn.com/>
+Copyright (c) fuz.dev
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -19,7 +19,7 @@ Feel free to take the ideas and code for your own purposes.
 
 The Svelte components and helpers:
 
-- builds on my CSS framework [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,
   and my utility library [`@fuzdev/fuz_util`](https://github.com/fuzdev/fuz_util)

package/dist/Alert.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import type {Snippet} from 'svelte';
-	import type {HTMLAttributes} from 'svelte/elements';
+	import type {SvelteHTMLElements} from 'svelte/elements';
 
 	import {alert_status_options, type AlertStatus} from './alert.js';
 
@@ -15,22 +15,22 @@
 		color,
 		onclick,
 		disabled,
-		attrs,
 		icon,
 		children,
-	}: {
-		status?: AlertStatus;
-		color?: string;
-		// TODO this API is a mess in part because of the types, maybe an explicit `AlertButton` is better,
-		// or rethink the design because `role="alert"` can't be put on buttons.
-		// $props must be destructured, so we can't use a union with narrowing right?
-		// so `disabled` only makes sense if `onclick` is defined, and we dont get the other HTMLButtonElement attributes
-		onclick?: (() => void) | undefined;
-		disabled?: boolean;
-		attrs?: HTMLAttributes<HTMLElement> | undefined;
-		icon?: string | Snippet<[icon: string]> | null | undefined; // TODO experimenting with this, gets complex in the impl
-		children: Snippet;
-	} = $props();
+		...rest
+	}: SvelteHTMLElements['div'] &
+		SvelteHTMLElements['button'] & {
+			status?: AlertStatus;
+			color?: string;
+			// TODO this API is a mess in part because of the types, maybe an explicit `AlertButton` is better,
+			// or rethink the design because `role="alert"` can't be put on buttons.
+			// $props must be destructured, so we can't use a union with narrowing right?
+			// so `disabled` only makes sense if `onclick` is defined, and we dont get the other HTMLButtonElement attributes
+			onclick?: (() => void) | undefined;
+			disabled?: boolean;
+			icon?: string | Snippet<[icon: string]> | null | undefined; // TODO experimenting with this, gets complex in the impl
+			children: Snippet;
+		} = $props();
 
 	const options = $derived(alert_status_options[status]);
 	// TODO change this to use the hue and put transparency on the borders, or add a borderColor option
@@ -43,17 +43,17 @@
 
 {#if onclick}
 	<button
-		class="message"
 		type="button"
+		{...rest}
+		class="alert {rest.class}"
 		style:--text_color={final_color}
 		{onclick}
 		{disabled}
-		{...attrs}
 	>
 		{@render content()}
 	</button>
 {:else}
-	<div role="alert" class="message panel" style:--text_color={final_color} {...attrs}>
+	<div role="alert" {...rest} class="alert panel {rest.class}" style:--text_color={final_color}>
 		{@render content()}
 	</div>
 {/if}
@@ -75,8 +75,8 @@
 {/snippet}
 
 <style>
-	.message {
-		min-height: var(--message_min_height);
+	.alert {
+		min-height: var(--alert_min_height);
 		width: 100%;
 		color: var(--text_color);
 		font-size: var(--font_size_md);
@@ -89,7 +89,7 @@
 		padding: var(--space_xs2) var(--space_lg) var(--space_xs2) var(--space_xs);
 		margin-bottom: var(--space_lg);
 	}
-	.message:last-child {
+	.alert:last-child {
 		margin-bottom: 0;
 	}
 	.icon {

package/dist/Alert.svelte.d.ts

@@ -1,12 +1,11 @@
 import type { Snippet } from 'svelte';
-import type { HTMLAttributes } from 'svelte/elements';
+import type { SvelteHTMLElements } from 'svelte/elements';
 import { type AlertStatus } from './alert.js';
-type $$ComponentProps = {
+type $$ComponentProps = SvelteHTMLElements['div'] & SvelteHTMLElements['button'] & {
     status?: AlertStatus;
     color?: string;
     onclick?: (() => void) | undefined;
     disabled?: boolean;
-    attrs?: HTMLAttributes<HTMLElement> | undefined;
     icon?: string | Snippet<[icon: string]> | null | undefined;
     children: Snippet;
 };

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

@@ -1 +1 @@
-{"version":3,"file":"Alert.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/Alert.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,iBAAiB,CAAC;AAEpD,OAAO,EAAuB,KAAK,WAAW,EAAC,MAAM,YAAY,CAAC;AAEjE,KAAK,gBAAgB,GAAI;IACxB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IAKf,OAAO,CAAC,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG,SAAS,CAAC;IAChD,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;IAC3D,QAAQ,EAAE,OAAO,CAAC;CAClB,CAAC;AA8DH,QAAA,MAAM,KAAK,sDAAwC,CAAC;AACpD,KAAK,KAAK,GAAG,UAAU,CAAC,OAAO,KAAK,CAAC,CAAC;AACtC,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Alert.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/Alert.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAExD,OAAO,EAAuB,KAAK,WAAW,EAAC,MAAM,YAAY,CAAC;AAEjE,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,KAAK,CAAC,GACjD,kBAAkB,CAAC,QAAQ,CAAC,GAAG;IAC9B,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IAKf,OAAO,CAAC,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;IAC3D,QAAQ,EAAE,OAAO,CAAC;CAClB,CAAC;AA8DJ,QAAA,MAAM,KAAK,sDAAwC,CAAC;AACpD,KAAK,KAAK,GAAG,UAAU,CAAC,OAAO,KAAK,CAAC,CAAC;AACtC,eAAe,KAAK,CAAC"}

package/dist/Breadcrumb.svelte

@@ -4,6 +4,7 @@
 	import {page} from '$app/state';
 	import type {Snippet} from 'svelte';
 	import {strip_start, ensure_end} from '@fuzdev/fuz_util/string.js';
+	import type {SvelteHTMLElements} from 'svelte/elements';
 
 	const {
 		path,
@@ -11,7 +12,8 @@
 		base_path,
 		separator,
 		children,
-	}: {
+		...rest
+	}: SvelteHTMLElements['div'] & {
 		/**
 		 * Prefixed with a slash and relative to the base path.
 		 */
@@ -46,7 +48,7 @@
 	// `transition:slide={{axis: 'x'}}`
 </script>
 
-<div class="breadcrumb">
+<div {...rest} class="breadcrumb {rest.class}">
 	<!-- eslint-disable-next-line svelte/no-navigation-without-resolve -->
 	<a href={root_path} class:selected={root_path === final_base_path + final_selected_path}
 		>{#if children}{@render children()}{:else}•{/if}</a

package/dist/Breadcrumb.svelte.d.ts

@@ -1,5 +1,6 @@
 import type { Snippet } from 'svelte';
-type $$ComponentProps = {
+import type { SvelteHTMLElements } from 'svelte/elements';
+type $$ComponentProps = SvelteHTMLElements['div'] & {
     /**
      * Prefixed with a slash and relative to the base path.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumb.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/Breadcrumb.svelte"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AAGnC,KAAK,gBAAgB,GAAI;IACxB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IAC1C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAyCH,QAAA,MAAM,UAAU,sDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
+{"version":3,"file":"Breadcrumb.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/Breadcrumb.svelte"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AAEpC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAEvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,KAAK,CAAC,GAAG;IACpD;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IAC1C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AA2CH,QAAA,MAAM,UAAU,sDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}

package/dist/Card.svelte

@@ -1,24 +1,24 @@
 <script lang="ts">
 	import {page} from '$app/state';
 	import type {Snippet} from 'svelte';
+	import type {SvelteHTMLElements} from 'svelte/elements';
 
 	// TODO think through Alert+Card APIs together, one can be a button and the other a link atm
 
 	const {
-		tag,
 		href,
+		tag,
 		align = 'left',
-		attrs,
 		icon,
 		children,
-	}: {
-		tag?: string | undefined;
-		href?: string | undefined;
-		align?: 'left' | 'right' | 'above' | 'below';
-		attrs?: any; // type? what about the optional tag though? (button etc - maybe API should be more explicit)
-		icon?: string | Snippet;
-		children: Snippet;
-	} = $props();
+		...rest
+	}: SvelteHTMLElements['div'] &
+		SvelteHTMLElements['a'] & {
+			tag?: string | undefined;
+			align?: 'left' | 'right' | 'above' | 'below';
+			icon?: string | Snippet;
+			children: Snippet;
+		} = $props();
 
 	const link = $derived(!!href);
 	const selected = $derived(link && page.url.pathname === href);
@@ -30,15 +30,14 @@
 	const above = $derived(align === 'above');
 	const below = $derived(align === 'below');
 
-	const fallback_icon = $derived(link ? '🔗' : '🪧');
-	const final_icon: string | Snippet = $derived(icon ?? fallback_icon);
+	const final_icon: string | Snippet = $derived(icon ?? (link ? '🔗' : '🪧'));
 </script>
 
 <svelte:element
 	this={final_tag}
-	class="card"
-	{...attrs}
+	{...rest}
 	{...inferred_attrs}
+	class="card {rest.class}"
 	class:link
 	class:selected
 	class:left

package/dist/Card.svelte.d.ts

@@ -1,9 +1,8 @@
 import type { Snippet } from 'svelte';
-type $$ComponentProps = {
+import type { SvelteHTMLElements } from 'svelte/elements';
+type $$ComponentProps = SvelteHTMLElements['div'] & SvelteHTMLElements['a'] & {
     tag?: string | undefined;
-    href?: string | undefined;
     align?: 'left' | 'right' | 'above' | 'below';
-    attrs?: any;
     icon?: string | Snippet;
     children: Snippet;
 };

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

@@ -1 +1 @@
-{"version":3,"file":"Card.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/Card.svelte"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AAEnC,KAAK,gBAAgB,GAAI;IACxB,GAAG,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;IAC7C,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,QAAQ,EAAE,OAAO,CAAC;CAClB,CAAC;AAyDH,QAAA,MAAM,IAAI,sDAAwC,CAAC;AACnD,KAAK,IAAI,GAAG,UAAU,CAAC,OAAO,IAAI,CAAC,CAAC;AACpC,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Card.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/Card.svelte"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAEvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,KAAK,CAAC,GACjD,kBAAkB,CAAC,GAAG,CAAC,GAAG;IACzB,GAAG,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;IAC7C,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,QAAQ,EAAE,OAAO,CAAC;CAClB,CAAC;AAyDJ,QAAA,MAAM,IAAI,sDAAwC,CAAC;AACnD,KAAK,IAAI,GAAG,UAAU,CAAC,OAAO,IAAI,CAAC,CAAC;AACpC,eAAe,IAAI,CAAC"}

package/dist/ColorSchemeInput.svelte

@@ -1,23 +1,21 @@
 <script lang="ts">
 	import {swallow} from '@fuzdev/fuz_util/dom.js';
 	import {color_schemes, type ColorScheme} from '@fuzdev/fuz_css/theme.js';
+	import type {SvelteHTMLElements} from 'svelte/elements';
 
 	import {themer_context} from './themer.svelte.js';
 
 	const {
 		value = themer_context.get(),
-		onchange = (color_scheme) => {
-			value.color_scheme = color_scheme; // won't work with POJOs but users could provide their own onchange in that case
-		},
-	}: {
+		...rest
+	}: SvelteHTMLElements['menu'] & {
 		value?: {color_scheme: ColorScheme};
-		onchange?: (color_scheme: ColorScheme) => void;
 	} = $props();
 </script>
 
 <!-- TODO maybe support menubar aria
 https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/menubar_role -->
-<menu class="color_scheme_control unstyled">
+<menu {...rest} class="color_scheme_control unstyled {rest.class}">
 	{#each color_schemes as color_scheme (color_scheme)}
 		{@const selected = color_scheme === value.color_scheme}
 		<button
@@ -31,7 +29,7 @@ https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/menubar_ro
 			aria-checked={selected}
 			onclick={(e) => {
 				swallow(e);
-				onchange(color_scheme);
+				value.color_scheme = color_scheme;
 			}}
 		>
 			<div class="content">{color_scheme}</div>

package/dist/ColorSchemeInput.svelte.d.ts

@@ -1,9 +1,9 @@
 import { type ColorScheme } from '@fuzdev/fuz_css/theme.js';
-type $$ComponentProps = {
+import type { SvelteHTMLElements } from 'svelte/elements';
+type $$ComponentProps = SvelteHTMLElements['menu'] & {
     value?: {
         color_scheme: ColorScheme;
     };
-    onchange?: (color_scheme: ColorScheme) => void;
 };
 declare const ColorSchemeInput: import("svelte").Component<$$ComponentProps, {}, "">;
 type ColorSchemeInput = ReturnType<typeof ColorSchemeInput>;

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

@@ -1 +1 @@
-{"version":3,"file":"ColorSchemeInput.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/ColorSchemeInput.svelte"],"names":[],"mappings":"AAIA,OAAO,EAAgB,KAAK,WAAW,EAAC,MAAM,0BAA0B,CAAC;AAIxE,KAAK,gBAAgB,GAAI;IACxB,KAAK,CAAC,EAAE;QAAC,YAAY,EAAE,WAAW,CAAA;KAAC,CAAC;IACpC,QAAQ,CAAC,EAAE,CAAC,YAAY,EAAE,WAAW,KAAK,IAAI,CAAC;CAC/C,CAAC;AAkCH,QAAA,MAAM,gBAAgB,sDAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"ColorSchemeInput.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/ColorSchemeInput.svelte"],"names":[],"mappings":"AAIA,OAAO,EAAgB,KAAK,WAAW,EAAC,MAAM,0BAA0B,CAAC;AACzE,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAIvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,MAAM,CAAC,GAAG;IACrD,KAAK,CAAC,EAAE;QAAC,YAAY,EAAE,WAAW,CAAA;KAAC,CAAC;CACpC,CAAC;AAiCH,QAAA,MAAM,gBAAgB,sDAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}

package/dist/Contextmenu.svelte

@@ -6,13 +6,12 @@
 
 	const {
 		tag = 'span' as T, // TODO why is casting needed?
-		attrs,
 		entries,
 		children,
-	}: {
+		...rest
+	}: SvelteHTMLElements[T] & {
 		// TODO custom tag?
 		tag?: T;
-		attrs?: SvelteHTMLElements[T];
 		entries: Snippet;
 		children: Snippet;
 	} = $props();
@@ -24,7 +23,7 @@
 
 <svelte:element
 	this={tag}
-	class="display_contents"
-	{...attrs}
+	style:display="contents"
+	{...rest}
 	{@attach contextmenu_attachment(entries)}>{@render children()}</svelte:element
 >

package/dist/Contextmenu.svelte.d.ts

@@ -1,9 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { SvelteHTMLElements } from 'svelte/elements';
 declare function $$render<T extends string = 'span'>(): {
-    props: {
+    props: SvelteHTMLElements[T] & {
         tag?: T;
-        attrs?: SvelteHTMLElements[T];
         entries: Snippet;
         children: Snippet;
     };

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

@@ -1 +1 @@
-{"version":3,"file":"Contextmenu.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/Contextmenu.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAGxD,iBAAS,QAAQ,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;;cAOnC,CAAC;gBACC,kBAAkB,CAAC,CAAC,CAAC;iBACpB,OAAO;kBACN,OAAO;;;;;;EAkBsG;AACzH,cAAM,iBAAiB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IAC7C,KAAK,IAAI,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAChD,MAAM,IAAI,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC;IAClD,KAAK,IAAI,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAChD,QAAQ;IACR,OAAO;CACV;AAED,UAAU,qBAAqB;IAC3B,KAAK,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAA;KAAE,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IACpZ,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IACnJ,YAAY,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC;CACjE;AACD,QAAA,MAAM,WAAW,EAAE,qBAAmC,CAAC;AACrC,KAAK,WAAW,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,IAAI,YAAY,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;AACpF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"Contextmenu.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/Contextmenu.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAGxD,iBAAS,QAAQ,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;;cAOnC,CAAC;iBACE,OAAO;kBACN,OAAO;;;;;;EAkBsG;AACzH,cAAM,iBAAiB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IAC7C,KAAK,IAAI,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAChD,MAAM,IAAI,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC;IAClD,KAAK,IAAI,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAChD,QAAQ;IACR,OAAO;CACV;AAED,UAAU,qBAAqB;IAC3B,KAAK,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAA;KAAE,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IACpZ,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IACnJ,YAAY,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC;CACjE;AACD,QAAA,MAAM,WAAW,EAAE,qBAAmC,CAAC;AACrC,KAAK,WAAW,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,IAAI,YAAY,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;AACpF,eAAe,WAAW,CAAC"}

package/dist/CopyToClipboard.svelte

@@ -16,7 +16,6 @@
 		oncopy,
 		disabled: disabled_prop,
 		children,
-		class: class_prop,
 		...rest
 	}: OmitStrict<SvelteHTMLElements['button'], 'children'> & {
 		text: string | null;
@@ -63,7 +62,7 @@
 	type="button"
 	title="copy to clipboard"
 	{...rest}
-	class="copy_to_clipboard {class_prop}"
+	class="copy_to_clipboard {rest.class}"
 	class:icon_button={children ? false : icon_button}
 	class:copied
 	class:failed

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

@@ -1 +1 @@
-{"version":3,"file":"CopyToClipboard.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/CopyToClipboard.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;AAGvD,KAAK,gBAAgB,GAAI,UAAU,CAAC,kBAAkB,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,GAAG;IAC/E,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IACpB,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,0BAA0B,CAAC,EAAE,OAAO,CAAC;IACrC;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,EAAE,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IACtD,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;CACvD,CAAC;AAgEH,QAAA,MAAM,eAAe,sDAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}
+{"version":3,"file":"CopyToClipboard.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/CopyToClipboard.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;AAGvD,KAAK,gBAAgB,GAAI,UAAU,CAAC,kBAAkB,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,GAAG;IAC/E,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IACpB,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,0BAA0B,CAAC,EAAE,OAAO,CAAC;IACrC;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,EAAE,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IACtD,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;CACvD,CAAC;AA+DH,QAAA,MAAM,eAAe,sDAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/DocsContent.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
 	import type {Snippet} from 'svelte';
+	import type {SvelteHTMLElements} from 'svelte/elements';
 
 	import type {Library} from './library.svelte.js';
 	import type {Tome} from './tome.js';
@@ -11,7 +12,8 @@
 		repo_name,
 		content,
 		header,
-	}: {
+		...rest
+	}: SvelteHTMLElements['div'] & {
 		tomes: Array<Tome>;
 		library: Library;
 		repo_name?: Snippet<[repo_name: string]>;
@@ -20,7 +22,7 @@
 	} = $props();
 </script>
 
-<div class="width_upto_md">
+<div {...rest} class="width_upto_md {rest.class}">
 	{#if header}
 		{@render header()}
 	{:else}

package/dist/DocsContent.svelte.d.ts

@@ -1,7 +1,8 @@
 import type { Snippet } from 'svelte';
+import type { SvelteHTMLElements } from 'svelte/elements';
 import type { Library } from './library.svelte.js';
 import type { Tome } from './tome.js';
-type $$ComponentProps = {
+type $$ComponentProps = SvelteHTMLElements['div'] & {
     tomes: Array<Tome>;
     library: Library;
     repo_name?: Snippet<[repo_name: string]>;

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

@@ -1 +1 @@
-{"version":3,"file":"DocsContent.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsContent.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AAEpC,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,qBAAqB,CAAC;AACjD,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,WAAW,CAAC;AAGnC,KAAK,gBAAgB,GAAI;IACxB,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAsCH,QAAA,MAAM,WAAW,sDAAwC,CAAC;AAC1D,KAAK,WAAW,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAClD,eAAe,WAAW,CAAC"}
+{"version":3,"file":"DocsContent.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsContent.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAExD,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,qBAAqB,CAAC;AACjD,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,WAAW,CAAC;AAGnC,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,KAAK,CAAC,GAAG;IACpD,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAwCH,QAAA,MAAM,WAAW,sDAAwC,CAAC;AAC1D,KAAK,WAAW,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAClD,eAAe,WAAW,CAAC"}

package/dist/DocsFooter.svelte

@@ -1,10 +1,11 @@
 <script lang="ts">
 	import {format_url, type Url} from '@fuzdev/fuz_util/url.js';
 	import type {Snippet} from 'svelte';
+	import type {SvelteHTMLElements} from 'svelte/elements';
 
 	import type {Library} from './library.svelte.js';
 	import Svg from './Svg.svelte';
-	import {github_logo} from './logos.js';
+	import {logo_github} from './logos.js';
 
 	const {
 		library,
@@ -13,24 +14,24 @@
 		logo_header,
 		logo_footer,
 		children,
-	}: {
+		...rest
+	}: SvelteHTMLElements['footer'] & {
 		library: Library;
 		root_url?: Url | null;
 		logo?: Snippet;
 		logo_header?: Snippet;
 		logo_footer?: Snippet;
-		children?: Snippet;
 	} = $props();
 </script>
 
-<footer class="box">
+<footer {...rest} class="box {rest.class}">
 	{@render children?.()}
 	<div class="logo box panel p_lg shadow_inset_xs">
 		{@render logo_header?.()}
 		<!-- eslint-disable-next-line svelte/no-navigation-without-resolve -->
 		<a href={library.repo_url} rel="me" title="source code on GitHub"
 			>{#if logo}{@render logo()}{:else}<Svg
-					data={github_logo}
+					data={logo_github}
 					size="var(--icon_size_lg)"
 				/>{/if}</a
 		>

package/dist/DocsFooter.svelte.d.ts

@@ -1,13 +1,13 @@
 import { type Url } from '@fuzdev/fuz_util/url.js';
 import type { Snippet } from 'svelte';
+import type { SvelteHTMLElements } from 'svelte/elements';
 import type { Library } from './library.svelte.js';
-type $$ComponentProps = {
+type $$ComponentProps = SvelteHTMLElements['footer'] & {
     library: Library;
     root_url?: Url | null;
     logo?: Snippet;
     logo_header?: Snippet;
     logo_footer?: Snippet;
-    children?: Snippet;
 };
 declare const DocsFooter: import("svelte").Component<$$ComponentProps, {}, "">;
 type DocsFooter = ReturnType<typeof DocsFooter>;

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

@@ -1 +1 @@
-{"version":3,"file":"DocsFooter.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsFooter.svelte"],"names":[],"mappings":"AAGA,OAAO,EAAa,KAAK,GAAG,EAAC,MAAM,yBAAyB,CAAC;AAC7D,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AAEpC,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,qBAAqB,CAAC;AAIhD,KAAK,gBAAgB,GAAI;IACxB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,GAAG,GAAG,IAAI,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAuCH,QAAA,MAAM,UAAU,sDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
+{"version":3,"file":"DocsFooter.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsFooter.svelte"],"names":[],"mappings":"AAGA,OAAO,EAAa,KAAK,GAAG,EAAC,MAAM,yBAAyB,CAAC;AAC7D,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAExD,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,qBAAqB,CAAC;AAIhD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,QAAQ,CAAC,GAAG;IACvD,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,GAAG,GAAG,IAAI,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAyCH,QAAA,MAAM,UAAU,sDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}

package/dist/DocsList.svelte

@@ -1,20 +1,20 @@
 <script lang="ts">
 	import type {Snippet} from 'svelte';
+	import type {SvelteHTMLElements} from 'svelte/elements';
 
 	const {
 		expand_width = false,
 		margin = true,
-		class: class_prop,
 		children,
-	}: {
+		...rest
+	}: SvelteHTMLElements['div'] & {
 		expand_width?: boolean;
 		margin?: boolean;
-		class?: string;
 		children: Snippet;
 	} = $props();
 </script>
 
-<div class="docs_list {class_prop}" class:expand_width class:margin>
+<div {...rest} class="docs_list {rest.class}" class:expand_width class:margin>
 	{@render children()}
 </div>
 
@@ -31,7 +31,7 @@
 		margin: var(--space_xl6) 0;
 	}
 
-	/* TODO should be fixed upstream in moss */
+	/* TODO should be fixed upstream in fuz_css */
 	.docs_list :global(a.highlighted) {
 		background-color: var(--bg_4);
 	}

package/dist/DocsList.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
-type $$ComponentProps = {
+import type { SvelteHTMLElements } from 'svelte/elements';
+type $$ComponentProps = SvelteHTMLElements['div'] & {
     expand_width?: boolean;
     margin?: boolean;
-    class?: string;
     children: Snippet;
 };
 declare const DocsList: import("svelte").Component<$$ComponentProps, {}, "">;

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

@@ -1 +1 @@
-{"version":3,"file":"DocsList.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsList.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AAEnC,KAAK,gBAAgB,GAAI;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;CAClB,CAAC;AAoBH,QAAA,MAAM,QAAQ,sDAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"DocsList.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsList.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAEvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,KAAK,CAAC,GAAG;IACpD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;CAClB,CAAC;AAqBH,QAAA,MAAM,QAAQ,sDAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}

package/dist/DocsMenu.svelte

@@ -2,6 +2,7 @@
 	import {page} from '$app/state';
 	import {slide} from 'svelte/transition';
 	import type {Snippet} from 'svelte';
+	import type {SvelteHTMLElements} from 'svelte/elements';
 
 	import DocsList from './DocsList.svelte';
 	import {to_tome_pathname, type Tome} from './tome.js';
@@ -11,7 +12,8 @@
 		tomes,
 		children,
 		expand_width = false,
-	}: {
+		...rest
+	}: SvelteHTMLElements['div'] & {
 		tomes: Array<Tome>;
 		children?: Snippet<[category: string]>;
 		expand_width?: boolean;
@@ -27,7 +29,7 @@
 
 <!-- eslint-disable svelte/no-navigation-without-resolve -->
 
-<DocsList {expand_width} margin={false} class="docs_menu">
+<DocsList {...rest} {expand_width} margin={false} class="docs_menu">
 	<ul class="unstyled">
 		{#each Object.entries(tomes_by_category) as [category, tomes] (category)}
 			<li class="category">

package/dist/DocsMenu.svelte.d.ts

@@ -1,6 +1,7 @@
 import type { Snippet } from 'svelte';
+import type { SvelteHTMLElements } from 'svelte/elements';
 import { type Tome } from './tome.js';
-type $$ComponentProps = {
+type $$ComponentProps = SvelteHTMLElements['div'] & {
     tomes: Array<Tome>;
     children?: Snippet<[category: string]>;
     expand_width?: boolean;

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

@@ -1 +1 @@
-{"version":3,"file":"DocsMenu.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsMenu.svelte"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AAGpC,OAAO,EAAmB,KAAK,IAAI,EAAC,MAAM,WAAW,CAAC;AAGrD,KAAK,gBAAgB,GAAI;IACxB,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC,CAAC;IACvC,YAAY,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAgDH,QAAA,MAAM,QAAQ,sDAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"DocsMenu.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsMenu.svelte"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAGxD,OAAO,EAAmB,KAAK,IAAI,EAAC,MAAM,WAAW,CAAC;AAGrD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,KAAK,CAAC,GAAG;IACpD,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC,CAAC;IACvC,YAAY,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAkDH,QAAA,MAAM,QAAQ,sDAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}

package/dist/DocsMenuHeader.svelte

@@ -3,7 +3,6 @@
 	import type {SvelteHTMLElements} from 'svelte/elements';
 
 	const {
-		class: class_prop,
 		children,
 		...rest
 	}: SvelteHTMLElements['h4'] & {
@@ -12,4 +11,4 @@
 	} = $props();
 </script>
 
-<h4 {...rest} class="mb_sm {class_prop}">{@render children()}</h4>
+<h4 {...rest} class="mb_sm {rest.class}">{@render children()}</h4>

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

@@ -1 +1 @@
-{"version":3,"file":"DocsMenuHeader.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsMenuHeader.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAEvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,IAAI,CAAC,GAAG;IAEnD,QAAQ,EAAE,OAAO,CAAC;CAClB,CAAC;AAgBH,QAAA,MAAM,cAAc,sDAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}
+{"version":3,"file":"DocsMenuHeader.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsMenuHeader.svelte"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAEvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,IAAI,CAAC,GAAG;IAEnD,QAAQ,EAAE,OAAO,CAAC;CAClB,CAAC;AAeH,QAAA,MAAM,cAAc,sDAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}

package/dist/DocsModulesList.svelte

@@ -1,19 +1,21 @@
 <script lang="ts">
 	import {page} from '$app/state';
+	import type {SvelteHTMLElements} from 'svelte/elements';
 
 	import DocsList from './DocsList.svelte';
 	import {library_context} from './library.svelte.js';
 
 	const {
 		expand_width = false,
-	}: {
+		...rest
+	}: SvelteHTMLElements['div'] & {
 		expand_width?: boolean;
 	} = $props();
 
 	const library = library_context.get();
 </script>
 
-<DocsList {expand_width} class="modules_list">
+<DocsList {...rest} {expand_width} class="modules_list">
 	<h4 class="mb_sm">modules</h4>
 	<ul class="unstyled">
 		{#each library.modules_sorted as module (module.path)}

package/dist/DocsModulesList.svelte.d.ts

@@ -1,4 +1,5 @@
-type $$ComponentProps = {
+import type { SvelteHTMLElements } from 'svelte/elements';
+type $$ComponentProps = SvelteHTMLElements['div'] & {
     expand_width?: boolean;
 };
 declare const DocsModulesList: import("svelte").Component<$$ComponentProps, {}, "">;