@fuzdev/fuz_ui 0.205.0 → 0.205.1

package/dist/Breadcrumb.svelte

@@ -61,14 +61,14 @@
 
 <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}
+	<a href={root_path} class={{selected: root_path === final_base_path + final_selected_path}}
 		>{#if children}{@render children()}{:else if icon_data}<Svg
 				data={icon_data}
 				size="1em"
 			/>{:else if glyph_text}{glyph_text}{:else}•{/if}</a
 	>{#each path_pieces as path_piece (path_piece)}{#if path_piece.type === 'piece'}<!-- eslint-disable-next-line svelte/no-navigation-without-resolve --><a
 				href={final_base_path + path_piece.path}
-				class:selected={path_piece.path === final_selected_path}>{path_piece.name}</a
+				class={{selected: path_piece.path === final_selected_path}}>{path_piece.name}</a
 			>{:else}<span class="separator"
 				>{#if separator}{@render separator()}{:else}/{/if}</span
 			>{/if}{/each}

package/dist/Card.svelte

@@ -55,13 +55,7 @@
 	this={final_tag}
 	{...rest}
 	{...inferred_attrs}
-	class="card {rest.class} {inferred_attrs?.class}"
-	class:link
-	class:selected
-	class:left
-	class:right
-	class:above
-	class:below
+	class={['card', rest.class, inferred_attrs?.class, {link, selected, left, right, above, below}]}
 >
 	{#if align === 'left' || align === 'above'}
 		{@render icon_snippet()}

package/dist/ColorSchemeInput.svelte

@@ -22,12 +22,11 @@ https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/menubar_ro
 		{@const selected = color_scheme === value.color_scheme}
 		<button
 			type="button"
-			class="color-scheme color_a"
+			class={['color-scheme color_a', {selected}]}
 			role="menuitemradio"
 			title={selected
 				? `${color_scheme} color scheme is selected`
 				: `select ${color_scheme} color scheme`}
-			class:selected
 			aria-checked={selected}
 			onclick={(e) => {
 				swallow(e);

package/dist/ContextmenuEntry.svelte

@@ -40,9 +40,7 @@
 <!-- disabling the a11y warning because a parent element handles keyboard events -->
 <!-- svelte-ignore a11y_click_events_have_key_events -->
 <li
-	class="menuitem plain selectable deselectable"
-	class:selected
-	class:disabled
+	class={['menuitem plain selectable deselectable', {selected, disabled}]}
 	role="menuitem"
 	aria-disabled={disabled}
 	tabindex="-1"

package/dist/ContextmenuLinkEntry.svelte

@@ -64,10 +64,7 @@
 	<!-- eslint-disable svelte/no-navigation-without-resolve -->
 	<a
 		bind:this={anchor_el}
-		class="menuitem plain"
-		class:selected
-		class:disabled
-		class:deselectable={!disabled}
+		class={['menuitem plain', {selected, disabled, deselectable: !disabled}]}
 		role="menuitem"
 		aria-disabled={disabled}
 		aria-current={current_page ? 'page' : undefined}

package/dist/ContextmenuSeparator.svelte

@@ -5,7 +5,7 @@
 </script>
 
 <!-- `aria-orientation` is omitted - it defaults to horizontal, correct for a vertical menu's rule -->
-<li role="separator" {...rest} class:contextmenu-separator={true}></li>
+<li role="separator" {...rest} class={['contextmenu-separator', rest.class]}></li>
 
 <style>
 	.contextmenu-separator {

package/dist/ContextmenuSubmenu.svelte

@@ -68,8 +68,7 @@
 <li role="none" style:--contextmenu_depth={submenu.depth}>
 	<!-- disabling the a11y warning because a parent element handles keyboard events -->
 	<div
-		class="menuitem plain selectable"
-		class:selected
+		class={['menuitem plain selectable', {selected}]}
 		role="menuitem"
 		aria-haspopup="menu"
 		tabindex="-1"

package/dist/CopyToClipboard.svelte

@@ -66,11 +66,11 @@
 	type="button"
 	title="copy to clipboard"
 	{...rest}
-	class="copy-to-clipboard {rest.class}"
-	class:icon_button={children ? false : icon_button}
-	class:copied
-	class:failed
-	class:color_c={failed}
+	class={[
+		'copy-to-clipboard',
+		rest.class,
+		{icon_button: children ? false : icon_button, copied, failed, color_c: failed},
+	]}
 	onclick={(e) => {
 		onclick?.(e); // before the internal handler, which is async
 		void copy(e);

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;AAMvD,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;AAsEH,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;AAMvD,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;AA0EH,QAAA,MAAM,eAAe,sDAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/Dialog.svelte

@@ -149,8 +149,7 @@
 {#if show}
 	<dialog
 		{...rest}
-		class="dialog {rest.class}"
-		class:align-top={align === 'top'}
+		class={['dialog', rest.class, {'align-top': align === 'top'}]}
 		{@attach setup_dialog}
 	>
 		<div

package/dist/DialogContent.svelte

@@ -123,7 +123,7 @@ dismiss zone outside the card, where a press lands on the wrapper and closes the
 content with its own overflow (e.g. `Code`) scrolls instead of forcing the card wider. -->
 <div
 	{...rest}
-	class:pane
+	class={[rest.class, {pane}]}
 	style:padding
 	style:margin={gutter}
 	style:max-width={max_width}

package/dist/DocsList.svelte

@@ -14,7 +14,7 @@
 	} = $props();
 </script>
 
-<div {...rest} class="docs-list {rest.class}" class:expand-width={expand_width} class:margin>
+<div {...rest} class={['docs-list', rest.class, {'expand-width': expand_width, margin}]}>
 	{@render children()}
 </div>
 

package/dist/DocsMenu.svelte

@@ -39,7 +39,7 @@
 					{#each tomes as item (item)}
 						{@const pathname = tome_to_pathname(item)}
 						<li role="none" transition:slide>
-							<a class="menuitem" href={pathname} class:selected={pathname === page.url.pathname}
+							<a class={['menuitem', {selected: pathname === page.url.pathname}]} href={pathname}
 								><div class="ellipsis">{tome_to_title(item)}</div></a
 							>
 						</li>

package/dist/DocsPageLinks.svelte

@@ -36,16 +36,17 @@
 				<li
 					role="none"
 					transition:slide
-					class:pl_xl={item.depth === 2}
-					class:pl_xl2={item.depth === 3}
-					class:pl_xl3={item.depth >= 4}
+					class={{pl_xl: item.depth === 2, pl_xl2: item.depth === 3, pl_xl3: item.depth >= 4}}
 				>
 					<a
-						class="menuitem"
-						href="#{item.fragment}"
-						class:selected={item.fragment === hash}
-						class:highlighted={docs_links.fragments_onscreen.has(item.fragment)}
-						><div class="ellipsis">{item.text}</div></a
+						class={[
+							'menuitem',
+							{
+								selected: item.fragment === hash,
+								highlighted: docs_links.fragments_onscreen.has(item.fragment),
+							},
+						]}
+						href="#{item.fragment}"><div class="ellipsis">{item.text}</div></a
 					>
 				</li>
 			{/each}

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

@@ -1 +1 @@
-{"version":3,"file":"DocsPageLinks.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsPageLinks.svelte"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAKvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,KAAK,CAAC,GAAG;IACpD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AA6CH,QAAA,MAAM,aAAa,sDAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}
+{"version":3,"file":"DocsPageLinks.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/DocsPageLinks.svelte"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAKvD,KAAK,gBAAgB,GAAI,kBAAkB,CAAC,KAAK,CAAC,GAAG;IACpD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAmDH,QAAA,MAAM,aAAa,sDAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/DocsPrimaryNav.svelte

@@ -20,7 +20,7 @@
 </script>
 
 {#if enabled}
-	<div {...rest} class="docs-primary-nav {rest.class}" class:scrolled>
+	<div {...rest} class={['docs-primary-nav', rest.class, {scrolled}]}>
 		<div class="background" aria-hidden="true"></div>
 		<div class="content">
 			<nav aria-label="Primary nav">

package/dist/DocsSecondaryNav.svelte

@@ -16,7 +16,7 @@
 	const expand_width = $derived(!sidebar);
 </script>
 
-<aside {...rest} class="docs-secondary-nav unstyled {rest.class}" class:sidebar>
+<aside {...rest} class={['docs-secondary-nav unstyled', rest.class, {sidebar}]}>
 	<nav aria-label="Secondary nav">
 		<DocsMenu {tomes} {expand_width} />
 	</nav>

package/dist/EcosystemLinks.svelte

@@ -14,7 +14,7 @@
 <ul {...rest}>
 	<li>
 		<!-- eslint-disable-next-line svelte/no-navigation-without-resolve -->
-		<a rel="me" href={FUZ_DEV_URL} class:selected={selected === 'fuz.dev'}>fuz.dev</a>
+		<a rel="me" href={FUZ_DEV_URL} class={{selected: selected === 'fuz.dev'}}>fuz.dev</a>
 		- the Fuz stack homepage{#if selected === 'fuz.dev'}, you are here{/if}
 	</li>
 	<li>

package/dist/LibraryDetail.svelte

@@ -106,8 +106,7 @@ with file-type coloring. Uses svelte-docinfo's file type predicates for module c
 							<span class="title">homepage</span>
 							<div class="content">
 								<a
-									class="chip"
-									class:selected={library.homepage_url === page.url.href}
+									class={['chip', {selected: library.homepage_url === page.url.href}]}
 									href={library.homepage_url}
 								>
 									{#if library.logo_url}
@@ -168,11 +167,15 @@ with file-type coloring. Uses svelte-docinfo's file type predicates for module c
 				{#each library.modules as module (module.path)}
 					<!-- TODO improve rendering and enrich data - start with the type (not just extension - mime?) -->
 					<li
-						class="module"
-						class:ts={isTypescript(module.path)}
-						class:svelte={isSvelte(module.path)}
-						class:css={isCss(module.path)}
-						class:json={isJson(module.path)}
+						class={[
+							'module',
+							{
+								ts: isTypescript(module.path),
+								svelte: isSvelte(module.path),
+								css: isCss(module.path),
+								json: isJson(module.path),
+							},
+						]}
 					>
 						<div class="module-content">
 							<span class="font_size_xl">

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

@@ -1 +1 @@
-{"version":3,"file":"LibraryDetail.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/LibraryDetail.svelte"],"names":[],"mappings":"AAKA,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;AAExD,OAAO,EAAkB,KAAK,OAAO,EAAC,MAAM,qBAAqB,CAAC;AAOjE,KAAK,gBAAgB,GAAI,UAAU,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAC5E,OAAO,EAAE,OAAO,CAAC;IACjB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC,CAAC;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC,CAAC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC;IACrC,YAAY,CAAC,EAAE,OAAO,CAAC,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC,CAAC;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC;CACvC,CAAC;AAsKH;;;;;;GAMG;AACH,QAAA,MAAM,aAAa,sDAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}
+{"version":3,"file":"LibraryDetail.svelte.d.ts","sourceRoot":"../src/lib/","sources":["../src/lib/LibraryDetail.svelte"],"names":[],"mappings":"AAKA,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;AAExD,OAAO,EAAkB,KAAK,OAAO,EAAC,MAAM,qBAAqB,CAAC;AAOjE,KAAK,gBAAgB,GAAI,UAAU,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAC5E,OAAO,EAAE,OAAO,CAAC;IACjB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC,CAAC;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC,CAAC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC;IACrC,YAAY,CAAC,EAAE,OAAO,CAAC,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC,CAAC;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC;CACvC,CAAC;AA8KH;;;;;;GAMG;AACH,QAAA,MAAM,aAAa,sDAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/LibrarySummary.svelte

@@ -83,8 +83,7 @@
 			<div class="mb_lg">
 				<!-- eslint-disable svelte/no-navigation-without-resolve -->
 				<a
-					class="chip"
-					class:selected={library.homepage_url === page.url.href}
+					class={['chip', {selected: library.homepage_url === page.url.href}]}
 					href={library.homepage_url}>{format_url(library.homepage_url)}</a
 				>
 				<!-- eslint-enable svelte/no-navigation-without-resolve -->

package/dist/PendingAnimation.svelte

@@ -21,10 +21,12 @@
 
 <span
 	{...rest}
-	class="pending-animation {rest.class} {inline
-		? 'display:inline-flex align-items:center'
-		: 'display:flex'}"
-	class:running
+	class={[
+		'pending-animation',
+		rest.class,
+		inline ? 'display:inline-flex align-items:center' : 'display:flex',
+		{running},
+	]}
 	><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;AAyBH,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;AA4BH,QAAA,MAAM,gBAAgB,sDAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}

package/dist/PendingButton.svelte

@@ -30,9 +30,8 @@
 	bind:this={el}
 	type="button"
 	{...rest}
-	class="pending-button {rest.class}"
+	class={['pending-button', rest.class, {pending}]}
 	disabled={disabled_prop ?? pending}
-	class:pending
 	{onclick}
 >
 	<span class="content">

package/dist/StyleVariableButton.svelte

@@ -31,8 +31,7 @@
 <button
 	type="button"
 	{...rest}
-	class:inline
-	class:plain
+	class={[rest.class, {inline, plain}]}
 	onclick={(e) => {
 		selected_variable.value = variable;
 		onclick?.(e);

package/dist/Svg.svelte

@@ -79,7 +79,7 @@
 	viewBox={data.viewBox ?? '0 0 100 100'}
 	{...rest}
 	aria-label={label ?? data.label ?? rest['aria-label']}
-	class:inline
+	class={[rest.class, {inline}]}
 	style:width={final_width}
 	style:height={final_height}
 	style:flex-shrink={shrink ? 1 : 0}

package/dist/ThemeInput.svelte

@@ -35,11 +35,10 @@
 		<li class="row" role="none">
 			<button
 				type="button"
-				class="theme-button color_a"
+				class={['theme-button color_a', {selected}]}
 				role="menuitemradio"
 				aria-label="{theme.name} theme"
 				aria-checked={selected}
-				class:selected
 				onclick={(e) => {
 					swallow(e);
 					if (select?.(theme) !== false) {

package/dist/TomeSectionHeader.svelte

@@ -60,7 +60,7 @@
 </script>
 
 <header>
-	<svelte:element this={final_tag} {...rest} class:tome-section-header={true}>
+	<svelte:element this={final_tag} {...rest} class={['tome-section-header', rest.class]}>
 		<div class="flex:1">
 			{#if children}
 				{@render children()}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fuzdev/fuz_ui",
-  "version": "0.205.0",
+  "version": "0.205.1",
   "description": "Svelte UI library",
   "tagline": "friendly user zystem",
   "glyph": "🧶",
@@ -63,8 +63,8 @@
   "devDependencies": {
     "@changesets/changelog-git": "^0.2.1",
     "@fuzdev/blake3_wasm": "^0.1.1",
-    "@fuzdev/fuz_code": "^0.46.0",
-    "@fuzdev/fuz_css": "^0.62.0",
+    "@fuzdev/fuz_code": "^0.46.1",
+    "@fuzdev/fuz_css": "^0.63.2",
     "@fuzdev/fuz_util": "^0.65.1",
     "@fuzdev/gro": "^0.204.0",
     "@fuzdev/mdz": "^0.1.0",