Feat: Storybook: Improve component organisation - Layout Category - I…

…ssue #66275 (#66659) * Group the storybook components in Layout category * Fix the experimental component id * Revert the unwanted changes in PR --------- Co-authored-by: hbhalodia <[email protected]> Co-authored-by: mirka <[email protected]> Co-authored-by: tyxla <[email protected]>
WordPress · Nov 13, 2024 · 6465b2d · 6465b2d
1 parent ec964d3
commit 6465b2d
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 4 deletions.
diff --git a/packages/components/src/h-stack/stories/index.story.tsx b/packages/components/src/h-stack/stories/index.story.tsx
@@ -42,7 +42,8 @@ const JUSTIFICATIONS = {
 
 const meta: Meta< typeof HStack > = {
 	component: HStack,
-	title: 'Components (Experimental)/HStack',
+	title: 'Components (Experimental)/Layout/HStack',
+	id: 'components-experimental-hstack',
 	argTypes: {
 		as: {
 			control: { type: null },

diff --git a/packages/components/src/responsive-wrapper/stories/index.story.tsx b/packages/components/src/responsive-wrapper/stories/index.story.tsx
@@ -10,7 +10,8 @@ import ResponsiveWrapper from '..';
 
 const meta: Meta< typeof ResponsiveWrapper > = {
 	component: ResponsiveWrapper,
-	title: 'Components/ResponsiveWrapper',
+	title: 'Components/Layout/ResponsiveWrapper',
+	id: 'components-responsivewrapper',
 	argTypes: {
 		children: { control: { type: null } },
 	},

diff --git a/packages/components/src/v-stack/stories/index.story.tsx b/packages/components/src/v-stack/stories/index.story.tsx
@@ -25,7 +25,8 @@ const ALIGNMENTS = {
 
 const meta: Meta< typeof VStack > = {
 	component: VStack,
-	title: 'Components (Experimental)/VStack',
+	title: 'Components (Experimental)/Layout/VStack',
+	id: 'components-experimental-vstack',
 	argTypes: {
 		alignment: {
 			control: { type: 'select' },

diff --git a/storybook/preview.js b/storybook/preview.js
@@ -133,13 +133,14 @@ export const parameters = {
 					'Actions',
 					'Containers',
 					'Feedback',
+					'Layout',
 					'Navigation',
 					'Overlays',
 					'Typography',
 					'Utilities',
 				],
 				'Components (Experimental)',
-				[ 'Navigation', 'Overlays', 'Typography' ],
+				[ 'Layout', 'Navigation', 'Overlays', 'Typography' ],
 				'Icons',
 			],
 		},