diff --git a/packages/components/src/animate/stories/index.story.tsx b/packages/components/src/animate/stories/index.story.tsx
index 52688f01d359ee..1b660eb7757b70 100644
--- a/packages/components/src/animate/stories/index.story.tsx
+++ b/packages/components/src/animate/stories/index.story.tsx
@@ -77,16 +77,6 @@ AppearBottomRight.args = {
 	),
 };
 
-export const Loading = Template.bind( {} );
-Loading.args = {
-	type: 'loading',
-	children: ( { className } ) => (
-		<Notice className={ className } status="success">
-			<p>Loading animation.</p>
-		</Notice>
-	),
-};
-
 export const SlideIn = Template.bind( {} );
 SlideIn.args = {
 	type: 'slide-in',
diff --git a/packages/components/src/border-box-control/stories/index.story.tsx b/packages/components/src/border-box-control/stories/index.story.tsx
index 8329f84a8c744f..10b0607e06c3dd 100644
--- a/packages/components/src/border-box-control/stories/index.story.tsx
+++ b/packages/components/src/border-box-control/stories/index.story.tsx
@@ -58,7 +58,7 @@ const Template: StoryFn< typeof BorderBoxControl > = ( props ) => {
 					borderBottom: 'none',
 				} }
 			/>
-			<p style={ { color: '#aaa', fontSize: '0.9em' } }>
+			<p style={ { color: '#6c6c6c', fontSize: '0.9em' } }>
 				The BorderBoxControl is intended to be used within a component
 				that will provide reset controls. The button below is only for
 				convenience.
diff --git a/packages/components/src/composite/legacy/stories/index.story.tsx b/packages/components/src/composite/legacy/stories/index.story.tsx
index 15e1e8bc019e3c..9a06ffc61f1399 100644
--- a/packages/components/src/composite/legacy/stories/index.story.tsx
+++ b/packages/components/src/composite/legacy/stories/index.story.tsx
@@ -147,19 +147,19 @@ export const OneDimensionWithStateProp: StoryFn<
 			state={ state }
 			aria-label="Legacy Composite with state prop (one dimension)"
 		>
-			<CompositeItem state={ state } role="listitem">
+			<CompositeItem state={ state } role="listitem" render={ <div /> }>
 				Item 1
 			</CompositeItem>
-			<CompositeItem state={ state } role="listitem">
+			<CompositeItem state={ state } role="listitem" render={ <div /> }>
 				Item 2
 			</CompositeItem>
-			<CompositeItem state={ state } role="listitem">
+			<CompositeItem state={ state } role="listitem" render={ <div /> }>
 				Item 3
 			</CompositeItem>
-			<CompositeItem state={ state } role="listitem">
+			<CompositeItem state={ state } role="listitem" render={ <div /> }>
 				Item 4
 			</CompositeItem>
-			<CompositeItem state={ state } role="listitem">
+			<CompositeItem state={ state } role="listitem" render={ <div /> }>
 				Item 5
 			</CompositeItem>
 		</Composite>
@@ -178,19 +178,19 @@ export const OneDimensionWithSpreadProps: StoryFn<
 			{ ...state }
 			aria-label="Legacy Composite with spread props (one dimension)"
 		>
-			<CompositeItem { ...state } role="listitem">
+			<CompositeItem { ...state } role="listitem" render={ <div /> }>
 				Item 1
 			</CompositeItem>
-			<CompositeItem { ...state } role="listitem">
+			<CompositeItem { ...state } role="listitem" render={ <div /> }>
 				Item 2
 			</CompositeItem>
-			<CompositeItem { ...state } role="listitem">
+			<CompositeItem { ...state } role="listitem" render={ <div /> }>
 				Item 3
 			</CompositeItem>
-			<CompositeItem { ...state } role="listitem">
+			<CompositeItem { ...state } role="listitem" render={ <div /> }>
 				Item 4
 			</CompositeItem>
-			<CompositeItem { ...state } role="listitem">
+			<CompositeItem { ...state } role="listitem" render={ <div /> }>
 				Item 5
 			</CompositeItem>
 		</Composite>
diff --git a/packages/components/src/keyboard-shortcuts/stories/index.story.tsx b/packages/components/src/keyboard-shortcuts/stories/index.story.tsx
index 1ac15b4ab1c7d0..14f79fa98802a6 100644
--- a/packages/components/src/keyboard-shortcuts/stories/index.story.tsx
+++ b/packages/components/src/keyboard-shortcuts/stories/index.story.tsx
@@ -34,7 +34,7 @@ Default.args = {
 			{ /* eslint-disable react/no-unescaped-entities */ }
 			<p>Hit the "a" or "b" key in this textarea:</p>
 			{ /* eslint-enable react/no-unescaped-entities */ }
-			<textarea />
+			<textarea aria-label="Keyboard shortcuts demo" />
 		</div>
 	),
 };
