@poodle64/ui 2026.9.12 → 2026.9.14

package/dist/components/ui/app-shell/app-shell.svelte

@@ -789,14 +789,14 @@
 
 			{#if onSearch && searchPlacement === 'leading'}
 				{@render searchButton(
-					'h-9 w-9 flex-none justify-center px-0 sm:h-auto sm:w-[clamp(200px,32vw,560px)] sm:flex-1 sm:justify-start sm:gap-2 sm:px-3 sm:py-1.5'
+					'h-9 w-9 flex-none justify-center px-0 sm:h-auto sm:w-[clamp(200px,24vw,420px)] sm:flex-1 sm:justify-start sm:gap-2 sm:px-3 sm:py-1.5'
 				)}
 			{/if}
 
 			<div class="ml-auto flex flex-none items-center gap-2 sm:gap-3">
 				{#if onSearch && searchPlacement === 'trailing'}
 					{@render searchButton(
-						'h-9 w-9 flex-none justify-center px-0 sm:h-auto sm:w-[clamp(200px,32vw,560px)] sm:justify-start sm:gap-2 sm:px-3 sm:py-1.5'
+						'h-9 w-9 flex-none justify-center px-0 sm:h-auto sm:w-[clamp(180px,18vw,300px)] sm:justify-start sm:gap-2 sm:px-3 sm:py-1.5'
 					)}
 				{/if}
 

package/dist/styles.css

@@ -777,6 +777,13 @@
 	   lands its label at 2.5rem, exactly under the parent's. The border is a real
 	   affordance at fifteen rows, not decoration: it is what makes the run
 	   scannable as one section. */
+	/* The disclosed rows carry no guide rule. Indentation and the children's own
+	   icons already read as one group, and a line down the side is a second
+	   signal for a grouping that was never ambiguous. The indent is still
+	   measured against the parent's geometry rather than picked: `.ds-nav-item`
+	   pads 0.625rem and the icon is 1.125rem, so 1.1875rem plus 0.625rem here
+	   plus the child's own 0.625rem lands its label at 2.5rem, exactly under the
+	   parent's. */
 	.ds-nav-children {
 		display: flex;
 		flex-direction: column;
@@ -784,32 +791,35 @@
 		margin-top: 0.125rem;
 		margin-left: 1.1875rem;
 		padding-left: 0.625rem;
-		/* Derived from the nav's OWN ink, not `--border`. The rail is chrome the
-		   app may brand, and a page-surface border token cannot follow it there:
-		   on a branded rail the grey lands at 1.54:1 and reads as a dead scratch
-		   down the colour. At 50% of the chrome's ink the guide measures 3.10:1
-		   on that same rail — over the 3:1 floor it owes as a real affordance,
-		   and still a step quieter than the child labels it organises. */
-		border-left: 1px solid color-mix(in oklch, var(--ds-nav-ink) 50%, transparent);
 	}
 
 	/* The rail's foot: where you configure the app, and which build you are on.
 	   Separated from the scrolling section list by a rule in the chrome's OWN
 	   ink rather than `--border`, for the reason the group guide takes the same
 	   treatment — a page-surface token cannot follow chrome an app has branded. */
+	/* `padding-inline` matches `.ds-nav`'s own `px-3`, because the foot sits
+	   OUTSIDE that wrapper: without it the Settings row's icon lands 0.75rem
+	   left of every icon above it and the rail reads as two lists. */
 	.ds-shell-rail-foot {
 		display: flex;
 		flex-direction: column;
-		padding-top: 0.375rem;
+		padding-block: 0.375rem 0.75rem;
+		padding-inline: 0.75rem;
 		border-top: 1px solid color-mix(in oklch, var(--ds-nav-ink) 22%, transparent);
 	}
 
 	/* Metadata, not a row. No icon, no tile, no hover: it answers "what am I
 	   running" when someone reports a bug and otherwise stays out of the way.
 	   `tabular-nums` so a version does not re-flow as the digits change. */
+	/* Below Settings, on the rail's bottom edge, so the rail OPENS with the app's
+	   name and CLOSES with its build — identity at both ends, the action between
+	   them. Above Settings would put metadata before the thing people click.
+	   `padding-inline` matches `.ds-nav-item`'s own, so it starts on the same
+	   vertical as the icons rather than the labels: it is a line of metadata,
+	   not a row missing its icon. */
 	.ds-shell-version {
 		margin: 0;
-		padding: 0.25rem 0.75rem 0.375rem;
+		padding: 0.25rem 0.625rem 0;
 		color: var(--ds-nav-ink-muted);
 		font-size: var(--ds-text-2xs);
 		font-variant-numeric: tabular-nums;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@poodle64/ui",
-	"version": "2026.9.12",
+	"version": "2026.9.14",
 	"description": "Household shared component layer: shadcn-svelte primitives (bits-ui) plus the composed page chrome every app builds its routes from, restyled by each app's @poodle64/design-tokens alias layer. One fix reaches every app.",
 	"type": "module",
 	"license": "MIT",

package/registry/component-map.json

@@ -1,7 +1,7 @@
 {
 	"meta": {
 		"package": "@poodle64/ui",
-		"version": "2026.9.12",
+		"version": "2026.9.14",
 		"generatedBy": "scripts/generate-registry.mjs",
 		"source": "scripts/situations.json + package source (DO NOT EDIT the outputs by hand)",
 		"componentCount": 57,

package/registry/component-map.md

@@ -1,7 +1,7 @@
 # @poodle64/ui — situation → component map
 
 <!-- GENERATED by scripts/generate-registry.mjs from scripts/situations.json + package source. DO NOT EDIT. -->
-Generated from `@poodle64/ui@2026.9.12`. 57 components, 15 situations.
+Generated from `@poodle64/ui@2026.9.14`. 57 components, 15 situations.
 
 **Read this before writing a `<div>`.** Find the SITUATION you are in below, then compose the component named for it — do not hand-build it from raw `Card` or utility classes. Import is `import { Name } from '<import path>'`. Props marked `?` are optional. This map is the retrieval step the [`frontend-design` skill] makes mandatory; the [CHI 2026 study] measured composing-from-a-registry at 95% design-system compliance against 71% for writing the CSS from a prose style guide.