build(#10336): separate definitions and generated codes

packages/frontend/src/components/form/link.stories.ts

@@ -5,10 +5,15 @@ const meta = {
 	component: link,
 };
 export const Default = {
-	components: {
-		link,
+	render(args, { argTypes }) {
+		return {
+			components: {
+				link,
+			},
+			props: Object.keys(argTypes),
+			template: '<link v-bind="$props" />',
+		};
 	},
-	template: '<link />',
 	parameters: {
 		layout: 'centered',
 	},

packages/frontend/src/components/form/section.stories.ts

@@ -5,10 +5,15 @@ const meta = {
 	component: section,
 };
 export const Default = {
-	components: {
-		section,
+	render(args, { argTypes }) {
+		return {
+			components: {
+				section,
+			},
+			props: Object.keys(argTypes),
+			template: '<section v-bind="$props" />',
+		};
 	},
-	template: '<section />',
 	parameters: {
 		layout: 'centered',
 	},

packages/frontend/src/components/form/slot.stories.ts

@@ -5,10 +5,15 @@ const meta = {
 	component: slot,
 };
 export const Default = {
-	components: {
-		slot,
+	render(args, { argTypes }) {
+		return {
+			components: {
+				slot,
+			},
+			props: Object.keys(argTypes),
+			template: '<slot v-bind="$props" />',
+		};
 	},
-	template: '<slot />',
 	parameters: {
 		layout: 'centered',
 	},

packages/frontend/src/components/form/split.stories.ts

@@ -5,10 +5,15 @@ const meta = {
 	component: split,
 };
 export const Default = {
-	components: {
-		split,
+	render(args, { argTypes }) {
+		return {
+			components: {
+				split,
+			},
+			props: Object.keys(argTypes),
+			template: '<split v-bind="$props" />',
+		};
 	},
-	template: '<split />',
 	parameters: {
 		layout: 'centered',
 	},

packages/frontend/src/components/form/suspense.stories.ts

@@ -5,10 +5,15 @@ const meta = {
 	component: suspense,
 };
 export const Default = {
-	components: {
-		suspense,
+	render(args, { argTypes }) {
+		return {
+			components: {
+				suspense,
+			},
+			props: Object.keys(argTypes),
+			template: '<suspense v-bind="$props" />',
+		};
 	},
-	template: '<suspense />',
 	parameters: {
 		layout: 'centered',
 	},