From 7c2009255b789423d3a5996820c3406ca65e3ac3 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 16:18:35 -0600
Subject: [PATCH 01/32] Remove "experimental" designation for
 `AlignmentMatrixControl`

---
 .../components/src/alignment-matrix-control/README.md     | 6 +-----
 .../components/src/alignment-matrix-control/index.tsx     | 2 +-
 .../src/alignment-matrix-control/stories/index.story.tsx  | 2 +-
 packages/components/src/index.ts                          | 8 +++++++-
 storybook/manager-head.html                               | 5 ++++-
 5 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/packages/components/src/alignment-matrix-control/README.md b/packages/components/src/alignment-matrix-control/README.md
index d087a177d8d414..68ecab6b7adb47 100644
--- a/packages/components/src/alignment-matrix-control/README.md
+++ b/packages/components/src/alignment-matrix-control/README.md
@@ -1,16 +1,12 @@
 # AlignmentMatrixControl
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 AlignmentMatrixControl components enable adjustments to horizontal and vertical alignments for UI.
 
 ## Usage
 
 ```jsx
 import { useState } from 'react';
-import { __experimentalAlignmentMatrixControl as AlignmentMatrixControl } from '@wordpress/components';
+import { AlignmentMatrixControl } from '@wordpress/components';
 
 const Example = () => {
 	const [ alignment, setAlignment ] = useState( 'center center' );
diff --git a/packages/components/src/alignment-matrix-control/index.tsx b/packages/components/src/alignment-matrix-control/index.tsx
index 3de0e401187d53..d5417ddfbc421d 100644
--- a/packages/components/src/alignment-matrix-control/index.tsx
+++ b/packages/components/src/alignment-matrix-control/index.tsx
@@ -25,7 +25,7 @@ import type { AlignmentMatrixControlProps } from './types';
  * AlignmentMatrixControl components enable adjustments to horizontal and vertical alignments for UI.
  *
  * ```jsx
