admin-ui: let the Breadcrumbs nav shrink so long crumbs truncate

packages/admin-ui/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+### Bug Fixes
+
+-   `Breadcrumbs`: Let the `nav` shrink below its content width (`min-width: 0`) so a long current crumb truncates with an ellipsis instead of widening the page into horizontal scrolling ([#81301](https://github.com/WordPress/gutenberg/pull/81301)).
+
 ### Internal
 
 -   Stop publishing the `src` directory to npm. The package's `exports` field only exposes the built artifacts, so the source files were unreachable by consumers and only inflated the package size ([#77285](https://github.com/WordPress/gutenberg/pull/77285)).

packages/admin-ui/src/breadcrumbs/index.tsx

@@ -44,7 +44,7 @@ export const Breadcrumbs = ( { items }: BreadcrumbsProps ) => {
 	}
 
 	return (
-		<nav aria-label={ __( 'Breadcrumbs' ) }>
+		<nav aria-label={ __( 'Breadcrumbs' ) } className={ styles.root }>
 			<Stack
 				render={ <ul /> }
 				direction="row"

packages/admin-ui/src/breadcrumbs/style.module.css

@@ -1,3 +1,12 @@
+/*
+ * The nav renders as a flex item in the page header; the default
+ * `min-width: auto` would keep the list from shrinking and the `.current`
+ * truncation styles below from engaging.
+ */
+.root {
+	min-width: 0;
+}
+
 .list {
 	list-style: none;
 	padding: 0;