@@ -52,7 +52,7 @@ Default.parameters = {
     <p>
       Hit the "a" or "b" key in this textarea:
     </p>
-    <textarea />
+    <textarea aria-label="Keyboard shortcuts demo" />
   </div>
 </KeyboardShortcuts>
 			`,
diff --git a/packages/components/src/menu-group/stories/index.story.tsx b/packages/components/src/menu-group/stories/index.story.tsx
index 0ff11a60143257..77a1b3cb92aa87 100644
--- a/packages/components/src/menu-group/stories/index.story.tsx
+++ b/packages/components/src/menu-group/stories/index.story.tsx
@@ -3,6 +3,7 @@ import { useState } from '@wordpress/element';
 import MenuGroup from '..';
 import MenuItem from '../../menu-item';
 import MenuItemsChoice from '../../menu-items-choice';
+import { NavigableMenu } from '../../navigable-container';
 
 const meta: Meta< typeof MenuGroup > = {
 	tags: [ 'manifest' ],
@@ -26,10 +27,12 @@ export default meta;
 
 const Template: StoryFn< typeof MenuGroup > = ( args ) => {
 	return (
-		<MenuGroup { ...args }>
-			<MenuItem>Menu Item 1</MenuItem>
-			<MenuItem>Menu Item 2</MenuItem>
-		</MenuGroup>
+		<NavigableMenu>
+			<MenuGroup { ...args }>
+				<MenuItem>Menu Item 1</MenuItem>
+				<MenuItem>Menu Item 2</MenuItem>
+			</MenuGroup>
+		</NavigableMenu>
 	);
 };
 
@@ -49,7 +52,7 @@ const MultiGroupsTemplate: StoryFn< typeof MenuGroup > = ( args ) => {
 	];
 
 	return (
-		<>
+		<NavigableMenu>
 			<MenuGroup label="View">
 				<MenuItem>Top Toolbar</MenuItem>
 				<MenuItem>Spotlight Mode</MenuItem>
@@ -63,7 +66,7 @@ const MultiGroupsTemplate: StoryFn< typeof MenuGroup > = ( args ) => {
 					onHover={ () => {} }
 				/>
 			</MenuGroup>
-		</>
+		</NavigableMenu>
 	);
 };
 
diff --git a/packages/components/src/menu-item/stories/index.story.tsx b/packages/components/src/menu-item/stories/index.story.tsx
index c199971ca21e4c..7c3c708d9ce83d 100644
--- a/packages/components/src/menu-item/stories/index.story.tsx
+++ b/packages/components/src/menu-item/stories/index.story.tsx
@@ -3,6 +3,7 @@ import { link, more, check } from '@wordpress/icons';
 import MenuGroup from '../../menu-group';
 import MenuItem from '..';
 import Shortcut from '../../shortcut';
+import { NavigableMenu } from '../../navigable-container';
 
 const meta: Meta< typeof MenuItem > = {
 	tags: [ 'manifest' ],
@@ -37,9 +38,11 @@ export default meta;
 
 const Template: StoryFn< typeof MenuItem > = ( props ) => {
 	return (
-		<MenuGroup>
-			<MenuItem { ...props }>Menu Item 1</MenuItem>
-		</MenuGroup>
+		<NavigableMenu>
+			<MenuGroup>
+				<MenuItem { ...props }>Menu Item 1</MenuItem>
+			</MenuGroup>
+		</NavigableMenu>
 	);
 };
 
diff --git a/packages/components/src/menu-items-choice/stories/index.story.tsx b/packages/components/src/menu-items-choice/stories/index.story.tsx
index 3c9a694bdcdda1..585e36005833d3 100644
--- a/packages/components/src/menu-items-choice/stories/index.story.tsx
+++ b/packages/components/src/menu-items-choice/stories/index.story.tsx
@@ -2,6 +2,7 @@ import type { Meta, StoryFn } from '@storybook/react-vite';
 import { useState } from '@wordpress/element';
 import MenuItemsChoice from '..';
 import MenuGroup from '../../menu-group';
+import { NavigableMenu } from '../../navigable-container';
 
 const meta: Meta< typeof MenuItemsChoice > = {
 	tags: [ 'manifest' ],
@@ -35,17 +36,19 @@ const Template: StoryFn< typeof MenuItemsChoice > = ( {
 	const [ choice, setChoice ] = useState( choices[ 0 ]?.value ?? '' );
 
 	return (
-		<MenuGroup label="Editor">
-			<MenuItemsChoice
-				choices={ choices }
-				value={ choice }
-				onSelect={ ( ...selectArgs ) => {
-					onSelect( ...selectArgs );
-					setChoice( ...selectArgs );
-				} }
-				onHover={ onHover }
-			/>
-		</MenuGroup>
+		<NavigableMenu>
+			<MenuGroup label="Editor">
+				<MenuItemsChoice
+					choices={ choices }
+					value={ choice }
+					onSelect={ ( ...selectArgs ) => {
+						onSelect( ...selectArgs );
+						setChoice( ...selectArgs );
+					} }
+					onHover={ onHover }
+				/>
+			</MenuGroup>
+		</NavigableMenu>
 	);
 };
 
diff --git a/packages/components/src/sandbox/stories/index.story.tsx b/packages/components/src/sandbox/stories/index.story.tsx
index b4384da3a5975e..424ad80911e7b4 100644
--- a/packages/components/src/sandbox/stories/index.story.tsx
+++ b/packages/components/src/sandbox/stories/index.story.tsx
@@ -28,12 +28,14 @@ const Template: StoryFn< typeof SandBox > = ( args ) => <SandBox { ...args } />;
 
 export const Default = Template.bind( {} );
 Default.args = {
+	title: 'Sandbox preview',
 	html: '<p>Arbitrary HTML content</p>',
 	allowForms: false,
 };
 
 export const WithForm = Template.bind( {} );
 WithForm.args = {
+	title: 'Sandbox preview with form',
 	html: '<form action="#"><label for="name">Name</label><input id="name" type="text" /><button type="submit">Submit</button></form>',
 	allowForms: true,
 };
diff --git a/packages/components/src/scrollable/stories/index.story.tsx b/packages/components/src/scrollable/stories/index.story.tsx
index 91aea464dcda55..1332ffc76c5017 100644
--- a/packages/components/src/scrollable/stories/index.story.tsx
+++ b/packages/components/src/scrollable/stories/index.story.tsx
@@ -64,6 +64,7 @@ const Template: StoryFn< typeof Scrollable > = ( { ...args } ) => {
 						right: 0,
 					} }
 					type="text"
+					aria-label="Element out of view"
 					value="Focus me"
 					readOnly
 				/>