- * import { __experimentalAlignmentMatrixControl as AlignmentMatrixControl } from '@wordpress/components';
+ * import { AlignmentMatrixControl } from '@wordpress/components';
  * import { useState } from '@wordpress/element';
  *
  * const Example = () => {
diff --git a/packages/components/src/alignment-matrix-control/stories/index.story.tsx b/packages/components/src/alignment-matrix-control/stories/index.story.tsx
index 03bec9d92a8b78..9d276def5b001f 100644
--- a/packages/components/src/alignment-matrix-control/stories/index.story.tsx
+++ b/packages/components/src/alignment-matrix-control/stories/index.story.tsx
@@ -17,7 +17,7 @@ import { HStack } from '../../h-stack';
 import type { AlignmentMatrixControlProps } from '../types';
 
 const meta: Meta< typeof AlignmentMatrixControl > = {
-	title: 'Components (Experimental)/AlignmentMatrixControl',
+	title: 'Components/AlignmentMatrixControl',
 	component: AlignmentMatrixControl,
 	subcomponents: {
 		// @ts-expect-error - See https://github.com/storybookjs/storybook/issues/23170
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index a824162cb24129..f41c374841f3fd 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -12,7 +12,13 @@ export {
 } from '@wordpress/primitives';
 
 // Components.
-export { default as __experimentalAlignmentMatrixControl } from './alignment-matrix-control';
+export {
+	/**
+	 * @deprecated Import `AlignmentMatrixControl` instead.
+	 */
+	default as __experimentalAlignmentMatrixControl,
+	AlignmentMatrixControl,
+} from './alignment-matrix-control';
 export {
 	default as Animate,
 	getAnimateClassName as __unstableGetAnimateClassName,
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 629f06bf98edf9..cb39837db0a06b 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -1,6 +1,9 @@
 <script>
 	( function redirectIfStoryMoved() {
-		const PREVIOUSLY_EXPERIMENTAL_COMPONENTS = [ 'navigation' ];
+		const PREVIOUSLY_EXPERIMENTAL_COMPONENTS = [
+			'navigation',
+			'alignmentmatrixcontrol',
+		];
 		const REDIRECTS = [
 			{
 				from: /\/components-deprecated-/,

From 7f293c34771419cfa7c71b3790111b7f75c13b09 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 16:43:02 -0600
Subject: [PATCH 02/32] Remove "experimental" designation for
 `BorderBoxControl`

---
 .../src/border-box-control/border-box-control/README.md    | 7 +------
 .../border-box-control/border-box-control/component.tsx    | 2 +-
 .../src/border-box-control/stories/index.story.tsx         | 2 +-
 packages/components/src/index.ts                           | 4 ++++
 storybook/manager-head.html                                | 1 +
 5 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/packages/components/src/border-box-control/border-box-control/README.md b/packages/components/src/border-box-control/border-box-control/README.md
index 20352e03c8243d..7671292d835cd3 100644
--- a/packages/components/src/border-box-control/border-box-control/README.md
+++ b/packages/components/src/border-box-control/border-box-control/README.md
@@ -1,10 +1,5 @@
 # BorderBoxControl
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-<br />
-
 This component provides users with the ability to configure a single "flat"
 border or separate borders per side.
 
@@ -28,7 +23,7 @@ show "Mixed" placeholder text.
 
 ```jsx
 import { useState } from 'react';
-import { __experimentalBorderBoxControl as BorderBoxControl } from '@wordpress/components';
+import { BorderBoxControl } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 
 const colors = [
diff --git a/packages/components/src/border-box-control/border-box-control/component.tsx b/packages/components/src/border-box-control/border-box-control/component.tsx
index 26967ad7f63ddb..f1a55f88c03b75 100644
--- a/packages/components/src/border-box-control/border-box-control/component.tsx
+++ b/packages/components/src/border-box-control/border-box-control/component.tsx
@@ -162,7 +162,7 @@ const UnconnectedBorderBoxControl = (
  * view's width input would show "Mixed" placeholder text.
  *
  * ```jsx
- * import { __experimentalBorderBoxControl as BorderBoxControl } from '@wordpress/components';
+ * import { BorderBoxControl } from '@wordpress/components';
  * import { __ } from '@wordpress/i18n';
  *
  * const colors = [
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 5b5d7f311208c0..7ac8cbbea8c159 100644
--- a/packages/components/src/border-box-control/stories/index.story.tsx
+++ b/packages/components/src/border-box-control/stories/index.story.tsx
@@ -16,7 +16,7 @@ import Button from '../../button';
 import { BorderBoxControl } from '../';
 
 const meta: Meta< typeof BorderBoxControl > = {
-	title: 'Components (Experimental)/BorderBoxControl',
+	title: 'Components/BorderBoxControl',
 	component: BorderBoxControl,
 	argTypes: {
 		onChange: { action: 'onChange' },
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index f41c374841f3fd..da3b002df4f34f 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -35,10 +35,14 @@ export {
 } from './autocomplete';
 export { default as BaseControl, useBaseControlProps } from './base-control';
 export {
+	/**
+	 * @deprecated Import `BorderBoxControl` instead.
+	 */
 	BorderBoxControl as __experimentalBorderBoxControl,
 	hasSplitBorders as __experimentalHasSplitBorders,
 	isDefinedBorder as __experimentalIsDefinedBorder,
 	isEmptyBorder as __experimentalIsEmptyBorder,
+	BorderBoxControl,
 } from './border-box-control';
 export { BorderControl as __experimentalBorderControl } from './border-control';
 export {
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index cb39837db0a06b..89e5ac77111e91 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -3,6 +3,7 @@
 		const PREVIOUSLY_EXPERIMENTAL_COMPONENTS = [
 			'navigation',
 			'alignmentmatrixcontrol',
+			'borderboxcontrol',
 		];
 		const REDIRECTS = [
 			{

From 454d7c94eb3d7796c611184e8bd14752306a330b Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 16:59:16 -0600
Subject: [PATCH 03/32] Remove "experimental" designation for `BorderControl`

---
 .../src/border-control/border-control/README.md           | 6 +-----
 .../src/border-control/border-control/component.tsx       | 2 +-
 .../components/src/border-control/stories/index.story.tsx | 2 +-
 packages/components/src/index.ts                          | 8 +++++++-
 storybook/manager-head.html                               | 1 +
 5 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/packages/components/src/border-control/border-control/README.md b/packages/components/src/border-control/border-control/README.md
index 51fb7172b7c553..1ce3e3eacbf19d 100644
--- a/packages/components/src/border-control/border-control/README.md
+++ b/packages/components/src/border-control/border-control/README.md
@@ -1,9 +1,5 @@
 #  BorderControl
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-<br />
 This component provides control over a border's color, style, and width.
 
 ## Development guidelines
@@ -21,7 +17,7 @@ a "shape" abstraction.
 
 ```jsx
 import { useState } from 'react';
-import { __experimentalBorderControl as BorderControl } from '@wordpress/components';
+import { BorderControl } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 
 const colors = [
diff --git a/packages/components/src/border-control/border-control/component.tsx b/packages/components/src/border-control/border-control/component.tsx
index 5fe2abce1b4117..6dc3e8a6891ad2 100644
--- a/packages/components/src/border-control/border-control/component.tsx
+++ b/packages/components/src/border-control/border-control/component.tsx
@@ -134,7 +134,7 @@ const UnconnectedBorderControl = (
  * a "shape" abstraction.
  *
  * ```jsx
- * import { __experimentalBorderControl as BorderControl } from '@wordpress/components';
+ * import { BorderControl } from '@wordpress/components';
  * import { __ } from '@wordpress/i18n';
  *
  * const colors = [
diff --git a/packages/components/src/border-control/stories/index.story.tsx b/packages/components/src/border-control/stories/index.story.tsx
index 9a5349d302c276..19938db5d0e51e 100644
--- a/packages/components/src/border-control/stories/index.story.tsx
+++ b/packages/components/src/border-control/stories/index.story.tsx
@@ -16,7 +16,7 @@ import { BorderControl } from '..';
 import type { Border } from '../types';
 
 const meta: Meta< typeof BorderControl > = {
-	title: 'Components (Experimental)/BorderControl',
+	title: 'Components/BorderControl',
 	component: BorderControl,
 	argTypes: {
 		onChange: {
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index da3b002df4f34f..928aba1bb31f82 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -44,7 +44,13 @@ export {
 	isEmptyBorder as __experimentalIsEmptyBorder,
 	BorderBoxControl,
 } from './border-box-control';
-export { BorderControl as __experimentalBorderControl } from './border-control';
+export {
+	/**
+	 * @deprecated Import `BorderControl` instead.
+	 */
+	BorderControl as __experimentalBorderControl,
+	BorderControl,
+} from './border-control';
 export {
 	default as __experimentalBoxControl,
 	applyValueToSides as __experimentalApplyValueToSides,
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 89e5ac77111e91..3d53d03c40060f 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -4,6 +4,7 @@
 			'navigation',
 			'alignmentmatrixcontrol',
 			'borderboxcontrol',
+			'bordercontrol',
 		];
 		const REDIRECTS = [
 			{

From 18749b4814f80c88c999b3505452bf35b4c3e357 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 17:16:14 -0600
Subject: [PATCH 04/32] Remove "experimental" designation for `BoxControl`

---
 packages/components/src/box-control/README.md               | 6 +-----
 packages/components/src/box-control/index.tsx               | 2 +-
 packages/components/src/box-control/stories/index.story.tsx | 2 +-
 packages/components/src/index.ts                            | 4 ++++
 packages/components/src/tools-panel/tools-panel/README.md   | 2 +-
 storybook/manager-head.html                                 | 1 +
 6 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/packages/components/src/box-control/README.md b/packages/components/src/box-control/README.md
index 2fd214b79157f7..364509b0189bcd 100644
--- a/packages/components/src/box-control/README.md
+++ b/packages/components/src/box-control/README.md
@@ -1,16 +1,12 @@
 # BoxControl
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 BoxControl components let users set values for Top, Right, Bottom, and Left. This can be used as an input control for values like `padding` or `margin`.
 
 ## Usage
 
 ```jsx
 import { useState } from 'react';
-import { __experimentalBoxControl as BoxControl } from '@wordpress/components';
+import { BoxControl } from '@wordpress/components';
 
 const Example = () => {
 	const [ values, setValues ] = useState( {
diff --git a/packages/components/src/box-control/index.tsx b/packages/components/src/box-control/index.tsx
index 9c3452d4ccb806..3f9791c2ba4d7a 100644
--- a/packages/components/src/box-control/index.tsx
+++ b/packages/components/src/box-control/index.tsx
@@ -51,7 +51,7 @@ function useUniqueId( idProp?: string ) {
  * This can be used as an input control for values like `padding` or `margin`.
  *
  * ```jsx
- * import { __experimentalBoxControl as BoxControl } from '@wordpress/components';
+ * import { BoxControl } from '@wordpress/components';
  * import { useState } from '@wordpress/element';
  *
  * const Example = () => {
diff --git a/packages/components/src/box-control/stories/index.story.tsx b/packages/components/src/box-control/stories/index.story.tsx
index 1b6604048f6d52..783f9d047b1bb0 100644
--- a/packages/components/src/box-control/stories/index.story.tsx
+++ b/packages/components/src/box-control/stories/index.story.tsx
@@ -14,7 +14,7 @@ import { useState } from '@wordpress/element';
 import BoxControl from '../';
 
 const meta: Meta< typeof BoxControl > = {
-	title: 'Components (Experimental)/BoxControl',
+	title: 'Components/BoxControl',
 	component: BoxControl,
 	argTypes: {
 		values: { control: { type: null } },
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 928aba1bb31f82..ea306d673465bf 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -52,8 +52,12 @@ export {
 	BorderControl,
 } from './border-control';
 export {
+	/**
+	 * @deprecated Import `BoxControl` instead.
+	 */
 	default as __experimentalBoxControl,
 	applyValueToSides as __experimentalApplyValueToSides,
+	default as BoxControl,
 } from './box-control';
 export { default as Button } from './button';
 export { default as ButtonGroup } from './button-group';
diff --git a/packages/components/src/tools-panel/tools-panel/README.md b/packages/components/src/tools-panel/tools-panel/README.md
index df41b623eefb6c..feec34319c689a 100644
--- a/packages/components/src/tools-panel/tools-panel/README.md
+++ b/packages/components/src/tools-panel/tools-panel/README.md
@@ -60,7 +60,7 @@ import styled from '@emotion/styled';
  * WordPress dependencies
  */
 import {
-	__experimentalBoxControl as BoxControl,
+	BoxControl,
 	__experimentalToolsPanel as ToolsPanel,
 	__experimentalToolsPanelItem as ToolsPanelItem,
 	__experimentalUnitControl as UnitControl,
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 3d53d03c40060f..95c08ff185e51c 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -5,6 +5,7 @@
 			'alignmentmatrixcontrol',
 			'borderboxcontrol',
 			'bordercontrol',
+			'boxcontrol',
 		];
 		const REDIRECTS = [
 			{

From a7d8c86198ef2a3ffa87db2233f19a5b560252da Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 17:09:54 -0600
Subject: [PATCH 05/32] Remove "experimental" designation for `ConfirmDialog`

---
 packages/components/src/confirm-dialog/README.md          | 8 ++------
 packages/components/src/confirm-dialog/component.tsx      | 4 ++--
 .../components/src/confirm-dialog/stories/index.story.tsx | 2 +-
 packages/components/src/index.ts                          | 8 +++++++-
 storybook/manager-head.html                               | 1 +
 5 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/packages/components/src/confirm-dialog/README.md b/packages/components/src/confirm-dialog/README.md
index 3ad42d9d68160e..f96e9bce7a62e2 100644
--- a/packages/components/src/confirm-dialog/README.md
+++ b/packages/components/src/confirm-dialog/README.md
@@ -1,9 +1,5 @@
 # `ConfirmDialog`
 
-<div class="callout callout-alert">
-This feature is still experimental. "Experimental" means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `ConfirmDialog` is built of top of [`Modal`](/packages/components/src/modal/README.md) and displays a confirmation dialog, with _confirm_ and _cancel_ buttons.
 
 The dialog is confirmed by clicking the _confirm_ button or by pressing the `Enter` key. It is cancelled (closed) by clicking the _cancel_ button, by pressing the `ESC` key, or by clicking outside the dialog focus (i.e, the overlay).
@@ -23,7 +19,7 @@ Allows the component to be used standalone, just by declaring it as part of anot
 Activating this mode is as simple as omitting the `isOpen` prop. The only mandatory prop, in this case, is the `onConfirm` callback. The message is passed as the `children`. You can pass any JSX you'd like, which allows to further format the message or include sub-component if you'd like:
 
 ```jsx
-import { __experimentalConfirmDialog as ConfirmDialog } from '@wordpress/components';
+import { ConfirmDialog } from '@wordpress/components';
 
 function Example() {
 	return (
@@ -44,7 +40,7 @@ Let the parent component control when the dialog is open/closed. It's activated
 
 ```jsx
 import { useState } from 'react';
-import { __experimentalConfirmDialog as ConfirmDialog } from '@wordpress/components';
+import { ConfirmDialog } from '@wordpress/components';
 
 function Example() {
 	const [ isOpen, setIsOpen ] = useState( true );
diff --git a/packages/components/src/confirm-dialog/component.tsx b/packages/components/src/confirm-dialog/component.tsx
index 7e787439d91dfd..d4c72c9b1570de 100644
--- a/packages/components/src/confirm-dialog/component.tsx
+++ b/packages/components/src/confirm-dialog/component.tsx
@@ -138,7 +138,7 @@ const UnconnectedConfirmDialog = (
  * Activating this mode is as simple as omitting the `isOpen` prop. The only mandatory prop, in this case, is the `onConfirm` callback. The message is passed as the `children`. You can pass any JSX you'd like, which allows to further format the message or include sub-component if you'd like:
  *
  * ```jsx
- * import { __experimentalConfirmDialog as ConfirmDialog } from '@wordpress/components';
+ * import { ConfirmDialog } from '@wordpress/components';
  *
  * function Example() {
  * 	return (
@@ -158,7 +158,7 @@ const UnconnectedConfirmDialog = (
  * -   You'll want to update the state that controls `isOpen` by updating it from the `onCancel` and `onConfirm` callbacks.
  *
  *```jsx
- * import { __experimentalConfirmDialog as ConfirmDialog } from '@wordpress/components';
+ * import { ConfirmDialog } from '@wordpress/components';
  * import { useState } from '@wordpress/element';
  *
  * function Example() {
diff --git a/packages/components/src/confirm-dialog/stories/index.story.tsx b/packages/components/src/confirm-dialog/stories/index.story.tsx
index 85636c0ddc81ed..d242e765c7cbec 100644
--- a/packages/components/src/confirm-dialog/stories/index.story.tsx
+++ b/packages/components/src/confirm-dialog/stories/index.story.tsx
@@ -16,7 +16,7 @@ import { ConfirmDialog } from '../component';
 
 const meta: Meta< typeof ConfirmDialog > = {
 	component: ConfirmDialog,
-	title: 'Components (Experimental)/ConfirmDialog',
+	title: 'Components/ConfirmDialog',
 	argTypes: {
 		isOpen: {
 			control: { type: null },
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index ea306d673465bf..bff0a807e7afd4 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -82,7 +82,13 @@ export {
 	CompositeItem as __unstableCompositeItem,
 	useCompositeState as __unstableUseCompositeState,
 } from './composite';
-export { ConfirmDialog as __experimentalConfirmDialog } from './confirm-dialog';
+export {
+	/**
+	 * @deprecated Import `ConfirmDialog` instead.
+	 */
+	ConfirmDialog as __experimentalConfirmDialog,
+	ConfirmDialog,
+} from './confirm-dialog';
 export { StableCustomSelectControl as CustomSelectControl } from './custom-select-control';
 export { default as Dashicon } from './dashicon';
 export { default as DateTimePicker, DatePicker, TimePicker } from './date-time';
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 95c08ff185e51c..ee1ad0f1be4f72 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -6,6 +6,7 @@
 			'borderboxcontrol',
 			'bordercontrol',
 			'boxcontrol',
+			'confirmdialog',
 		];
 		const REDIRECTS = [
 			{

From f32aab3a6e943e5bd5c49e6a2ad1c74d7be88a7e Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 17:30:33 -0600
Subject: [PATCH 06/32] Remove "experimental" designation for
 `DimensionControl`

---
 packages/components/src/dimension-control/README.md       | 6 +-----
 packages/components/src/dimension-control/index.tsx       | 2 +-
 .../src/dimension-control/stories/index.story.tsx         | 2 +-
 packages/components/src/index.ts                          | 8 +++++++-
 storybook/manager-head.html                               | 1 +
 5 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/packages/components/src/dimension-control/README.md b/packages/components/src/dimension-control/README.md
index 498322931b7ab6..46daac1d1e6a87 100644
--- a/packages/components/src/dimension-control/README.md
+++ b/packages/components/src/dimension-control/README.md
@@ -1,16 +1,12 @@
 # DimensionControl
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `DimensionControl` is a component designed to provide a UI to control spacing and/or dimensions.
 
 ## Usage
 
 ```jsx
 import { useState } from 'react';
-import { __experimentalDimensionControl as DimensionControl } from '@wordpress/components';
+import { DimensionControl } from '@wordpress/components';
 
 export default function MyCustomDimensionControl() {
 	const [ paddingSize, setPaddingSize ] = useState( '' );
diff --git a/packages/components/src/dimension-control/index.tsx b/packages/components/src/dimension-control/index.tsx
index 38ad5b2f85ccc7..3f0eabe08de198 100644
--- a/packages/components/src/dimension-control/index.tsx
+++ b/packages/components/src/dimension-control/index.tsx
@@ -23,7 +23,7 @@ import type { SelectControlSingleSelectionProps } from '../select-control/types'
  * This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
  *
  * ```jsx
- * import { __experimentalDimensionControl as DimensionControl } from '@wordpress/components';
+ * import { DimensionControl } from '@wordpress/components';
  * import { useState } from '@wordpress/element';
  *
  * export default function MyCustomDimensionControl() {
diff --git a/packages/components/src/dimension-control/stories/index.story.tsx b/packages/components/src/dimension-control/stories/index.story.tsx
index 1220be3d4eea1f..f8c1bb30e2f07e 100644
--- a/packages/components/src/dimension-control/stories/index.story.tsx
+++ b/packages/components/src/dimension-control/stories/index.story.tsx
@@ -15,7 +15,7 @@ import { desktop, tablet, mobile } from '@wordpress/icons';
 
 export default {
 	component: DimensionControl,
-	title: 'Components (Experimental)/DimensionControl',
+	title: 'Components/DimensionControl',
 	argTypes: {
 		onChange: { action: 'onChange' },
 		value: { control: { type: null } },
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index bff0a807e7afd4..1e624e1f402035 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -92,7 +92,13 @@ export {
 export { StableCustomSelectControl as CustomSelectControl } from './custom-select-control';
 export { default as Dashicon } from './dashicon';
 export { default as DateTimePicker, DatePicker, TimePicker } from './date-time';
-export { default as __experimentalDimensionControl } from './dimension-control';
+export {
+	/**
+	 * @deprecated Import `DimensionControl` instead.
+	 */
+	default as __experimentalDimensionControl,
+	DimensionControl,
+} from './dimension-control';
 export { default as Disabled } from './disabled';
 export { DisclosureContent as __unstableDisclosureContent } from './disclosure';
 export { Divider as __experimentalDivider } from './divider';
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index ee1ad0f1be4f72..2613c2629cd938 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -7,6 +7,7 @@
 			'bordercontrol',
 			'boxcontrol',
 			'confirmdialog',
+			'dimensioncontrol',
 		];
 		const REDIRECTS = [
 			{

From a6f64883fd17a90e74c136672686d6dd8c9031aa Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 17:38:25 -0600
Subject: [PATCH 07/32] Remove "experimental" designation for `Divider`

---
 packages/components/src/divider/README.md               | 6 +-----
 packages/components/src/divider/component.tsx           | 2 +-
 packages/components/src/divider/stories/index.story.tsx | 2 +-
 packages/components/src/index.ts                        | 8 +++++++-
 storybook/manager-head.html                             | 1 +
 5 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/packages/components/src/divider/README.md b/packages/components/src/divider/README.md
index c81026b7b55871..311872b11083a4 100644
--- a/packages/components/src/divider/README.md
+++ b/packages/components/src/divider/README.md
@@ -1,16 +1,12 @@
 # Divider
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `Divider` is a layout component that separates groups of related content.
 
 ## Usage
 
 ```jsx
 import {
-	__experimentalDivider as Divider,
+	Divider,
 	__experimentalText as Text,
 	__experimentalVStack as VStack,
 } from `@wordpress/components`;
diff --git a/packages/components/src/divider/component.tsx b/packages/components/src/divider/component.tsx
index 3870c2f12c4fc3..bd42197ee544d1 100644
--- a/packages/components/src/divider/component.tsx
+++ b/packages/components/src/divider/component.tsx
@@ -33,7 +33,7 @@ function UnconnectedDivider(
  *
  * ```js
  * import {
- * 		__experimentalDivider as Divider,
+ * 		Divider,
  * 		__experimentalText as Text,
  * 		__experimentalVStack as VStack,
  * } from `@wordpress/components`;
diff --git a/packages/components/src/divider/stories/index.story.tsx b/packages/components/src/divider/stories/index.story.tsx
index 4910c1b591c524..abe02ea97c4270 100644
--- a/packages/components/src/divider/stories/index.story.tsx
+++ b/packages/components/src/divider/stories/index.story.tsx
@@ -12,7 +12,7 @@ import { Flex } from '../../flex';
 
 const meta: Meta< typeof Divider > = {
 	component: Divider,
-	title: 'Components (Experimental)/Divider',
+	title: 'Components/Divider',
 	argTypes: {
 		margin: {
 			control: { type: 'text' },
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 1e624e1f402035..c9c2070fcc012b 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -101,7 +101,13 @@ export {
 } from './dimension-control';
 export { default as Disabled } from './disabled';
 export { DisclosureContent as __unstableDisclosureContent } from './disclosure';
-export { Divider as __experimentalDivider } from './divider';
+export {
+	/**
+	 * @deprecated Import `Divider` instead.
+	 */
+	Divider as __experimentalDivider,
+	Divider,
+} from './divider';
 export { default as Draggable } from './draggable';
 export { default as DropZone } from './drop-zone';
 export { default as DropZoneProvider } from './drop-zone/provider';
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 2613c2629cd938..5deb3bd7e11380 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -8,6 +8,7 @@
 			'boxcontrol',
 			'confirmdialog',
 			'dimensioncontrol',
+			'divider',
 		];
 		const REDIRECTS = [
 			{

From 0a72cba303c9f8adfe02706670f1a2c9a78e580e Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 17:51:23 -0600
Subject: [PATCH 08/32] Remove "experimental" designation for `Elevation`

---
 packages/components/src/elevation/README.md               | 8 ++------
 packages/components/src/elevation/component.tsx           | 2 +-
 packages/components/src/elevation/stories/index.story.tsx | 2 +-
 packages/components/src/index.ts                          | 8 +++++++-
 storybook/manager-head.html                               | 1 +
 5 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/packages/components/src/elevation/README.md b/packages/components/src/elevation/README.md
index 3cdb379b82ab4f..30d9cb0666d612 100644
--- a/packages/components/src/elevation/README.md
+++ b/packages/components/src/elevation/README.md
@@ -1,9 +1,5 @@
 # Elevation
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `Elevation` is a core component that renders shadow, using the component system's shadow system.
 
 ## Usage
@@ -12,7 +8,7 @@ The shadow effect is generated using the `value` prop.
 
 ```jsx
 import {
-	__experimentalElevation as Elevation,
+	Elevation,
 	__experimentalSurface as Surface,
 	__experimentalText as Text,
 } from '@wordpress/components';
@@ -75,7 +71,7 @@ Size of the shadow, based on the Style system's elevation system. The `value` de
 In the example below, `isInteractive` is activated to give a better sense of depth.
 
 ```jsx
-import { __experimentalElevation as Elevation } from '@wordpress/components';
+import { Elevation } from '@wordpress/components';
 
 function Example() {
 	return (
diff --git a/packages/components/src/elevation/component.tsx b/packages/components/src/elevation/component.tsx
index d116859d9a303a..c203b236a5cf8c 100644
--- a/packages/components/src/elevation/component.tsx
+++ b/packages/components/src/elevation/component.tsx
@@ -29,7 +29,7 @@ function UnconnectedElevation(
  *
  * ```jsx
  * import {
- *	__experimentalElevation as Elevation,
+ *	Elevation,
  *	__experimentalSurface as Surface,
  *	__experimentalText as Text,
  * } from '@wordpress/components';
diff --git a/packages/components/src/elevation/stories/index.story.tsx b/packages/components/src/elevation/stories/index.story.tsx
index 912268f5341147..326f13eaec78d8 100644
--- a/packages/components/src/elevation/stories/index.story.tsx
+++ b/packages/components/src/elevation/stories/index.story.tsx
@@ -10,7 +10,7 @@ import { Elevation } from '..';
 
 const meta: Meta< typeof Elevation > = {
 	component: Elevation,
-	title: 'Components (Experimental)/Elevation',
+	title: 'Components/Elevation',
 	argTypes: {
 		as: { control: { type: 'text' } },
 		borderRadius: { control: { type: 'text' } },
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index c9c2070fcc012b..2ebb0c44081ed0 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -115,7 +115,13 @@ export { default as Dropdown } from './dropdown';
 export { default as __experimentalDropdownContentWrapper } from './dropdown/dropdown-content-wrapper';
 export { default as DropdownMenu } from './dropdown-menu';
 export { DuotoneSwatch, DuotonePicker } from './duotone-picker';
-export { Elevation as __experimentalElevation } from './elevation';
+export {
+	/**
+	 * @deprecated Import `Elevation` instead.
+	 */
+	Elevation as __experimentalElevation,
+	Elevation,
+} from './elevation';
 export { default as ExternalLink } from './external-link';
 export { Flex, FlexBlock, FlexItem } from './flex';
 export { default as FocalPointPicker } from './focal-point-picker';
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 5deb3bd7e11380..0eed2f28923ef1 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -9,6 +9,7 @@
 			'confirmdialog',
 			'dimensioncontrol',
 			'divider',
+			'elevation',
 		];
 		const REDIRECTS = [
 			{

From 7adc409fabe8881e9c95a96d647dedc147e10dd9 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 17:57:59 -0600
Subject: [PATCH 09/32] Remove "experimental" designation for `Grid`

---
 packages/components/src/grid/README.md               | 6 +-----
 packages/components/src/grid/component.tsx           | 2 +-
 packages/components/src/grid/stories/index.story.tsx | 2 +-
 packages/components/src/index.ts                     | 8 +++++++-
 storybook/manager-head.html                          | 1 +
 5 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/packages/components/src/grid/README.md b/packages/components/src/grid/README.md
index 15cd959e135bee..89b162b7618922 100644
--- a/packages/components/src/grid/README.md
+++ b/packages/components/src/grid/README.md
@@ -1,16 +1,12 @@
 # Grid
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `Grid` is a primitive layout component that can arrange content in a grid configuration.
 
 ## Usage
 
 ```jsx
 import {
-	__experimentalGrid as Grid,
+	Grid,
 	__experimentalText as Text,
 } from '@wordpress/components';
 
diff --git a/packages/components/src/grid/component.tsx b/packages/components/src/grid/component.tsx
index f18909c8e1c9ae..e86211cb4f898a 100644
--- a/packages/components/src/grid/component.tsx
+++ b/packages/components/src/grid/component.tsx
@@ -26,7 +26,7 @@ function UnconnectedGrid(
  *
  * ```jsx
  * import {
- * 	__experimentalGrid as Grid,
+ * 	Grid,
  * 	__experimentalText as Text
  * } from `@wordpress/components`;
  *
diff --git a/packages/components/src/grid/stories/index.story.tsx b/packages/components/src/grid/stories/index.story.tsx
index 171b324e033c04..f4355657a5d81a 100644
--- a/packages/components/src/grid/stories/index.story.tsx
+++ b/packages/components/src/grid/stories/index.story.tsx
@@ -11,7 +11,7 @@ import { Grid } from '..';
 
 const meta: Meta< typeof Grid > = {
 	component: Grid,
-	title: 'Components (Experimental)/Grid',
+	title: 'Components/Grid',
 	argTypes: {
 		as: { control: { type: 'text' } },
 		align: { control: { type: 'text' } },
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 2ebb0c44081ed0..b063f81ee3de2a 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -132,7 +132,13 @@ export { default as FormToggle } from './form-toggle';
 export { default as FormTokenField } from './form-token-field';
 export { default as GradientPicker } from './gradient-picker';
 export { default as CustomGradientPicker } from './custom-gradient-picker';
-export { Grid as __experimentalGrid } from './grid';
+export {
+	/**
+	 * @deprecated Import `Grid` instead.
+	 */
+	Grid as __experimentalGrid,
+	Grid,
+} from './grid';
 export { default as Guide } from './guide';
 export { default as GuidePage } from './guide/page';
 export { Heading as __experimentalHeading } from './heading';
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 0eed2f28923ef1..14acb028c317c5 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -10,6 +10,7 @@
 			'dimensioncontrol',
 			'divider',
 			'elevation',
+			'grid',
 		];
 		const REDIRECTS = [
 			{

From 58fbbb51d438fcd781601edb4285f28635cd4f79 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 18:01:44 -0600
Subject: [PATCH 10/32] Remove "experimental" designation for `HStack`

---
 packages/components/src/h-stack/README.md              | 10 +++-------
 packages/components/src/h-stack/component.tsx          |  2 +-
 .../components/src/h-stack/stories/index.story.tsx     |  2 +-
 packages/components/src/index.ts                       |  8 +++++++-
 storybook/manager-head.html                            |  1 +
 5 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/packages/components/src/h-stack/README.md b/packages/components/src/h-stack/README.md
index 77e3c77b940f2a..c1819c5d80bf13 100644
--- a/packages/components/src/h-stack/README.md
+++ b/packages/components/src/h-stack/README.md
@@ -1,9 +1,5 @@
 # HStack
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `HStack` (Horizontal Stack) arranges child elements in a horizontal line.
 
 ## Usage
@@ -12,7 +8,7 @@ This feature is still experimental. “Experimental” means this is an early im
 
 ```jsx
 import {
-	__experimentalHStack as HStack,
+	HStack,
 	__experimentalText as Text,
 } from '@wordpress/components';
 
@@ -85,7 +81,7 @@ When a `Spacer` is used within an `HStack`, the `Spacer` adaptively expands to t
 
 ```jsx
 import {
-	__experimentalHStack as HStack,
+	HStack,
 	__experimentalSpacer as Spacer,
 	__experimentalText as Text,
 } from '@wordpress/components';
@@ -107,7 +103,7 @@ function Example() {
 
 ```jsx
 import {
-	__experimentalHStack as HStack,
+	HStack,
 	__experimentalSpacer as Spacer,
 	__experimentalText as Text,
 } from '@wordpress/components';
diff --git a/packages/components/src/h-stack/component.tsx b/packages/components/src/h-stack/component.tsx
index 1d1efebe8a0912..c2a7cfc51df250 100644
--- a/packages/components/src/h-stack/component.tsx
+++ b/packages/components/src/h-stack/component.tsx
@@ -23,7 +23,7 @@ function UnconnectedHStack(
  *
  * ```jsx
  * import {
- * 	__experimentalHStack as HStack,
+ * 	HStack,
  * 	__experimentalText as Text,
  * } from `@wordpress/components`;
  *
diff --git a/packages/components/src/h-stack/stories/index.story.tsx b/packages/components/src/h-stack/stories/index.story.tsx
index 88aebb7682e476..10755905ddc778 100644
--- a/packages/components/src/h-stack/stories/index.story.tsx
+++ b/packages/components/src/h-stack/stories/index.story.tsx
@@ -42,7 +42,7 @@ const JUSTIFICATIONS = {
 
 const meta: Meta< typeof HStack > = {
 	component: HStack,
-	title: 'Components (Experimental)/HStack',
+	title: 'Components/HStack',
 	argTypes: {
 		as: {
 			control: { type: null },
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index b063f81ee3de2a..05404edfe2d219 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -142,7 +142,13 @@ export {
 export { default as Guide } from './guide';
 export { default as GuidePage } from './guide/page';
 export { Heading as __experimentalHeading } from './heading';
-export { HStack as __experimentalHStack } from './h-stack';
+export {
+	/**
+	 * @deprecated Import `HStack` instead.
+	 */
+	HStack as __experimentalHStack,
+	HStack,
+} from './h-stack';
 export { default as Icon } from './icon';
 export type { IconType } from './icon';
 export { default as IconButton } from './button/deprecated';
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 14acb028c317c5..f455e0d337b84e 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -11,6 +11,7 @@
 			'divider',
 			'elevation',
 			'grid',
+			'hstack',
 		];
 		const REDIRECTS = [
 			{

From 314e0141c78065a7f3f8036d46b3e1050b0aa7cd Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 18:06:13 -0600
Subject: [PATCH 11/32] Remove "experimental" designation for `Heading`

---
 packages/components/src/card/card/README.md             | 2 +-
 packages/components/src/card/card/component.tsx         | 2 +-
 packages/components/src/heading/README.md               | 6 +-----
 packages/components/src/heading/component.tsx           | 2 +-
 packages/components/src/heading/stories/index.story.tsx | 2 +-
 packages/components/src/index.ts                        | 8 +++++++-
 packages/components/src/spacer/README.md                | 2 +-
 storybook/manager-head.html                             | 1 +
 8 files changed, 14 insertions(+), 11 deletions(-)

diff --git a/packages/components/src/card/card/README.md b/packages/components/src/card/card/README.md
index 5a97913c884076..26cccfdddbf447 100644
--- a/packages/components/src/card/card/README.md
+++ b/packages/components/src/card/card/README.md
@@ -13,7 +13,7 @@ import {
 	CardBody,
 	CardFooter,
 	__experimentalText as Text,
-	__experimentalHeading as Heading,
+	Heading,
 } from '@wordpress/components';
 
 function Example() {
diff --git a/packages/components/src/card/card/component.tsx b/packages/components/src/card/card/component.tsx
index 8fefc33bd48027..dddcd2371e819e 100644
--- a/packages/components/src/card/card/component.tsx
+++ b/packages/components/src/card/card/component.tsx
@@ -86,7 +86,7 @@ function UnconnectedCard(
  *   CardBody,
  *   CardFooter,
  *   __experimentalText as Text,
- *   __experimentalHeading as Heading,
+ *   Heading,
  * } from `@wordpress/components`;
  *
  * function Example() {
diff --git a/packages/components/src/heading/README.md b/packages/components/src/heading/README.md
index a56e6e6ccd9321..303e0ac634415b 100644
--- a/packages/components/src/heading/README.md
+++ b/packages/components/src/heading/README.md
@@ -1,15 +1,11 @@
 # Heading
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `Heading` renders headings and titles using the library's typography system.
 
 ## Usage
 
 ```jsx
-import { __experimentalHeading as Heading } from '@wordpress/components';
+import { Heading } from '@wordpress/components';
 
 function Example() {
 	return <Heading>Code is Poetry</Heading>;
diff --git a/packages/components/src/heading/component.tsx b/packages/components/src/heading/component.tsx
index a42af8b05f471d..7d29ac232fd2aa 100644
--- a/packages/components/src/heading/component.tsx
+++ b/packages/components/src/heading/component.tsx
@@ -25,7 +25,7 @@ function UnconnectedHeading(
  * `Heading` renders headings and titles using the library's typography system.
  *
  * ```jsx
- * import { __experimentalHeading as Heading } from "@wordpress/components";
+ * import { Heading } from "@wordpress/components";
  *
  * function Example() {
  *   return <Heading>Code is Poetry</Heading>;
diff --git a/packages/components/src/heading/stories/index.story.tsx b/packages/components/src/heading/stories/index.story.tsx
index d82a59f08c825b..b02fc59c59e443 100644
--- a/packages/components/src/heading/stories/index.story.tsx
+++ b/packages/components/src/heading/stories/index.story.tsx
@@ -10,7 +10,7 @@ import { Heading } from '..';
 
 const meta: Meta< typeof Heading > = {
 	component: Heading,
-	title: 'Components (Experimental)/Heading',
+	title: 'Components/Heading',
 	argTypes: {
 		as: { control: { type: 'text' } },
 		color: { control: { type: 'color' } },
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 05404edfe2d219..e5a162a4ae2e2a 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -141,7 +141,13 @@ export {
 } from './grid';
 export { default as Guide } from './guide';
 export { default as GuidePage } from './guide/page';
-export { Heading as __experimentalHeading } from './heading';
+export {
+	/**
+	 * @deprecated Import `Heading` instead.
+	 */
+	Heading as __experimentalHeading,
+	Heading,
+} from './heading';
 export {
 	/**
 	 * @deprecated Import `HStack` instead.
diff --git a/packages/components/src/spacer/README.md b/packages/components/src/spacer/README.md
index 16160d39b61fa0..f6ada7438923a0 100644
--- a/packages/components/src/spacer/README.md
+++ b/packages/components/src/spacer/README.md
@@ -13,7 +13,7 @@ This feature is still experimental. “Experimental” means this is an early im
 ```jsx
 import {
 	__experimentalSpacer as Spacer,
-	__experimentalHeading as Heading,
+	Heading,
 	__experimentalView as View,
 } from '@wordpress/components';
 
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index f455e0d337b84e..cab4692440ee20 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -12,6 +12,7 @@
 			'elevation',
 			'grid',
 			'hstack',
+			'heading',
 		];
 		const REDIRECTS = [
 			{

From 524d3cd7be76f2a7f8760d456276189ba0e50836 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 18:13:07 -0600
Subject: [PATCH 12/32] Remove "experimental" designation for `InputControl`

---
 packages/components/src/index.ts                          | 8 +++++++-
 packages/components/src/input-control/README.md           | 6 +-----
 packages/components/src/input-control/index.tsx           | 2 +-
 .../components/src/input-control/input-prefix-wrapper.tsx | 2 +-
 .../components/src/input-control/input-suffix-wrapper.tsx | 2 +-
 .../components/src/input-control/stories/index.story.tsx  | 2 +-
 packages/components/src/input-control/types.ts            | 4 ++--
 storybook/manager-head.html                               | 1 +
 8 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index e5a162a4ae2e2a..99eae2e93d506a 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -162,7 +162,13 @@ export {
 	ItemGroup as __experimentalItemGroup,
 	Item as __experimentalItem,
 } from './item-group';
-export { default as __experimentalInputControl } from './input-control';
+export {
+	/**
+	 * @deprecated Import `InputControl` instead.
+	 */
+	default as __experimentalInputControl,
+	InputControl,
+} from './input-control';
 export { default as __experimentalInputControlPrefixWrapper } from './input-control/input-prefix-wrapper';
 export { default as __experimentalInputControlSuffixWrapper } from './input-control/input-suffix-wrapper';
 export { default as KeyboardShortcuts } from './keyboard-shortcuts';
diff --git a/packages/components/src/input-control/README.md b/packages/components/src/input-control/README.md
index 7af244f823516d..733d37b378917f 100644
--- a/packages/components/src/input-control/README.md
+++ b/packages/components/src/input-control/README.md
@@ -1,15 +1,11 @@
 # InputControl
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 InputControl components let users enter and edit text. This is an experimental component intended to (in time) merge with or replace [TextControl](../text-control).
 
 ## Usage
 
 ```js
-import { __experimentalInputControl as InputControl } from '@wordpress/components';
+import { InputControl } from '@wordpress/components';
 import { useState } from 'react';
 
 const Example = () => {
diff --git a/packages/components/src/input-control/index.tsx b/packages/components/src/input-control/index.tsx
index 1cf9000a467dd7..89d72abf5da68f 100644
--- a/packages/components/src/input-control/index.tsx
+++ b/packages/components/src/input-control/index.tsx
@@ -120,7 +120,7 @@ export function UnforwardedInputControl(
  * intended to (in time) merge with or replace `TextControl`.
  *
  * ```jsx
- * import { __experimentalInputControl as InputControl } from '@wordpress/components';
+ * import { InputControl } from '@wordpress/components';
  * import { useState } from 'react';
  *
  * const Example = () => {
diff --git a/packages/components/src/input-control/input-prefix-wrapper.tsx b/packages/components/src/input-control/input-prefix-wrapper.tsx
index 23d9e823da932d..0c2c39cafe7eaa 100644
--- a/packages/components/src/input-control/input-prefix-wrapper.tsx
+++ b/packages/components/src/input-control/input-prefix-wrapper.tsx
@@ -28,7 +28,7 @@ function UnconnectedInputControlPrefixWrapper(
  *
  * ```jsx
  * import {
- *   __experimentalInputControl as InputControl,
+ *   InputControl,
  *   __experimentalInputControlPrefixWrapper as InputControlPrefixWrapper,
  * } from '@wordpress/components';
  *
diff --git a/packages/components/src/input-control/input-suffix-wrapper.tsx b/packages/components/src/input-control/input-suffix-wrapper.tsx
index 1be352f562e369..fa607258f24779 100644
--- a/packages/components/src/input-control/input-suffix-wrapper.tsx
+++ b/packages/components/src/input-control/input-suffix-wrapper.tsx
@@ -28,7 +28,7 @@ function UnconnectedInputControlSuffixWrapper(
  *
  * ```jsx
  * import {
- *   __experimentalInputControl as InputControl,
+ *   InputControl,
  *   __experimentalInputControlSuffixWrapper as InputControlSuffixWrapper,
  * } from '@wordpress/components';
  *
diff --git a/packages/components/src/input-control/stories/index.story.tsx b/packages/components/src/input-control/stories/index.story.tsx
index 6ad01b94085277..df930ff14024ef 100644
--- a/packages/components/src/input-control/stories/index.story.tsx
+++ b/packages/components/src/input-control/stories/index.story.tsx
@@ -11,7 +11,7 @@ import { InputControlPrefixWrapper } from '../input-prefix-wrapper';
 import { InputControlSuffixWrapper } from '../input-suffix-wrapper';
 
 const meta: Meta< typeof InputControl > = {
-	title: 'Components (Experimental)/InputControl',
+	title: 'Components/InputControl',
 	component: InputControl,
 	// @ts-expect-error - See https://github.com/storybookjs/storybook/issues/23170
 	subcomponents: { InputControlPrefixWrapper, InputControlSuffixWrapper },
diff --git a/packages/components/src/input-control/types.ts b/packages/components/src/input-control/types.ts
index ef01a9fe3db00a..cf8021ef97f504 100644
--- a/packages/components/src/input-control/types.ts
+++ b/packages/components/src/input-control/types.ts
@@ -130,7 +130,7 @@ export interface InputBaseProps extends BaseProps, FlexProps {
 	 *
 	 * @example
 	 * import {
-	 *   __experimentalInputControl as InputControl,
+	 *   InputControl,
 	 *   __experimentalInputControlPrefixWrapper as InputControlPrefixWrapper,
 	 * } from '@wordpress/components';
 	 *
@@ -148,7 +148,7 @@ export interface InputBaseProps extends BaseProps, FlexProps {
 	 *
 	 * @example
 	 * import {
-	 *   __experimentalInputControl as InputControl,
+	 *   InputControl,
 	 *   __experimentalInputControlSuffixWrapper as InputControlSuffixWrapper,
 	 * } from '@wordpress/components';
 	 *
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index cab4692440ee20..46093a5b9d4d54 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -13,6 +13,7 @@
 			'grid',
 			'hstack',
 			'heading',
+			'inputcontrol',
 		];
 		const REDIRECTS = [
 			{

From 25650294254f5ab78de4882b29228614d82f7fac Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 18:18:15 -0600
Subject: [PATCH 13/32] Remove "experimental" designation for `ItemGroup`

---
 packages/components/src/index.ts                          | 4 ++++
 packages/components/src/item-group/item-group/README.md   | 8 ++------
 .../components/src/item-group/item-group/component.tsx    | 2 +-
 packages/components/src/item-group/item/README.md         | 8 ++------
 packages/components/src/item-group/item/component.tsx     | 2 +-
 .../components/src/item-group/stories/index.story.tsx     | 2 +-
 storybook/manager-head.html                               | 1 +
 7 files changed, 12 insertions(+), 15 deletions(-)

diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 99eae2e93d506a..4b95c8fbb076f6 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -159,8 +159,12 @@ export { default as Icon } from './icon';
 export type { IconType } from './icon';
 export { default as IconButton } from './button/deprecated';
 export {
+	/**
+	 * @deprecated Import `ItemGroup` instead.
+	 */
 	ItemGroup as __experimentalItemGroup,
 	Item as __experimentalItem,
+	ItemGroup,
 } from './item-group';
 export {
 	/**
diff --git a/packages/components/src/item-group/item-group/README.md b/packages/components/src/item-group/item-group/README.md
index 773883f3d9e49d..a1daac0a2c85f8 100644
--- a/packages/components/src/item-group/item-group/README.md
+++ b/packages/components/src/item-group/item-group/README.md
@@ -1,9 +1,5 @@
 # `ItemGroup`
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `ItemGroup` displays a list of `Item`s grouped and styled together.
 
 ## Usage
@@ -12,7 +8,7 @@ This feature is still experimental. “Experimental” means this is an early im
 
 ```jsx
 import {
-	__experimentalItemGroup as ItemGroup,
+	ItemGroup,
 	__experimentalItem as Item,
 } from '@wordpress/components';
 
@@ -66,7 +62,7 @@ In the following example, the `<Item />` will render with a size of `small`:
 
 ```jsx
 import {
-	__experimentalItemGroup as ItemGroup,
+	ItemGroup,
 	__experimentalItem as Item,
 } from '@wordpress/components';
 
diff --git a/packages/components/src/item-group/item-group/component.tsx b/packages/components/src/item-group/item-group/component.tsx
index 6bfae11dd4f85f..1d7b34ce5b300e 100644
--- a/packages/components/src/item-group/item-group/component.tsx
+++ b/packages/components/src/item-group/item-group/component.tsx
@@ -46,7 +46,7 @@ function UnconnectedItemGroup(
  *
  * ```jsx
  * import {
- *   __experimentalItemGroup as ItemGroup,
+ *   ItemGroup,
  *   __experimentalItem as Item,
  * } from '@wordpress/components';
  *
diff --git a/packages/components/src/item-group/item/README.md b/packages/components/src/item-group/item/README.md
index 093d9fc192f6d7..cfd298f0ba7181 100644
--- a/packages/components/src/item-group/item/README.md
+++ b/packages/components/src/item-group/item/README.md
@@ -1,9 +1,5 @@
 # `Item`
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `Item` is used in combination with `ItemGroup` to display a list of items grouped and styled together.
 
 ## Usage
@@ -12,7 +8,7 @@ This feature is still experimental. “Experimental” means this is an early im
 
 ```jsx
 import {
-	__experimentalItemGroup as ItemGroup,
+	ItemGroup,
 	__experimentalItem as Item,
 } from '@wordpress/components';
 
@@ -50,7 +46,7 @@ In the following example, the `<Item />` will render with a size of `small`:
 
 ```jsx
 import {
-	__experimentalItemGroup as ItemGroup,
+	ItemGroup,
 	__experimentalItem as Item,
 } from '@wordpress/components';
 
diff --git a/packages/components/src/item-group/item/component.tsx b/packages/components/src/item-group/item/component.tsx
index f3f11617312a7c..5ede51c8e88a78 100644
--- a/packages/components/src/item-group/item/component.tsx
+++ b/packages/components/src/item-group/item/component.tsx
@@ -31,7 +31,7 @@ function UnconnectedItem(
  *
  * ```jsx
  * import {
- *   __experimentalItemGroup as ItemGroup,
+ *   ItemGroup,
  *   __experimentalItem as Item,
  * } from '@wordpress/components';
  *
diff --git a/packages/components/src/item-group/stories/index.story.tsx b/packages/components/src/item-group/stories/index.story.tsx
index 473cdfedbf4f12..ee68d6bd9bb0e1 100644
--- a/packages/components/src/item-group/stories/index.story.tsx
+++ b/packages/components/src/item-group/stories/index.story.tsx
@@ -15,7 +15,7 @@ const meta: Meta< typeof ItemGroup > = {
 	component: ItemGroup,
 	// @ts-expect-error - See https://github.com/storybookjs/storybook/issues/23170
 	subcomponents: { Item },
-	title: 'Components (Experimental)/ItemGroup',
+	title: 'Components/ItemGroup',
 	argTypes: {
 		as: { control: { type: null } },
 		children: { control: { type: null } },
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 46093a5b9d4d54..78192a4bab09bf 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -14,6 +14,7 @@
 			'hstack',
 			'heading',
 			'inputcontrol',
+			'itemgroup',
 		];
 		const REDIRECTS = [
 			{

From 55ec4bd2b726dac1cb9ff9a55b9e91c5ab669a58 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 18:27:42 -0600
Subject: [PATCH 14/32] Remove "experimental" designation for `Navigator`

---
 packages/components/src/index.ts              | 24 +++++++++++++++++++
 .../navigator/navigator-back-button/README.md |  4 ----
 .../navigator-back-button/component.tsx       |  8 +++----
 .../src/navigator/navigator-button/README.md  |  4 ----
 .../navigator/navigator-button/component.tsx  |  8 +++----
 .../navigator/navigator-provider/README.md    | 12 ++++------
 .../navigator-provider/component.tsx          |  8 +++----
 .../src/navigator/navigator-screen/README.md  |  4 ----
 .../navigator/navigator-screen/component.tsx  |  8 +++----
 .../navigator-to-parent-button/README.md      |  4 ----
 .../navigator-to-parent-button/component.tsx  |  8 +++----
 .../src/navigator/stories/index.story.tsx     |  2 +-
 storybook/manager-head.html                   |  1 +
 13 files changed, 50 insertions(+), 45 deletions(-)

diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 4b95c8fbb076f6..792dad38264f65 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -188,12 +188,36 @@ export { default as __experimentalNavigationGroup } from './navigation/group';
 export { default as __experimentalNavigationItem } from './navigation/item';
 export { default as __experimentalNavigationMenu } from './navigation/menu';
 export {
+	/**
+	 * @deprecated Import `NavigatorProvider` instead.
+	 */
 	NavigatorProvider as __experimentalNavigatorProvider,
+	/**
+	 * @deprecated Import `NavigatorScreen` instead.
+	 */
 	NavigatorScreen as __experimentalNavigatorScreen,
+	/**
+	 * @deprecated Import `NavigatorButton` instead.
+	 */
 	NavigatorButton as __experimentalNavigatorButton,
+	/**
+	 * @deprecated Import `NavigatorBackButton` instead.
+	 */
 	NavigatorBackButton as __experimentalNavigatorBackButton,
+	/**
+	 * @deprecated Import `NavigatorToParentButton` instead.
+	 */
 	NavigatorToParentButton as __experimentalNavigatorToParentButton,
+	/**
+	 * @deprecated Import `useNavigator` instead.
+	 */
 	useNavigator as __experimentalUseNavigator,
+	NavigatorProvider,
+	NavigatorScreen,
+	NavigatorButton,
+	NavigatorBackButton,
+	NavigatorToParentButton,
+	useNavigator,
 } from './navigator';
 export { default as Notice } from './notice';
 export { default as __experimentalNumberControl } from './number-control';
diff --git a/packages/components/src/navigator/navigator-back-button/README.md b/packages/components/src/navigator/navigator-back-button/README.md
index 01d4221be536e5..65a1ac1e749aff 100644
--- a/packages/components/src/navigator/navigator-back-button/README.md
+++ b/packages/components/src/navigator/navigator-back-button/README.md
@@ -1,9 +1,5 @@
 # `NavigatorBackButton`
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 The `NavigatorBackButton` component can be used to navigate to a screen and should be used in combination with the [`NavigatorProvider`](/packages/components/src/navigator/navigator-provider/README.md), the [`NavigatorScreen`](/packages/components/src/navigator/navigator-screen/README.md) and the [`NavigatorButton`](/packages/components/src/navigator/navigator-button/README.md) components (or the `useNavigator` hook).
 
 ## Usage
diff --git a/packages/components/src/navigator/navigator-back-button/component.tsx b/packages/components/src/navigator/navigator-back-button/component.tsx
index 71c5ac14cd00d9..b8f2febe59638b 100644
--- a/packages/components/src/navigator/navigator-back-button/component.tsx
+++ b/packages/components/src/navigator/navigator-back-button/component.tsx
@@ -30,10 +30,10 @@ function UnconnectedNavigatorBackButton(
  * @example
  * ```jsx
  * import {
- *   __experimentalNavigatorProvider as NavigatorProvider,
- *   __experimentalNavigatorScreen as NavigatorScreen,
- *   __experimentalNavigatorButton as NavigatorButton,
- *   __experimentalNavigatorBackButton as NavigatorBackButton,
+ *   NavigatorProvider,
+ *   NavigatorScreen,
+ *   NavigatorButton,
+ *   NavigatorBackButton,
  * } from '@wordpress/components';
  *
  * const MyNavigation = () => (
diff --git a/packages/components/src/navigator/navigator-button/README.md b/packages/components/src/navigator/navigator-button/README.md
index 72154ec317da44..695c08a450c157 100644
--- a/packages/components/src/navigator/navigator-button/README.md
+++ b/packages/components/src/navigator/navigator-button/README.md
@@ -1,9 +1,5 @@
 # `NavigatorButton`
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 The `NavigatorButton` component can be used to navigate to a screen and should be used in combination with the [`NavigatorProvider`](/packages/components/src/navigator/navigator-provider/README.md), the [`NavigatorScreen`](/packages/components/src/navigator/navigator-screen/README.md) and the [`NavigatorBackButton`](/packages/components/src/navigator/navigator-back-button/README.md) components (or the `useNavigator` hook).
 
 ## Usage
diff --git a/packages/components/src/navigator/navigator-button/component.tsx b/packages/components/src/navigator/navigator-button/component.tsx
index 1b84a2315c04d3..c87738767c9233 100644
--- a/packages/components/src/navigator/navigator-button/component.tsx
+++ b/packages/components/src/navigator/navigator-button/component.tsx
@@ -29,10 +29,10 @@ function UnconnectedNavigatorButton(
  * @example
  * ```jsx
  * import {
- *   __experimentalNavigatorProvider as NavigatorProvider,
- *   __experimentalNavigatorScreen as NavigatorScreen,
- *   __experimentalNavigatorButton as NavigatorButton,
- *   __experimentalNavigatorBackButton as NavigatorBackButton,
+ *   NavigatorProvider,
+ *   NavigatorScreen,
+ *   NavigatorButton,
+ *   NavigatorBackButton,
  * } from '@wordpress/components';
  *
  * const MyNavigation = () => (
diff --git a/packages/components/src/navigator/navigator-provider/README.md b/packages/components/src/navigator/navigator-provider/README.md
index 8be27a65101843..5e5f3a0caaba3f 100644
--- a/packages/components/src/navigator/navigator-provider/README.md
+++ b/packages/components/src/navigator/navigator-provider/README.md
@@ -1,19 +1,15 @@
 # `NavigatorProvider`
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 The `NavigatorProvider` component allows rendering nested views/panels/menus (via the [`NavigatorScreen` component](/packages/components/src/navigator/navigator-screen/README.md)) and navigate between these different states (via the [`NavigatorButton`](/packages/components/src/navigator/navigator-button/README.md), [`NavigatorToParentButton`](/packages/components/src/navigator/navigator-to-parent-button/README.md) and [`NavigatorBackButton`](/packages/components/src/navigator/navigator-back-button/README.md) components or the `useNavigator` hook). The Global Styles sidebar is an example of this.
 
 ## Usage
 
 ```jsx
 import {
-  __experimentalNavigatorProvider as NavigatorProvider,
-  __experimentalNavigatorScreen as NavigatorScreen,
-  __experimentalNavigatorButton as NavigatorButton,
-  __experimentalNavigatorToParentButton as NavigatorToParentButton,
+  NavigatorProvider,
+  NavigatorScreen,
+  NavigatorButton,
+  NavigatorToParentButton,
 } from '@wordpress/components';
 
 const MyNavigation = () => (
diff --git a/packages/components/src/navigator/navigator-provider/component.tsx b/packages/components/src/navigator/navigator-provider/component.tsx
index 15eb4d6bd3b1d3..5da1d02109bfc4 100644
--- a/packages/components/src/navigator/navigator-provider/component.tsx
+++ b/packages/components/src/navigator/navigator-provider/component.tsx
@@ -274,10 +274,10 @@ function UnconnectedNavigatorProvider(
  *
  * ```jsx
  * import {
- *   __experimentalNavigatorProvider as NavigatorProvider,
- *   __experimentalNavigatorScreen as NavigatorScreen,
- *   __experimentalNavigatorButton as NavigatorButton,
- *   __experimentalNavigatorBackButton as NavigatorBackButton,
+ *   NavigatorProvider,
+ *   NavigatorScreen,
+ *   NavigatorButton,
+ *   NavigatorBackButton,
  * } from '@wordpress/components';
  *
  * const MyNavigation = () => (
diff --git a/packages/components/src/navigator/navigator-screen/README.md b/packages/components/src/navigator/navigator-screen/README.md
index 5ba5af44fe8c1a..93e258a850327e 100644
--- a/packages/components/src/navigator/navigator-screen/README.md
+++ b/packages/components/src/navigator/navigator-screen/README.md
@@ -1,9 +1,5 @@
 # `NavigatorScreen`
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 The `NavigatorScreen` component represents a single view/screen/panel and should be used in combination with the [`NavigatorProvider`](/packages/components/src/navigator/navigator-provider/README.md), the [`NavigatorButton`](/packages/components/src/navigator/navigator-button/README.md) and the [`NavigatorBackButton`](/packages/components/src/navigator/navigator-back-button/README.md) components (or the `useNavigator` hook).
 
 ## Usage
diff --git a/packages/components/src/navigator/navigator-screen/component.tsx b/packages/components/src/navigator/navigator-screen/component.tsx
index be5c4bfaf41ec4..ea7ec18c0f7e37 100644
--- a/packages/components/src/navigator/navigator-screen/component.tsx
+++ b/packages/components/src/navigator/navigator-screen/component.tsx
@@ -147,10 +147,10 @@ function UnconnectedNavigatorScreen(
  * @example
  * ```jsx
  * import {
- *   __experimentalNavigatorProvider as NavigatorProvider,
- *   __experimentalNavigatorScreen as NavigatorScreen,
- *   __experimentalNavigatorButton as NavigatorButton,
- *   __experimentalNavigatorBackButton as NavigatorBackButton,
+ *   NavigatorProvider,
+ *   NavigatorScreen,
+ *   NavigatorButton,
+ *   NavigatorBackButton,
  * } from '@wordpress/components';
  *
  * const MyNavigation = () => (
diff --git a/packages/components/src/navigator/navigator-to-parent-button/README.md b/packages/components/src/navigator/navigator-to-parent-button/README.md
index 62dacc3dfa4ea5..309f9eb0e2c336 100644
--- a/packages/components/src/navigator/navigator-to-parent-button/README.md
+++ b/packages/components/src/navigator/navigator-to-parent-button/README.md
@@ -1,9 +1,5 @@
 # `NavigatorToParentButton`
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 The `NavigatorToParentButton` component can be used to navigate to a screen and should be used in combination with the [`NavigatorProvider`](/packages/components/src/navigator/navigator-provider/README.md), the [`NavigatorScreen`](/packages/components/src/navigator/navigator-screen/README.md) and the [`NavigatorButton`](/packages/components/src/navigator/navigator-button/README.md) components (or the `useNavigator` hook).
 
 ## Usage
diff --git a/packages/components/src/navigator/navigator-to-parent-button/component.tsx b/packages/components/src/navigator/navigator-to-parent-button/component.tsx
index e73a3619f3d494..126c9ee7f45dbd 100644
--- a/packages/components/src/navigator/navigator-to-parent-button/component.tsx
+++ b/packages/components/src/navigator/navigator-to-parent-button/component.tsx
@@ -33,10 +33,10 @@ function UnconnectedNavigatorToParentButton(
  * @example
  * ```jsx
  * import {
- *   __experimentalNavigatorProvider as NavigatorProvider,
- *   __experimentalNavigatorScreen as NavigatorScreen,
- *   __experimentalNavigatorButton as NavigatorButton,
- *   __experimentalNavigatorToParentButton as NavigatorToParentButton,
+ *   NavigatorProvider,
+ *   NavigatorScreen,
+ *   NavigatorButton,
+ *   NavigatorToParentButton,
  * } from '@wordpress/components';
  *
  * const MyNavigation = () => (
diff --git a/packages/components/src/navigator/stories/index.story.tsx b/packages/components/src/navigator/stories/index.story.tsx
index 5adeadcf7ac1d6..6e7096ac833faa 100644
--- a/packages/components/src/navigator/stories/index.story.tsx
+++ b/packages/components/src/navigator/stories/index.story.tsx
@@ -23,7 +23,7 @@ const meta: Meta< typeof NavigatorProvider > = {
 	component: NavigatorProvider,
 	// @ts-expect-error - See https://github.com/storybookjs/storybook/issues/23170
 	subcomponents: { NavigatorScreen, NavigatorButton, NavigatorBackButton },
-	title: 'Components (Experimental)/Navigator',
+	title: 'Components/Navigator',
 	argTypes: {
 		as: { control: { type: null } },
 		children: { control: { type: null } },
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 78192a4bab09bf..582f3462e826d0 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -15,6 +15,7 @@
 			'heading',
 			'inputcontrol',
 			'itemgroup',
+			'navigator',
 		];
 		const REDIRECTS = [
 			{

From eab53da3365b860f307a9b2584e83b05507b3a55 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 18:35:36 -0600
Subject: [PATCH 15/32] Remove "experimental" designation for `NumberControl`

---
 packages/components/src/index.ts                          | 8 +++++++-
 packages/components/src/number-control/README.md          | 6 +-----
 .../components/src/number-control/stories/index.story.tsx | 2 +-
 storybook/manager-head.html                               | 1 +
 4 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 792dad38264f65..9e80fbba17b59a 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -220,7 +220,13 @@ export {
 	useNavigator,
 } from './navigator';
 export { default as Notice } from './notice';
-export { default as __experimentalNumberControl } from './number-control';
+export {
+	/**
+	 * @deprecated Import `NumberControl` instead.
+	 */
+	default as __experimentalNumberControl,
+	NumberControl,
+} from './number-control';
 export { default as NoticeList } from './notice/list';
 export { default as Panel } from './panel';
 export { default as PanelBody } from './panel/body';
diff --git a/packages/components/src/number-control/README.md b/packages/components/src/number-control/README.md
index 3a54351cd29258..7994b4189330fb 100644
--- a/packages/components/src/number-control/README.md
+++ b/packages/components/src/number-control/README.md
@@ -1,15 +1,11 @@
 # NumberControl
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 NumberControl is an enhanced HTML [`input[type="number]`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number) element.
 
 ## Usage
 
 ```jsx
-import { __experimentalNumberControl as NumberControl } from '@wordpress/components';
+import { NumberControl } from '@wordpress/components';
 
 const Example = () => {
 	const [ value, setValue ] = useState( 10 );
diff --git a/packages/components/src/number-control/stories/index.story.tsx b/packages/components/src/number-control/stories/index.story.tsx
index 3588063f0f4bb2..de13ebd16d21fc 100644
--- a/packages/components/src/number-control/stories/index.story.tsx
+++ b/packages/components/src/number-control/stories/index.story.tsx
@@ -14,7 +14,7 @@ import { useState } from '@wordpress/element';
 import NumberControl from '..';
 
 const meta: Meta< typeof NumberControl > = {
-	title: 'Components (Experimental)/NumberControl',
+	title: 'Components/NumberControl',
 	component: NumberControl,
 	argTypes: {
 		onChange: { action: 'onChange' },
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 582f3462e826d0..88acd5b2e0d9be 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -16,6 +16,7 @@
 			'inputcontrol',
 			'itemgroup',
 			'navigator',
+			'numbercontrol',
 		];
 		const REDIRECTS = [
 			{

From 39fc62b1571f44ead62b22df611ba69030083b3d Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 18:39:13 -0600
Subject: [PATCH 16/32] Remove "experimental" designation for `ProgressBar`

---
 packages/components/src/progress-bar/stories/index.story.tsx | 2 +-
 storybook/manager-head.html                                  | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/components/src/progress-bar/stories/index.story.tsx b/packages/components/src/progress-bar/stories/index.story.tsx
index dad1958bf0e66e..0fff97c1e06711 100644
--- a/packages/components/src/progress-bar/stories/index.story.tsx
+++ b/packages/components/src/progress-bar/stories/index.story.tsx
@@ -10,7 +10,7 @@ import { ProgressBar } from '..';
 
 const meta: Meta< typeof ProgressBar > = {
 	component: ProgressBar,
-	title: 'Components (Experimental)/ProgressBar',
+	title: 'Components/ProgressBar',
 	argTypes: {
 		value: { control: { type: 'number', min: 0, max: 100, step: 1 } },
 	},
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 88acd5b2e0d9be..b3e9510931cf67 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -17,6 +17,7 @@
 			'itemgroup',
 			'navigator',
 			'numbercontrol',
+			'progressbar',
 		];
 		const REDIRECTS = [
 			{

From 616110c3acf3ecdfa423d7ef95c1a4bf1cd19157 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 18:41:37 -0600
Subject: [PATCH 17/32] Remove "experimental" designation for `Scrollable`

---
 packages/components/src/index.ts                 | 16 ++++++++++++++--
 packages/components/src/scrollable/README.md     |  6 +-----
 packages/components/src/scrollable/component.tsx |  2 +-
 .../src/scrollable/stories/index.story.tsx       |  2 +-
 storybook/manager-head.html                      |  1 +
 5 files changed, 18 insertions(+), 9 deletions(-)

diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 9e80fbba17b59a..7746b1a32ca8f2 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -246,8 +246,20 @@ export { default as SearchControl } from './search-control';
 export { default as SelectControl } from './select-control';
 export { default as Snackbar } from './snackbar';
 export { default as SnackbarList } from './snackbar/list';
-export { Spacer as __experimentalSpacer } from './spacer';
-export { Scrollable as __experimentalScrollable } from './scrollable';
+export {
+	/**
+	 * @deprecated Import `Spacer` instead.
+	 */
+	Spacer as __experimentalSpacer,
+	Spacer,
+} from './spacer';
+export {
+	/**
+	 * @deprecated Import `Scrollable` instead.
+	 */
+	Scrollable as __experimentalScrollable,
+	Scrollable,
+} from './scrollable';
 export { default as Spinner } from './spinner';
 export { Surface as __experimentalSurface } from './surface';
 export { default as TabPanel } from './tab-panel';
diff --git a/packages/components/src/scrollable/README.md b/packages/components/src/scrollable/README.md
index db93265340228b..2eab47a94c7ded 100644
--- a/packages/components/src/scrollable/README.md
+++ b/packages/components/src/scrollable/README.md
@@ -1,15 +1,11 @@
 # Scrollable
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `Scrollable` is a layout component that content in a scrollable container.
 
 ## Usage
 
 ```jsx
-import { __experimentalScrollable as Scrollable } from '@wordpress/components';
+import { Scrollable } from '@wordpress/components';
 
 function Example() {
 	return (
diff --git a/packages/components/src/scrollable/component.tsx b/packages/components/src/scrollable/component.tsx
index 415ea6d4628e19..cfa5f2a2c624e0 100644
--- a/packages/components/src/scrollable/component.tsx
+++ b/packages/components/src/scrollable/component.tsx
@@ -25,7 +25,7 @@ function UnconnectedScrollable(
  * `Scrollable` is a layout component that content in a scrollable container.
  *
  * ```jsx
- * import { __experimentalScrollable as Scrollable } from `@wordpress/components`;
+ * import { Scrollable } from `@wordpress/components`;
  *
  * function Example() {
  * 	return (
diff --git a/packages/components/src/scrollable/stories/index.story.tsx b/packages/components/src/scrollable/stories/index.story.tsx
index 53d4919de3aabf..3183138b4c5931 100644
--- a/packages/components/src/scrollable/stories/index.story.tsx
+++ b/packages/components/src/scrollable/stories/index.story.tsx
@@ -16,7 +16,7 @@ import { Scrollable } from '..';
 
 const meta: Meta< typeof Scrollable > = {
 	component: Scrollable,
-	title: 'Components (Experimental)/Scrollable',
+	title: 'Components/Scrollable',
 	argTypes: {
 		as: {
 			control: { type: 'text' },
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index b3e9510931cf67..fca5a05e79479e 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -18,6 +18,7 @@
 			'navigator',
 			'numbercontrol',
 			'progressbar',
+			'scrollable',
 		];
 		const REDIRECTS = [
 			{

From eb0799b7e161974f25a006297f15d1392dca9dc6 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 18:44:11 -0600
Subject: [PATCH 18/32] Remove "experimental" designation for `Spacer`

---
 packages/components/src/h-stack/README.md              | 4 ++--
 packages/components/src/spacer/README.md               | 6 +-----
 packages/components/src/spacer/stories/index.story.tsx | 2 +-
 packages/components/src/v-stack/README.md              | 4 ++--
 storybook/manager-head.html                            | 1 +
 5 files changed, 7 insertions(+), 10 deletions(-)

diff --git a/packages/components/src/h-stack/README.md b/packages/components/src/h-stack/README.md
index c1819c5d80bf13..3e52756ecff3e2 100644
--- a/packages/components/src/h-stack/README.md
+++ b/packages/components/src/h-stack/README.md
@@ -82,7 +82,7 @@ When a `Spacer` is used within an `HStack`, the `Spacer` adaptively expands to t
 ```jsx
 import {
 	HStack,
-	__experimentalSpacer as Spacer,
+	Spacer,
 	__experimentalText as Text,
 } from '@wordpress/components';
 
@@ -104,7 +104,7 @@ function Example() {
 ```jsx
 import {
 	HStack,
-	__experimentalSpacer as Spacer,
+	Spacer,
 	__experimentalText as Text,
 } from '@wordpress/components';
 
diff --git a/packages/components/src/spacer/README.md b/packages/components/src/spacer/README.md
index f6ada7438923a0..2f7049fbe2e812 100644
--- a/packages/components/src/spacer/README.md
+++ b/packages/components/src/spacer/README.md
@@ -1,9 +1,5 @@
 # Spacer
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `Spacer` is a primitive layout component that providers inner (`padding`) or outer (`margin`) space in-between components. It can also be used to adaptively provide space within an `HStack` or `VStack`.
 
 ## Usage
@@ -12,7 +8,7 @@ This feature is still experimental. “Experimental” means this is an early im
 
 ```jsx
 import {
-	__experimentalSpacer as Spacer,
+	Spacer,
 	Heading,
 	__experimentalView as View,
 } from '@wordpress/components';
diff --git a/packages/components/src/spacer/stories/index.story.tsx b/packages/components/src/spacer/stories/index.story.tsx
index 586658ac0f01f5..0c69e901b26e9a 100644
--- a/packages/components/src/spacer/stories/index.story.tsx
+++ b/packages/components/src/spacer/stories/index.story.tsx
@@ -31,7 +31,7 @@ const controls = [
 
 const meta: Meta< typeof Spacer > = {
 	component: Spacer,
-	title: 'Components (Experimental)/Spacer',
+	title: 'Components/Spacer',
 	argTypes: {
 		as: { control: { type: 'text' } },
 		children: {
diff --git a/packages/components/src/v-stack/README.md b/packages/components/src/v-stack/README.md
index 2f447b18015e51..2081c1ee8ee2e3 100644
--- a/packages/components/src/v-stack/README.md
+++ b/packages/components/src/v-stack/README.md
@@ -73,7 +73,7 @@ When a `Spacer` is used within an `VStack`, the `Spacer` adaptively expands to t
 
 ```jsx
 import {
-	__experimentalSpacer as Spacer,
+	Spacer,
 	__experimentalText as Text,
 	__experimentalVStack as VStack,
 } from '@wordpress/components';
@@ -95,7 +95,7 @@ function Example() {
 
 ```jsx
 import {
-	__experimentalSpacer as Spacer,
+	Spacer,
 	__experimentalText as Text,
 	__experimentalVStack as VStack,
 } from '@wordpress/components';
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index fca5a05e79479e..53ec7c530e4777 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -19,6 +19,7 @@
 			'numbercontrol',
 			'progressbar',
 			'scrollable',
+			'spacer',
 		];
 		const REDIRECTS = [
 			{

From e4a4ff2eabbb21e156368e8deb786efde13a8db2 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 18:46:02 -0600
Subject: [PATCH 19/32] Remove "experimental" designation for `Surface`

---
 packages/components/src/elevation/README.md             | 2 +-
 packages/components/src/elevation/component.tsx         | 2 +-
 packages/components/src/index.ts                        | 8 +++++++-
 packages/components/src/surface/README.md               | 6 +-----
 packages/components/src/surface/component.tsx           | 2 +-
 packages/components/src/surface/stories/index.story.tsx | 2 +-
 storybook/manager-head.html                             | 1 +
 7 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/packages/components/src/elevation/README.md b/packages/components/src/elevation/README.md
index 30d9cb0666d612..4328fe600a911a 100644
--- a/packages/components/src/elevation/README.md
+++ b/packages/components/src/elevation/README.md
@@ -9,7 +9,7 @@ The shadow effect is generated using the `value` prop.
 ```jsx
 import {
 	Elevation,
-	__experimentalSurface as Surface,
+	Surface,
 	__experimentalText as Text,
 } from '@wordpress/components';
 
diff --git a/packages/components/src/elevation/component.tsx b/packages/components/src/elevation/component.tsx
index c203b236a5cf8c..867735ccc3cba2 100644
--- a/packages/components/src/elevation/component.tsx
+++ b/packages/components/src/elevation/component.tsx
@@ -30,7 +30,7 @@ function UnconnectedElevation(
  * ```jsx
  * import {
  *	Elevation,
- *	__experimentalSurface as Surface,
+ *	Surface,
  *	__experimentalText as Text,
  * } from '@wordpress/components';
  *
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 7746b1a32ca8f2..756d530265b8b2 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -261,7 +261,13 @@ export {
 	Scrollable,
 } from './scrollable';
 export { default as Spinner } from './spinner';
-export { Surface as __experimentalSurface } from './surface';
+export {
+	/**
+	 * @deprecated Import `Surface` instead.
+	 */
+	Surface as __experimentalSurface,
+	Surface,
+} from './surface';
 export { default as TabPanel } from './tab-panel';
 export { Text as __experimentalText } from './text';
 export { default as TextControl } from './text-control';
diff --git a/packages/components/src/surface/README.md b/packages/components/src/surface/README.md
index 6f0d83ecb9cc9f..89a9fcdf9161c9 100644
--- a/packages/components/src/surface/README.md
+++ b/packages/components/src/surface/README.md
@@ -1,9 +1,5 @@
 # Surface
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `Surface` is a core component that renders a primary background color.
 
 ## Usage
@@ -12,7 +8,7 @@ In the example below, notice how the `Surface` renders in white (or dark gray if
 
 ```jsx
 import {
-	__experimentalSurface as Surface,
+	Surface,
 	__experimentalText as Text,
 } from '@wordpress/components';
 
diff --git a/packages/components/src/surface/component.tsx b/packages/components/src/surface/component.tsx
index ba0745a40b5044..d7e20500277c7b 100644
--- a/packages/components/src/surface/component.tsx
+++ b/packages/components/src/surface/component.tsx
@@ -28,7 +28,7 @@ function UnconnectedSurface(
  *
  * ```jsx
  * import {
- *	__experimentalSurface as Surface,
+ *	Surface,
  *	__experimentalText as Text,
  * } from '@wordpress/components';
  *
diff --git a/packages/components/src/surface/stories/index.story.tsx b/packages/components/src/surface/stories/index.story.tsx
index 7f6790d09c848e..424f1c0112e4ea 100644
--- a/packages/components/src/surface/stories/index.story.tsx
+++ b/packages/components/src/surface/stories/index.story.tsx
@@ -11,7 +11,7 @@ import { Text } from '../../text';
 
 const meta: Meta< typeof Surface > = {
 	component: Surface,
-	title: 'Components (Experimental)/Surface',
+	title: 'Components/Surface',
 	argTypes: {
 		children: { control: { type: null } },
 		as: { control: { type: 'text' } },
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 53ec7c530e4777..928bc4a7ceeba9 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -20,6 +20,7 @@
 			'progressbar',
 			'scrollable',
 			'spacer',
+			'surface',
 		];
 		const REDIRECTS = [
 			{

From 1f4f9950782852193f223a4053286929c2484cd3 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 18:55:07 -0600
Subject: [PATCH 20/32] Remove "experimental" designation for `Text`

---
 packages/components/src/card/card/README.md      |  2 +-
 packages/components/src/card/card/component.tsx  |  2 +-
 packages/components/src/divider/README.md        |  2 +-
 packages/components/src/divider/component.tsx    |  2 +-
 packages/components/src/elevation/README.md      |  2 +-
 packages/components/src/elevation/component.tsx  |  2 +-
 packages/components/src/grid/README.md           |  2 +-
 packages/components/src/grid/component.tsx       |  2 +-
 packages/components/src/h-stack/README.md        |  6 +++---
 packages/components/src/h-stack/component.tsx    |  2 +-
 packages/components/src/index.ts                 |  8 +++++++-
 packages/components/src/surface/README.md        |  2 +-
 packages/components/src/surface/component.tsx    |  2 +-
 packages/components/src/text/README.md           | 16 ++++++++--------
 packages/components/src/text/component.tsx       |  2 +-
 .../components/src/text/stories/index.story.tsx  |  2 +-
 packages/components/src/v-stack/README.md        |  6 +++---
 packages/components/src/v-stack/component.tsx    |  2 +-
 packages/components/src/view/README.md           |  2 +-
 storybook/manager-head.html                      |  1 +
 20 files changed, 37 insertions(+), 30 deletions(-)

diff --git a/packages/components/src/card/card/README.md b/packages/components/src/card/card/README.md
index 26cccfdddbf447..1fee3beb7553c7 100644
--- a/packages/components/src/card/card/README.md
+++ b/packages/components/src/card/card/README.md
@@ -12,7 +12,7 @@ import {
 	CardHeader,
 	CardBody,
 	CardFooter,
-	__experimentalText as Text,
+	Text,
 	Heading,
 } from '@wordpress/components';
 
diff --git a/packages/components/src/card/card/component.tsx b/packages/components/src/card/card/component.tsx
index dddcd2371e819e..c696a65db9f51a 100644
--- a/packages/components/src/card/card/component.tsx
+++ b/packages/components/src/card/card/component.tsx
@@ -85,7 +85,7 @@ function UnconnectedCard(
  *   CardHeader,
  *   CardBody,
  *   CardFooter,
- *   __experimentalText as Text,
+ *   Text,
  *   Heading,
  * } from `@wordpress/components`;
  *
diff --git a/packages/components/src/divider/README.md b/packages/components/src/divider/README.md
index 311872b11083a4..2778f215281e81 100644
--- a/packages/components/src/divider/README.md
+++ b/packages/components/src/divider/README.md
@@ -7,7 +7,7 @@
 ```jsx
 import {
 	Divider,
-	__experimentalText as Text,
+	Text,
 	__experimentalVStack as VStack,
 } from `@wordpress/components`;
 
diff --git a/packages/components/src/divider/component.tsx b/packages/components/src/divider/component.tsx
index bd42197ee544d1..797dc2fe25d254 100644
--- a/packages/components/src/divider/component.tsx
+++ b/packages/components/src/divider/component.tsx
@@ -34,7 +34,7 @@ function UnconnectedDivider(
  * ```js
  * import {
  * 		Divider,
- * 		__experimentalText as Text,
+ * 		Text,
  * 		__experimentalVStack as VStack,
  * } from `@wordpress/components`;
  *
diff --git a/packages/components/src/elevation/README.md b/packages/components/src/elevation/README.md
index 4328fe600a911a..9a961085bc30df 100644
--- a/packages/components/src/elevation/README.md
+++ b/packages/components/src/elevation/README.md
@@ -10,7 +10,7 @@ The shadow effect is generated using the `value` prop.
 import {
 	Elevation,
 	Surface,
-	__experimentalText as Text,
+	Text,
 } from '@wordpress/components';
 
 function Example() {
diff --git a/packages/components/src/elevation/component.tsx b/packages/components/src/elevation/component.tsx
index 867735ccc3cba2..90e1f271a0e566 100644
--- a/packages/components/src/elevation/component.tsx
+++ b/packages/components/src/elevation/component.tsx
@@ -31,7 +31,7 @@ function UnconnectedElevation(
  * import {
  *	Elevation,
  *	Surface,
- *	__experimentalText as Text,
+ *	Text,
  * } from '@wordpress/components';
  *
  * function Example() {
diff --git a/packages/components/src/grid/README.md b/packages/components/src/grid/README.md
index 89b162b7618922..ff259594b368f2 100644
--- a/packages/components/src/grid/README.md
+++ b/packages/components/src/grid/README.md
@@ -7,7 +7,7 @@
 ```jsx
 import {
 	Grid,
-	__experimentalText as Text,
+	Text,
 } from '@wordpress/components';
 
 function Example() {
diff --git a/packages/components/src/grid/component.tsx b/packages/components/src/grid/component.tsx
index e86211cb4f898a..6fee1474644eb1 100644
--- a/packages/components/src/grid/component.tsx
+++ b/packages/components/src/grid/component.tsx
@@ -27,7 +27,7 @@ function UnconnectedGrid(
  * ```jsx
  * import {
  * 	Grid,
- * 	__experimentalText as Text
+ * 	Text
  * } from `@wordpress/components`;
  *
  * function Example() {
diff --git a/packages/components/src/h-stack/README.md b/packages/components/src/h-stack/README.md
index 3e52756ecff3e2..b427f0abc150e2 100644
--- a/packages/components/src/h-stack/README.md
+++ b/packages/components/src/h-stack/README.md
@@ -9,7 +9,7 @@
 ```jsx
 import {
 	HStack,
-	__experimentalText as Text,
+	Text,
 } from '@wordpress/components';
 
 function Example() {
@@ -83,7 +83,7 @@ When a `Spacer` is used within an `HStack`, the `Spacer` adaptively expands to t
 import {
 	HStack,
 	Spacer,
-	__experimentalText as Text,
+	Text,
 } from '@wordpress/components';
 
 function Example() {
@@ -105,7 +105,7 @@ function Example() {
 import {
 	HStack,
 	Spacer,
-	__experimentalText as Text,
+	Text,
 } from '@wordpress/components';
 
 function Example() {
diff --git a/packages/components/src/h-stack/component.tsx b/packages/components/src/h-stack/component.tsx
index c2a7cfc51df250..74b2a28a66bceb 100644
--- a/packages/components/src/h-stack/component.tsx
+++ b/packages/components/src/h-stack/component.tsx
@@ -24,7 +24,7 @@ function UnconnectedHStack(
  * ```jsx
  * import {
  * 	HStack,
- * 	__experimentalText as Text,
+ * 	Text,
  * } from `@wordpress/components`;
  *
  * function Example() {
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 756d530265b8b2..fab707be7d36ab 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -269,7 +269,13 @@ export {
 	Surface,
 } from './surface';
 export { default as TabPanel } from './tab-panel';
-export { Text as __experimentalText } from './text';
+export {
+	/**
+	 * @deprecated Import `Text` instead.
+	 */
+	Text as __experimentalText,
+	Text,
+} from './text';
 export { default as TextControl } from './text-control';
 export { default as TextareaControl } from './textarea-control';
 export { default as TextHighlight } from './text-highlight';
diff --git a/packages/components/src/surface/README.md b/packages/components/src/surface/README.md
index 89a9fcdf9161c9..6f4f6e365b0125 100644
--- a/packages/components/src/surface/README.md
+++ b/packages/components/src/surface/README.md
@@ -9,7 +9,7 @@ In the example below, notice how the `Surface` renders in white (or dark gray if
 ```jsx
 import {
 	Surface,
-	__experimentalText as Text,
+	Text,
 } from '@wordpress/components';
 
 function Example() {
diff --git a/packages/components/src/surface/component.tsx b/packages/components/src/surface/component.tsx
index d7e20500277c7b..0390743460c50d 100644
--- a/packages/components/src/surface/component.tsx
+++ b/packages/components/src/surface/component.tsx
@@ -29,7 +29,7 @@ function UnconnectedSurface(
  * ```jsx
  * import {
  *	Surface,
- *	__experimentalText as Text,
+ *	Text,
  * } from '@wordpress/components';
  *
  * function Example() {
diff --git a/packages/components/src/text/README.md b/packages/components/src/text/README.md
index 46bd6a5f10de77..ab492f94716ff8 100644
--- a/packages/components/src/text/README.md
+++ b/packages/components/src/text/README.md
@@ -11,7 +11,7 @@ This feature is still experimental. “Experimental” means this is an early im
 `Text` can be used to render any text-content, like an HTML `p` or `span`.
 
 ```jsx
-import { __experimentalText as Text } from '@wordpress/components';
+import { Text } from '@wordpress/components';
 
 function Example() {
 	return <Text>Code is Poetry</Text>;
@@ -27,7 +27,7 @@ function Example() {
 Automatically calculate the appropriate line-height value for contents that render text and Control elements (e.g. `TextInput`).
 
 ```jsx
-import { __experimentalText as Text, TextInput } from '@wordpress/components';
+import { Text, TextInput } from '@wordpress/components';
 
 function Example() {
 	return (
@@ -46,7 +46,7 @@ function Example() {
 Adjusts the text alignment.
 
 ```jsx
-import { __experimentalText as Text } from '@wordpress/components';
+import { Text } from '@wordpress/components';
 
 function Example() {
 	return (
@@ -111,7 +111,7 @@ Array of search words. String search terms are automatically cast to RegExps unl
 Letters or words within `Text` can be highlighted using `highlightWords`.
 
 ```jsx
-import { __experimentalText as Text } from '@wordpress/components';
+import { Text } from '@wordpress/components';
 
 function Example() {
 	return (
@@ -165,7 +165,7 @@ Clamps the text content to the specifiec `numberOfLines`, adding the `ellipsis`
 The `Text` color can be adapted to a background color for optimal readability. `optimizeReadabilityFor` can accept CSS variables, in addition to standard CSS color values (e.g. Hex, RGB, HSL, etc...).
 
 ```jsx
-import { __experimentalText as Text, View } from '@wordpress/components';
+import { Text, View } from '@wordpress/components';
 
 function Example() {
 	const backgroundColor = 'blue';
@@ -187,7 +187,7 @@ function Example() {
 Adjusts text size based on the typography system. `Text` can render a wide range of font sizes, which are automatically calculated and adapted to the typography system. The `size` value can be a system preset, a `number`, or a custom unit value (`string`) such as `30em`.
 
 ```jsx
-import { __experimentalText as Text } from '@wordpress/components';
+import { Text } from '@wordpress/components';
 
 function Example() {
 	return <Text size="largeTitle">Code is Poetry</Text>;
@@ -203,7 +203,7 @@ Enables text truncation. When `truncate` is set, we are able to truncate the lon
 Note: text truncation won't work if the `isBlock` property is set to `true`
 
 ```jsx
-import { __experimentalText as Text } from '@wordpress/components';
+import { Text } from '@wordpress/components';
 
 function Example() {
 	return (
@@ -231,7 +231,7 @@ Uppercases the text content.
 Adjusts style variation of the text.
 
 ```jsx
-import { __experimentalText as Text } from '@wordpress/components';
+import { Text } from '@wordpress/components';
 
 function Example() {
 	return <Text variant="muted">Code is Poetry</Text>;
diff --git a/packages/components/src/text/component.tsx b/packages/components/src/text/component.tsx
index f3fe69d936584c..01c23f5289ebc7 100644
--- a/packages/components/src/text/component.tsx
+++ b/packages/components/src/text/component.tsx
@@ -29,7 +29,7 @@ function UnconnectedText(
  * @example
  *
  * ```jsx
- * import { __experimentalText as Text } from `@wordpress/components`;
+ * import { Text } from `@wordpress/components`;
  *
  * function Example() {
  * 	return <Text>Code is Poetry</Text>;
diff --git a/packages/components/src/text/stories/index.story.tsx b/packages/components/src/text/stories/index.story.tsx
index f762ca3b4e3ff7..0f9ab0c1878a74 100644
--- a/packages/components/src/text/stories/index.story.tsx
+++ b/packages/components/src/text/stories/index.story.tsx
@@ -10,7 +10,7 @@ import { Text } from '../component';
 
 const meta: Meta< typeof Text > = {
 	component: Text,
-	title: 'Components (Experimental)/Text',
+	title: 'Components/Text',
 	argTypes: {
 		as: { control: { type: 'text' } },
 		color: { control: { type: 'color' } },
diff --git a/packages/components/src/v-stack/README.md b/packages/components/src/v-stack/README.md
index 2081c1ee8ee2e3..16fa3ee334f446 100644
--- a/packages/components/src/v-stack/README.md
+++ b/packages/components/src/v-stack/README.md
@@ -12,7 +12,7 @@ This feature is still experimental. “Experimental” means this is an early im
 
 ```jsx
 import {
-	__experimentalText as Text,
+	Text,
 	__experimentalVStack as VStack,
 } from '@wordpress/components';
 
@@ -74,7 +74,7 @@ When a `Spacer` is used within an `VStack`, the `Spacer` adaptively expands to t
 ```jsx
 import {
 	Spacer,
-	__experimentalText as Text,
+	Text,
 	__experimentalVStack as VStack,
 } from '@wordpress/components';
 
@@ -96,7 +96,7 @@ function Example() {
 ```jsx
 import {
 	Spacer,
-	__experimentalText as Text,
+	Text,
 	__experimentalVStack as VStack,
 } from '@wordpress/components';
 
diff --git a/packages/components/src/v-stack/component.tsx b/packages/components/src/v-stack/component.tsx
index c3ae9fece97dc0..a6d07c73115048 100644
--- a/packages/components/src/v-stack/component.tsx
+++ b/packages/components/src/v-stack/component.tsx
@@ -29,7 +29,7 @@ function UnconnectedVStack(
  *
  * ```jsx
  * import {
- * 	__experimentalText as Text,
+ * 	Text,
  * 	__experimentalVStack as VStack,
  * } from `@wordpress/components`;
  *
diff --git a/packages/components/src/view/README.md b/packages/components/src/view/README.md
index c1e04ebd8cfff4..a4e3850ff6f98d 100644
--- a/packages/components/src/view/README.md
+++ b/packages/components/src/view/README.md
@@ -12,7 +12,7 @@ This feature is still experimental. “Experimental” means this is an early im
 
 ```jsx
 import {
-	__experimentalText as Text,
+	Text,
 	__experimentalView as View,
 } from '@wordpress/components';
 
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 928bc4a7ceeba9..bbbb5789569e65 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -21,6 +21,7 @@
 			'scrollable',
 			'spacer',
 			'surface',
+			'text',
 		];
 		const REDIRECTS = [
 			{

From 36e00b28cf087625a0aa143823cb4b4db97e1fa9 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 19:01:19 -0600
Subject: [PATCH 21/32] Remove "experimental" designation for
 `ToggleGroupControl`

---
 packages/components/src/index.ts                     | 12 ++++++++++++
 .../src/toggle-group-control/stories/index.story.tsx |  2 +-
 .../toggle-group-control-option-base/component.tsx   |  4 ++--
 .../toggle-group-control-option-icon/README.md       |  8 ++------
 .../toggle-group-control-option-icon/component.tsx   |  4 ++--
 .../toggle-group-control-option/README.md            |  8 ++------
 .../toggle-group-control-option/component.tsx        |  4 ++--
 .../toggle-group-control/README.md                   |  8 ++------
 .../toggle-group-control/component.tsx               |  4 ++--
 storybook/manager-head.html                          |  1 +
 10 files changed, 28 insertions(+), 27 deletions(-)

diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index fab707be7d36ab..6845936ae67dc6 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -282,9 +282,21 @@ export { default as TextHighlight } from './text-highlight';
 export { default as Tip } from './tip';
 export { default as ToggleControl } from './toggle-control';
 export {
+	/**
+	 * @deprecated Import `ToggleGroupControl` instead.
+	 */
 	ToggleGroupControl as __experimentalToggleGroupControl,
+	/**
+	 * @deprecated Import `ToggleGroupControlOption` instead.
+	 */
 	ToggleGroupControlOption as __experimentalToggleGroupControlOption,
+	/**
+	 * @deprecated Import `ToggleGroupControlOptionIcon` instead.
+	 */
 	ToggleGroupControlOptionIcon as __experimentalToggleGroupControlOptionIcon,
+	ToggleGroupControl,
+	ToggleGroupControlOption,
+	ToggleGroupControlOptionIcon,
 } from './toggle-group-control';
 export {
 	Toolbar,
diff --git a/packages/components/src/toggle-group-control/stories/index.story.tsx b/packages/components/src/toggle-group-control/stories/index.story.tsx
index 92f1e6076248bd..3bc5abe74230e9 100644
--- a/packages/components/src/toggle-group-control/stories/index.story.tsx
+++ b/packages/components/src/toggle-group-control/stories/index.story.tsx
@@ -27,7 +27,7 @@ const meta: Meta< typeof ToggleGroupControl > = {
 	component: ToggleGroupControl,
 	// @ts-expect-error - See https://github.com/storybookjs/storybook/issues/23170
 	subcomponents: { ToggleGroupControlOption, ToggleGroupControlOptionIcon },
-	title: 'Components (Experimental)/ToggleGroupControl',
+	title: 'Components/ToggleGroupControl',
 	argTypes: {
 		help: { control: { type: 'text' } },
 		onChange: { action: 'onChange' },
diff --git a/packages/components/src/toggle-group-control/toggle-group-control-option-base/component.tsx b/packages/components/src/toggle-group-control/toggle-group-control-option-base/component.tsx
index 421a6078b04956..1e829e7f5e4991 100644
--- a/packages/components/src/toggle-group-control/toggle-group-control-option-base/component.tsx
+++ b/packages/components/src/toggle-group-control/toggle-group-control-option-base/component.tsx
@@ -184,8 +184,8 @@ function ToggleGroupControlOptionBase(
  * @example
  * ```jsx
  * import {
- *   __experimentalToggleGroupControl as ToggleGroupControl,
- *   __experimentalToggleGroupControlOptionBase as ToggleGroupControlOptionBase,
+ *   ToggleGroupControl,
+ *   ToggleGroupControlOptionBase,
  * } from '@wordpress/components';
  *
  * function Example() {
diff --git a/packages/components/src/toggle-group-control/toggle-group-control-option-icon/README.md b/packages/components/src/toggle-group-control/toggle-group-control-option-icon/README.md
index 8b96470e21301e..4df6682ae56208 100644
--- a/packages/components/src/toggle-group-control/toggle-group-control-option-icon/README.md
+++ b/packages/components/src/toggle-group-control/toggle-group-control-option-icon/README.md
@@ -1,17 +1,13 @@
 # `ToggleGroupControlOptionIcon`
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `ToggleGroupControlOptionIcon` is a form component which is meant to be used as a child of [`ToggleGroupControl`](/packages/components/src/toggle-group-control/toggle-group-control/README.md) and displays an icon.
 
 ## Usage
 
 ```js
 import {
-	__experimentalToggleGroupControl as ToggleGroupControl,
-	__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,
+	ToggleGroupControl,
+	ToggleGroupControlOptionIcon,
 } from '@wordpress/components';
 import { formatLowercase, formatUppercase } from '@wordpress/icons';
 
diff --git a/packages/components/src/toggle-group-control/toggle-group-control-option-icon/component.tsx b/packages/components/src/toggle-group-control/toggle-group-control-option-icon/component.tsx
index ec009d82344c39..980bbdbbf8bc76 100644
--- a/packages/components/src/toggle-group-control/toggle-group-control-option-icon/component.tsx
+++ b/packages/components/src/toggle-group-control/toggle-group-control-option-icon/component.tsx
@@ -45,8 +45,8 @@ function UnforwardedToggleGroupControlOptionIcon(
  * ```jsx
  *
  * import {
- *	__experimentalToggleGroupControl as ToggleGroupControl,
- *	__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,
+ *	ToggleGroupControl,
+ *	ToggleGroupControlOptionIcon,
  * from '@wordpress/components';
  * import { formatLowercase, formatUppercase } from '@wordpress/icons';
  *
diff --git a/packages/components/src/toggle-group-control/toggle-group-control-option/README.md b/packages/components/src/toggle-group-control/toggle-group-control-option/README.md
index 7f9f4d32f29fc3..817d6fa1faec14 100644
--- a/packages/components/src/toggle-group-control/toggle-group-control-option/README.md
+++ b/packages/components/src/toggle-group-control/toggle-group-control-option/README.md
@@ -1,9 +1,5 @@
 # `ToggleGroupControlOption`
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `ToggleGroupControlOption` is a form component and is meant to be used as a child of [`ToggleGroupControl`](/packages/components/src/toggle-group-control/toggle-group-control/README.md).
 
 
@@ -11,8 +7,8 @@ This feature is still experimental. “Experimental” means this is an early im
 
 ```js
 import {
-	__experimentalToggleGroupControl as ToggleGroupControl,
-	__experimentalToggleGroupControlOption as ToggleGroupControlOption,
+	ToggleGroupControl,
+	ToggleGroupControlOption,
 } from '@wordpress/components';
 
 function Example() {
diff --git a/packages/components/src/toggle-group-control/toggle-group-control-option/component.tsx b/packages/components/src/toggle-group-control/toggle-group-control-option/component.tsx
index e4b9cff4b80330..105e806182475e 100644
--- a/packages/components/src/toggle-group-control/toggle-group-control-option/component.tsx
+++ b/packages/components/src/toggle-group-control/toggle-group-control-option/component.tsx
@@ -42,8 +42,8 @@ function UnforwardedToggleGroupControlOption(
  *
  * ```jsx
  * import {
- *   __experimentalToggleGroupControl as ToggleGroupControl,
- *   __experimentalToggleGroupControlOption as ToggleGroupControlOption,
+ *   ToggleGroupControl,
+ *   ToggleGroupControlOption,
  * } from '@wordpress/components';
  *
  * function Example() {
diff --git a/packages/components/src/toggle-group-control/toggle-group-control/README.md b/packages/components/src/toggle-group-control/toggle-group-control/README.md
index 64e0489f4171b7..9afa85a40e7f97 100644
--- a/packages/components/src/toggle-group-control/toggle-group-control/README.md
+++ b/packages/components/src/toggle-group-control/toggle-group-control/README.md
@@ -1,9 +1,5 @@
 # `ToggleGroupControl`
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `ToggleGroupControl` is a form component that lets users choose options represented in horizontal segments. To render options for this control use [`ToggleGroupControlOption`](/packages/components/src/toggle-group-control/toggle-group-control-option/README.md) component.
 
 This component is intended for selecting a single persistent value from a set of options, similar to a how a radio button group would work. If you simply want a toggle to switch between views, use a [`TabPanel`](/packages/components/src/tab-panel/README.md) instead.
@@ -14,8 +10,8 @@ Only use this control when you know for sure the labels of items inside won't wr
 
 ```js
 import {
-	__experimentalToggleGroupControl as ToggleGroupControl,
-	__experimentalToggleGroupControlOption as ToggleGroupControlOption,
+	ToggleGroupControl,
+	ToggleGroupControlOption,
 } from '@wordpress/components';
 
 function Example() {
diff --git a/packages/components/src/toggle-group-control/toggle-group-control/component.tsx b/packages/components/src/toggle-group-control/toggle-group-control/component.tsx
index 2fa35e2a5e80a6..18f5f73d8a2a49 100644
--- a/packages/components/src/toggle-group-control/toggle-group-control/component.tsx
+++ b/packages/components/src/toggle-group-control/toggle-group-control/component.tsx
@@ -111,8 +111,8 @@ function UnconnectedToggleGroupControl(
  *
  * ```jsx
  * import {
- *   __experimentalToggleGroupControl as ToggleGroupControl,
- *   __experimentalToggleGroupControlOption as ToggleGroupControlOption,
+ *   ToggleGroupControl,
+ *   ToggleGroupControlOption,
  * } from '@wordpress/components';
  *
  * function Example() {
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index bbbb5789569e65..f52afaebd0f103 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -22,6 +22,7 @@
 			'spacer',
 			'surface',
 			'text',
+			'togglegroupcontrol',
 		];
 		const REDIRECTS = [
 			{

From d2be7dae2795f5f5f4924fd675be0718d57b106c Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 19:05:43 -0600
Subject: [PATCH 22/32] Remove "experimental" designation for `ToolsPanel`

---
 packages/components/src/index.ts                     | 12 ++++++++++++
 .../src/tools-panel/stories/index.story.tsx          |  2 +-
 .../components/src/tools-panel/tools-panel/README.md |  9 ++-------
 .../src/tools-panel/tools-panel/component.tsx        |  4 ++--
 storybook/manager-head.html                          |  1 +
 5 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 6845936ae67dc6..489622da9729d3 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -307,9 +307,21 @@ export {
 	ToolbarItem,
 } from './toolbar';
 export {
+	/**
+	 * @deprecated Import `ToolsPanel` instead.
+	 */
 	ToolsPanel as __experimentalToolsPanel,
+	/**
+	 * @deprecated Import `ToolsPanelItem` instead.
+	 */
 	ToolsPanelItem as __experimentalToolsPanelItem,
+	/**
+	 * @deprecated Import `ToolsPanelContext` instead.
+	 */
 	ToolsPanelContext as __experimentalToolsPanelContext,
+	ToolsPanel,
+	ToolsPanelItem,
+	ToolsPanelContext,
 } from './tools-panel';
 export { default as Tooltip } from './tooltip';
 export {
diff --git a/packages/components/src/tools-panel/stories/index.story.tsx b/packages/components/src/tools-panel/stories/index.story.tsx
index cd6f61c6e921bd..855177a0ea4b67 100644
--- a/packages/components/src/tools-panel/stories/index.story.tsx
+++ b/packages/components/src/tools-panel/stories/index.story.tsx
@@ -26,7 +26,7 @@ import UnitControl from '../../unit-control';
 import { createSlotFill, Provider as SlotFillProvider } from '../../slot-fill';
 
 const meta: Meta< typeof ToolsPanel > = {
-	title: 'Components (Experimental)/ToolsPanel',
+	title: 'Components/ToolsPanel',
 	component: ToolsPanel,
 	// @ts-expect-error - See https://github.com/storybookjs/storybook/issues/23170
 	subcomponents: { ToolsPanelItem },
diff --git a/packages/components/src/tools-panel/tools-panel/README.md b/packages/components/src/tools-panel/tools-panel/README.md
index feec34319c689a..906dd8ba83a8a5 100644
--- a/packages/components/src/tools-panel/tools-panel/README.md
+++ b/packages/components/src/tools-panel/tools-panel/README.md
@@ -1,10 +1,5 @@
 # ToolsPanel
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early
-implementation subject to drastic and breaking changes.
-</div>
-<br />
 These panels provide progressive discovery options for their children. For
 example the controls provided via block supports.
 
@@ -61,8 +56,8 @@ import styled from '@emotion/styled';
  */
 import {
 	BoxControl,
-	__experimentalToolsPanel as ToolsPanel,
-	__experimentalToolsPanelItem as ToolsPanelItem,
+	ToolsPanel,
+	ToolsPanelItem,
 	__experimentalUnitControl as UnitControl,
 } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
diff --git a/packages/components/src/tools-panel/tools-panel/component.tsx b/packages/components/src/tools-panel/tools-panel/component.tsx
index 4e01e39ffffb43..4698f6b2a3ac75 100644
--- a/packages/components/src/tools-panel/tools-panel/component.tsx
+++ b/packages/components/src/tools-panel/tools-panel/component.tsx
@@ -53,8 +53,8 @@ const UnconnectedToolsPanel = (
  * ```jsx
  * import { __ } from '@wordpress/i18n';
  * import {
- *   __experimentalToolsPanel as ToolsPanel,
- *   __experimentalToolsPanelItem as ToolsPanelItem,
+ *   ToolsPanel,
+ *   ToolsPanelItem,
  *   __experimentalUnitControl as UnitControl
  * } from '@wordpress/components';
  *
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index f52afaebd0f103..45451229cc3afd 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -23,6 +23,7 @@
 			'surface',
 			'text',
 			'togglegroupcontrol',
+			'toolspanel',
 		];
 		const REDIRECTS = [
 			{

From cb6fe6e8248a01b4aec9ccddc1541a87d6f51ee3 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 19:11:51 -0600
Subject: [PATCH 23/32] Remove "experimental" designation for `TreeGrid`

---
 packages/components/src/index.ts                 | 16 ++++++++++++++++
 .../src/tree-grid/stories/index.story.tsx        |  2 +-
 storybook/manager-head.html                      |  1 +
 3 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 489622da9729d3..830f613bc26612 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -325,10 +325,26 @@ export {
 } from './tools-panel';
 export { default as Tooltip } from './tooltip';
 export {
+	/**
+	 * @deprecated Import `TreeGrid` instead.
+	 */
 	default as __experimentalTreeGrid,
+	/**
+	 * @deprecated Import `TreeGridRow` instead.
+	 */
 	TreeGridRow as __experimentalTreeGridRow,
+	/**
+	 * @deprecated Import `TreeGridCell` instead.
+	 */
 	TreeGridCell as __experimentalTreeGridCell,
+	/**
+	 * @deprecated Import `TreeGridItem` instead.
+	 */
 	TreeGridItem as __experimentalTreeGridItem,
+	default as TreeGrid,
+	TreeGridRow,
+	TreeGridCell,
+	TreeGridItem,
 } from './tree-grid';
 export { default as TreeSelect } from './tree-select';
 export { Truncate as __experimentalTruncate } from './truncate';
diff --git a/packages/components/src/tree-grid/stories/index.story.tsx b/packages/components/src/tree-grid/stories/index.story.tsx
index 44af154c685b2f..4a693a2ad2f076 100644
--- a/packages/components/src/tree-grid/stories/index.story.tsx
+++ b/packages/components/src/tree-grid/stories/index.story.tsx
@@ -16,7 +16,7 @@ import { Button } from '../../button';
 import InputControl from '../../input-control';
 
 const meta: Meta< typeof TreeGrid > = {
-	title: 'Components (Experimental)/TreeGrid',
+	title: 'Components/TreeGrid',
 	component: TreeGrid,
 	// @ts-expect-error - See https://github.com/storybookjs/storybook/issues/23170
 	subcomponents: { TreeGridRow, TreeGridCell },
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 45451229cc3afd..0634a2a95101bb 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -24,6 +24,7 @@
 			'text',
 			'togglegroupcontrol',
 			'toolspanel',
+			'treegrid',
 		];
 		const REDIRECTS = [
 			{

From 7efa72bee076d026439176e3369f7ed087ba3d6c Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 19:14:12 -0600
Subject: [PATCH 24/32] Remove "experimental" designation for `Truncate`

---
 packages/components/src/index.ts                         | 8 +++++++-
 packages/components/src/truncate/README.md               | 8 ++------
 packages/components/src/truncate/component.tsx           | 2 +-
 packages/components/src/truncate/stories/index.story.tsx | 2 +-
 storybook/manager-head.html                              | 1 +
 5 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 830f613bc26612..e472bbf13c2cf1 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -347,7 +347,13 @@ export {
 	TreeGridItem,
 } from './tree-grid';
 export { default as TreeSelect } from './tree-select';
-export { Truncate as __experimentalTruncate } from './truncate';
+export {
+	/**
+	 * @deprecated Import `Truncate` instead.
+	 */
+	Truncate as __experimentalTruncate,
+	Truncate,
+} from './truncate';
 export {
 	default as __experimentalUnitControl,
 	useCustomUnits as __experimentalUseCustomUnits,
diff --git a/packages/components/src/truncate/README.md b/packages/components/src/truncate/README.md
index 6d5285244078e5..08b80190b7de8c 100644
--- a/packages/components/src/truncate/README.md
+++ b/packages/components/src/truncate/README.md
@@ -1,15 +1,11 @@
 # Truncate
 
-<div class="callout callout-alert">
-This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
-</div>
-
 `Truncate` is a typography primitive that trims text content. For almost all cases, it is recommended that `Text`, `Heading`, or `Subheading` is used to render text content. However, `Truncate` is available for custom implementations.
 
 ## Usage
 
 ```jsx
-import { __experimentalTruncate as Truncate } from '@wordpress/components';
+import { Truncate } from '@wordpress/components';
 
 function Example() {
 	return (
@@ -66,7 +62,7 @@ Clamps the text content to the specified `numberOfLines`, adding an ellipsis at
 -   Default: `0`
 
 ```jsx
-import { __experimentalTruncate as Truncate } from '@wordpress/components';
+import { Truncate } from '@wordpress/components';
 
 function Example() {
 	return (
diff --git a/packages/components/src/truncate/component.tsx b/packages/components/src/truncate/component.tsx
index 4b6c721f92c70c..41752e06afa005 100644
--- a/packages/components/src/truncate/component.tsx
+++ b/packages/components/src/truncate/component.tsx
@@ -28,7 +28,7 @@ function UnconnectedTruncate(
  * available for custom implementations.
  *
  * ```jsx
- * import { __experimentalTruncate as Truncate } from `@wordpress/components`;
+ * import { Truncate } from `@wordpress/components`;
  *
  * function Example() {
  * 	return (
diff --git a/packages/components/src/truncate/stories/index.story.tsx b/packages/components/src/truncate/stories/index.story.tsx
index 84eaf59edbb3e1..306915313af879 100644
--- a/packages/components/src/truncate/stories/index.story.tsx
+++ b/packages/components/src/truncate/stories/index.story.tsx
@@ -10,7 +10,7 @@ import { Truncate } from '..';
 
 const meta: Meta< typeof Truncate > = {
 	component: Truncate,
-	title: 'Components (Experimental)/Truncate',
+	title: 'Components/Truncate',
 	argTypes: {
 		children: { control: { type: 'text' } },
 		as: { control: { type: 'text' } },
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 0634a2a95101bb..725129e48b64d4 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -25,6 +25,7 @@
 			'togglegroupcontrol',
 			'toolspanel',
 			'treegrid',
+			'truncate',
 		];
 		const REDIRECTS = [
 			{

From cc726f7eab20e871d0ec8005d994135dd89802ac Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 19:18:49 -0600
Subject: [PATCH 25/32] Remove "experimental" designation for `UnitControl`

---
 packages/components/src/index.ts                              | 4 ++++
 packages/components/src/tools-panel/tools-panel/README.md     | 2 +-
 packages/components/src/tools-panel/tools-panel/component.tsx | 2 +-
 packages/components/src/unit-control/README.md                | 4 ++--
 packages/components/src/unit-control/index.tsx                | 2 +-
 packages/components/src/unit-control/stories/index.story.tsx  | 2 +-
 storybook/manager-head.html                                   | 2 ++
 7 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index e472bbf13c2cf1..b8bbd93917d77d 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -355,9 +355,13 @@ export {
 	Truncate,
 } from './truncate';
 export {
+	/**
+	 * @deprecated Import `UnitControl` instead.
+	 */
 	default as __experimentalUnitControl,
 	useCustomUnits as __experimentalUseCustomUnits,
 	parseQuantityAndUnitFromRawValue as __experimentalParseQuantityAndUnitFromRawValue,
+	UnitControl,
 } from './unit-control';
 export { View as __experimentalView } from './view';
 export { VisuallyHidden } from './visually-hidden';
diff --git a/packages/components/src/tools-panel/tools-panel/README.md b/packages/components/src/tools-panel/tools-panel/README.md
index 906dd8ba83a8a5..5d2ebdaa111a73 100644
--- a/packages/components/src/tools-panel/tools-panel/README.md
+++ b/packages/components/src/tools-panel/tools-panel/README.md
@@ -58,7 +58,7 @@ import {
 	BoxControl,
 	ToolsPanel,
 	ToolsPanelItem,
-	__experimentalUnitControl as UnitControl,
+	UnitControl,
 } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 
diff --git a/packages/components/src/tools-panel/tools-panel/component.tsx b/packages/components/src/tools-panel/tools-panel/component.tsx
index 4698f6b2a3ac75..ae1165dad819ac 100644
--- a/packages/components/src/tools-panel/tools-panel/component.tsx
+++ b/packages/components/src/tools-panel/tools-panel/component.tsx
@@ -55,7 +55,7 @@ const UnconnectedToolsPanel = (
  * import {
  *   ToolsPanel,
  *   ToolsPanelItem,
- *   __experimentalUnitControl as UnitControl
+ *   UnitControl
  * } from '@wordpress/components';
  *
  * function Example() {
diff --git a/packages/components/src/unit-control/README.md b/packages/components/src/unit-control/README.md
index b3c0496f86b800..296d87a4c13e0a 100644
--- a/packages/components/src/unit-control/README.md
+++ b/packages/components/src/unit-control/README.md
@@ -10,7 +10,7 @@ This feature is still experimental. “Experimental” means this is an early im
 
 ```jsx
 import { useState } from 'react';
-import { __experimentalUnitControl as UnitControl } from '@wordpress/components';
+import { UnitControl } from '@wordpress/components';
 
 const Example = () => {
 	const [ value, setValue ] = useState( '10px' );
@@ -116,7 +116,7 @@ Example:
 
 ```jsx
 import { useState } from 'react';
-import { __experimentalUnitControl as UnitControl } from '@wordpress/components';
+import { UnitControl } from '@wordpress/components';
 
 const Example = () => {
 	const [ value, setValue ] = useState( '10px' );
diff --git a/packages/components/src/unit-control/index.tsx b/packages/components/src/unit-control/index.tsx
index 93ec2c358ecf15..b7b01ff7690df2 100644
--- a/packages/components/src/unit-control/index.tsx
+++ b/packages/components/src/unit-control/index.tsx
@@ -235,7 +235,7 @@ function UnforwardedUnitControl(
  *
  *
  * ```jsx
- * import { __experimentalUnitControl as UnitControl } from '@wordpress/components';
+ * import { UnitControl } from '@wordpress/components';
  * import { useState } from '@wordpress/element';
  *
  * const Example = () => {
diff --git a/packages/components/src/unit-control/stories/index.story.tsx b/packages/components/src/unit-control/stories/index.story.tsx
index 5134d4902144da..7773f385369055 100644
--- a/packages/components/src/unit-control/stories/index.story.tsx
+++ b/packages/components/src/unit-control/stories/index.story.tsx
@@ -16,7 +16,7 @@ import { CSS_UNITS } from '../utils';
 
 const meta: Meta< typeof UnitControl > = {
 	component: UnitControl,
-	title: 'Components (Experimental)/UnitControl',
+	title: 'Components/UnitControl',
 	argTypes: {
 		__unstableInputWidth: { control: { type: 'text' } },
 		__unstableStateReducer: { control: { type: null } },
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 725129e48b64d4..76bb0be19faefc 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -26,6 +26,8 @@
 			'toolspanel',
 			'treegrid',
 			'truncate',
+			'unitcontrol',
+			'tabs',
 		];
 		const REDIRECTS = [
 			{

From a3e8bbccddb8f69f4062a9235de479831a4f35e1 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 19:19:49 -0600
Subject: [PATCH 26/32] Remove "experimental" designation for `Tabs`

---
 packages/components/src/tabs/stories/index.story.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/tabs/stories/index.story.tsx b/packages/components/src/tabs/stories/index.story.tsx
index 883a75c46ad139..885a2752a3a690 100644
--- a/packages/components/src/tabs/stories/index.story.tsx
+++ b/packages/components/src/tabs/stories/index.story.tsx
@@ -18,7 +18,7 @@ import DropdownMenu from '../../dropdown-menu';
 import Button from '../../button';
 
 const meta: Meta< typeof Tabs > = {
-	title: 'Components (Experimental)/Tabs',
+	title: 'Components/Tabs',
 	component: Tabs,
 	subcomponents: {
 		// @ts-expect-error - See https://github.com/storybookjs/storybook/issues/23170

From a4b3725dfeb835f599968af7f210370387ded4c6 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 19:22:58 -0600
Subject: [PATCH 27/32] Remove "experimental" designation for `VStack`

---
 packages/components/src/divider/README.md               | 2 +-
 packages/components/src/divider/component.tsx           | 2 +-
 packages/components/src/index.ts                        | 8 +++++++-
 packages/components/src/v-stack/README.md               | 6 +++---
 packages/components/src/v-stack/component.tsx           | 2 +-
 packages/components/src/v-stack/stories/index.story.tsx | 2 +-
 storybook/manager-head.html                             | 1 +
 7 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/packages/components/src/divider/README.md b/packages/components/src/divider/README.md
index 2778f215281e81..3112cabf7c93f7 100644
--- a/packages/components/src/divider/README.md
+++ b/packages/components/src/divider/README.md
@@ -8,7 +8,7 @@
 import {
 	Divider,
 	Text,
-	__experimentalVStack as VStack,
+	VStack,
 } from `@wordpress/components`;
 
 function Example() {
diff --git a/packages/components/src/divider/component.tsx b/packages/components/src/divider/component.tsx
index 797dc2fe25d254..4e99caa6b1ef16 100644
--- a/packages/components/src/divider/component.tsx
+++ b/packages/components/src/divider/component.tsx
@@ -35,7 +35,7 @@ function UnconnectedDivider(
  * import {
  * 		Divider,
  * 		Text,
- * 		__experimentalVStack as VStack,
+ * 		VStack,
  * } from `@wordpress/components`;
  *
  * function Example() {
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index b8bbd93917d77d..e3d8303d7134dd 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -365,7 +365,13 @@ export {
 } from './unit-control';
 export { View as __experimentalView } from './view';
 export { VisuallyHidden } from './visually-hidden';
-export { VStack as __experimentalVStack } from './v-stack';
+export {
+	/**
+	 * @deprecated Import `VStack` instead.
+	 */
+	VStack as __experimentalVStack,
+	VStack,
+} from './v-stack';
 export { default as IsolatedEventContainer } from './isolated-event-container';
 export {
 	createSlotFill,
diff --git a/packages/components/src/v-stack/README.md b/packages/components/src/v-stack/README.md
index 16fa3ee334f446..79186c4a7db4cf 100644
--- a/packages/components/src/v-stack/README.md
+++ b/packages/components/src/v-stack/README.md
@@ -13,7 +13,7 @@ This feature is still experimental. “Experimental” means this is an early im
 ```jsx
 import {
 	Text,
-	__experimentalVStack as VStack,
+	VStack,
 } from '@wordpress/components';
 
 function Example() {
@@ -75,7 +75,7 @@ When a `Spacer` is used within an `VStack`, the `Spacer` adaptively expands to t
 import {
 	Spacer,
 	Text,
-	__experimentalVStack as VStack,
+	VStack,
 } from '@wordpress/components';
 
 function Example() {
@@ -97,7 +97,7 @@ function Example() {
 import {
 	Spacer,
 	Text,
-	__experimentalVStack as VStack,
+	VStack,
 } from '@wordpress/components';
 
 function Example() {
diff --git a/packages/components/src/v-stack/component.tsx b/packages/components/src/v-stack/component.tsx
index a6d07c73115048..2a526993275a86 100644
--- a/packages/components/src/v-stack/component.tsx
+++ b/packages/components/src/v-stack/component.tsx
@@ -30,7 +30,7 @@ function UnconnectedVStack(
  * ```jsx
  * import {
  * 	Text,
- * 	__experimentalVStack as VStack,
+ * 	VStack,
  * } from `@wordpress/components`;
  *
  * function Example() {
diff --git a/packages/components/src/v-stack/stories/index.story.tsx b/packages/components/src/v-stack/stories/index.story.tsx
index 781c1bce6676cc..64ed680a345c04 100644
--- a/packages/components/src/v-stack/stories/index.story.tsx
+++ b/packages/components/src/v-stack/stories/index.story.tsx
@@ -25,7 +25,7 @@ const ALIGNMENTS = {
 
 const meta: Meta< typeof VStack > = {
 	component: VStack,
-	title: 'Components (Experimental)/VStack',
+	title: 'Components/VStack',
 	argTypes: {
 		alignment: {
 			control: { type: 'select' },
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 76bb0be19faefc..57a3a0b8480115 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -28,6 +28,7 @@
 			'truncate',
 			'unitcontrol',
 			'tabs',
+			'vstack',
 		];
 		const REDIRECTS = [
 			{

From 7752cc7fbfcb61543789d7d26c5214559b9827bb Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 19:27:04 -0600
Subject: [PATCH 28/32] Remove "experimental" designation for `View`

---
 packages/components/src/index.ts                     | 8 +++++++-
 packages/components/src/spacer/README.md             | 2 +-
 packages/components/src/view/README.md               | 2 +-
 packages/components/src/view/stories/index.story.tsx | 2 +-
 storybook/manager-head.html                          | 1 +
 5 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index e3d8303d7134dd..65ef4731347520 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -363,7 +363,13 @@ export {
 	parseQuantityAndUnitFromRawValue as __experimentalParseQuantityAndUnitFromRawValue,
 	UnitControl,
 } from './unit-control';
-export { View as __experimentalView } from './view';
+export {
+	/**
+	 * @deprecated Import `View` instead.
+	 */
+	View as __experimentalView,
+	View,
+} from './view';
 export { VisuallyHidden } from './visually-hidden';
 export {
 	/**
diff --git a/packages/components/src/spacer/README.md b/packages/components/src/spacer/README.md
index 2f7049fbe2e812..c9e46cee6a9bab 100644
--- a/packages/components/src/spacer/README.md
+++ b/packages/components/src/spacer/README.md
@@ -10,7 +10,7 @@
 import {
 	Spacer,
 	Heading,
-	__experimentalView as View,
+	View,
 } from '@wordpress/components';
 
 function Example() {
diff --git a/packages/components/src/view/README.md b/packages/components/src/view/README.md
index a4e3850ff6f98d..7de75cbd1c5a7d 100644
--- a/packages/components/src/view/README.md
+++ b/packages/components/src/view/README.md
@@ -13,7 +13,7 @@ This feature is still experimental. “Experimental” means this is an early im
 ```jsx
 import {
 	Text,
-	__experimentalView as View,
+	View,
 } from '@wordpress/components';
 
 function Example() {
diff --git a/packages/components/src/view/stories/index.story.tsx b/packages/components/src/view/stories/index.story.tsx
index 324825059deb20..233cee15f8ffcb 100644
--- a/packages/components/src/view/stories/index.story.tsx
+++ b/packages/components/src/view/stories/index.story.tsx
@@ -10,7 +10,7 @@ import { View } from '..';
 
 const meta: Meta< typeof View > = {
 	component: View,
-	title: 'Components (Experimental)/View',
+	title: 'Components/View',
 	argTypes: {
 		as: { control: { type: null } },
 		children: { control: { type: 'text' } },
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 57a3a0b8480115..14cb9ddede2415 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -29,6 +29,7 @@
 			'unitcontrol',
 			'tabs',
 			'vstack',
+			'view',
 		];
 		const REDIRECTS = [
 			{

From 671041893506bcc71893b4211fc928cda4470bed Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 19:31:14 -0600
Subject: [PATCH 29/32] Remove "experimental" designation for `ZStack`

---
 packages/components/src/index.ts                        | 8 +++++++-
 packages/components/src/z-stack/README.md               | 2 +-
 packages/components/src/z-stack/component.tsx           | 2 +-
 packages/components/src/z-stack/stories/index.story.tsx | 2 +-
 storybook/manager-head.html                             | 1 +
 5 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 65ef4731347520..00976b7624cc80 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -388,7 +388,13 @@ export {
 	useSlotFills as __experimentalUseSlotFills,
 } from './slot-fill';
 export { default as __experimentalStyleProvider } from './style-provider';
-export { ZStack as __experimentalZStack } from './z-stack';
+export {
+	/**
+	 * @deprecated Import `ZStack` instead.
+	 */
+	ZStack as __experimentalZStack,
+	ZStack,
+} from './z-stack';
 
 // Higher-Order Components.
 export {
diff --git a/packages/components/src/z-stack/README.md b/packages/components/src/z-stack/README.md
index 4de3d93c896812..1480ffaed7aefb 100644
--- a/packages/components/src/z-stack/README.md
+++ b/packages/components/src/z-stack/README.md
@@ -9,7 +9,7 @@ This feature is still experimental. “Experimental” means this is an early im
 `ZStack` allows you to stack things along the Z-axis.
 
 ```jsx
-import { __experimentalZStack as ZStack } from '@wordpress/components';
+import { ZStack } from '@wordpress/components';
 
 function Example() {
 	return (
diff --git a/packages/components/src/z-stack/component.tsx b/packages/components/src/z-stack/component.tsx
index 411ef13c7085e3..03393cd3ccb399 100644
--- a/packages/components/src/z-stack/component.tsx
+++ b/packages/components/src/z-stack/component.tsx
@@ -68,7 +68,7 @@ function UnconnectedZStack(
  * `ZStack` allows you to stack things along the Z-axis.
  *
  * ```jsx
- * import { __experimentalZStack as ZStack } from '@wordpress/components';
+ * import { ZStack } from '@wordpress/components';
  *
  * function Example() {
  *   return (
diff --git a/packages/components/src/z-stack/stories/index.story.tsx b/packages/components/src/z-stack/stories/index.story.tsx
index 46a364bc520f32..b010d3ead04196 100644
--- a/packages/components/src/z-stack/stories/index.story.tsx
+++ b/packages/components/src/z-stack/stories/index.story.tsx
@@ -13,7 +13,7 @@ import { ZStack } from '..';
 
 const meta: Meta< typeof ZStack > = {
 	component: ZStack,
-	title: 'Components (Experimental)/ZStack',
+	title: 'Components/ZStack',
 	argTypes: {
 		as: { control: { type: 'text' } },
 		children: { control: { type: null } },
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 14cb9ddede2415..274d49221efca3 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -30,6 +30,7 @@
 			'tabs',
 			'vstack',
 			'view',
+			'zstack',
 		];
 		const REDIRECTS = [
 			{

From 5e70b15d38f16099ba1c4b4bc65880ad0257c970 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 19:32:26 -0600
Subject: [PATCH 30/32] Remove "experimental" designation for `DropdownMenuV2`

---
 .../components/src/dropdown-menu-v2/stories/index.story.tsx     | 2 +-
 storybook/manager-head.html                                     | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/components/src/dropdown-menu-v2/stories/index.story.tsx b/packages/components/src/dropdown-menu-v2/stories/index.story.tsx
index 11f3c8fb1a6b1b..39b10f6c07ded5 100644
--- a/packages/components/src/dropdown-menu-v2/stories/index.story.tsx
+++ b/packages/components/src/dropdown-menu-v2/stories/index.story.tsx
@@ -32,7 +32,7 @@ import { createSlotFill, Provider as SlotFillProvider } from '../../slot-fill';
 import { ContextSystemProvider } from '../../context';
 
 const meta: Meta< typeof DropdownMenu > = {
-	title: 'Components (Experimental)/DropdownMenu V2',
+	title: 'Components/DropdownMenu V2',
 	component: DropdownMenu,
 	subcomponents: {
 		// @ts-expect-error - See https://github.com/storybookjs/storybook/issues/23170
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 274d49221efca3..9c46fffe792a62 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -31,6 +31,7 @@
 			'vstack',
 			'view',
 			'zstack',
+			'dropdownmenu-v2',
 		];
 		const REDIRECTS = [
 			{

From e88e0f6e6eb525470ebb2afe403c9d12bcfc5699 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 19:33:06 -0600
Subject: [PATCH 31/32] Remove "experimental" designation for `Theme`

---
 packages/components/src/theme/stories/index.story.tsx | 2 +-
 storybook/manager-head.html                           | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/components/src/theme/stories/index.story.tsx b/packages/components/src/theme/stories/index.story.tsx
index c26e0a752c0d45..15570f7ded1daf 100644
--- a/packages/components/src/theme/stories/index.story.tsx
+++ b/packages/components/src/theme/stories/index.story.tsx
@@ -13,7 +13,7 @@ import { HStack } from '../../h-stack';
 
 const meta: Meta< typeof Theme > = {
 	component: Theme,
-	title: 'Components (Experimental)/Theme',
+	title: 'Components/Theme',
 	argTypes: {
 		accent: { control: { type: 'color' } },
 		background: { control: { type: 'color' } },
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 9c46fffe792a62..0603ac2604bdbf 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -32,6 +32,7 @@
 			'view',
 			'zstack',
 			'dropdownmenu-v2',
+			'theme',
 		];
 		const REDIRECTS = [
 			{

From 2172b4c976f4e7030fd3c3052f0df4ecddaaa723 Mon Sep 17 00:00:00 2001
From: Marcelo Serpa <boss@fullofcaffeine.com>
Date: Thu, 18 Apr 2024 19:34:00 -0600
Subject: [PATCH 32/32] Remove "experimental" designation for
 `CustomSelectControlV2`

---
 .../src/custom-select-control-v2/stories/legacy.story.tsx       | 2 +-
 storybook/manager-head.html                                     | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/components/src/custom-select-control-v2/stories/legacy.story.tsx b/packages/components/src/custom-select-control-v2/stories/legacy.story.tsx
index 120686ea84af61..dc1d4ca490d5dc 100644
--- a/packages/components/src/custom-select-control-v2/stories/legacy.story.tsx
+++ b/packages/components/src/custom-select-control-v2/stories/legacy.story.tsx
@@ -15,7 +15,7 @@ import CustomSelectControl from '../legacy-component';
 import * as V1Story from '../../custom-select-control/stories/index.story';
 
 const meta: Meta< typeof CustomSelectControl > = {
-	title: 'Components (Experimental)/CustomSelectControl v2/Legacy',
+	title: 'Components/CustomSelectControl v2/Legacy',
 	component: CustomSelectControl,
 	argTypes: {
 		onChange: { control: { type: null } },
diff --git a/storybook/manager-head.html b/storybook/manager-head.html
index 0603ac2604bdbf..967e4c8008ed05 100644
--- a/storybook/manager-head.html
+++ b/storybook/manager-head.html
@@ -33,6 +33,7 @@
 			'zstack',
 			'dropdownmenu-v2',
 			'theme',
+			'customselectcontrol-v2',
 		];
 		const REDIRECTS = [
 			{