♻️(react) migrate to Storybook 7

This new release comes with breaking changes for stories and mdx docs.

packages/react/src/components/Forms/Field/index.stories.tsx

@@ -1,34 +1,43 @@
-import { ComponentMeta, ComponentStory } from "@storybook/react";
+import { Meta, StoryFn } from "@storybook/react";
 import React from "react";
 import { Field } from ":/components/Forms/Field/index";
 
 export default {
   title: "Components/Forms/Field",
   component: Field,
-} as ComponentMeta<typeof Field>;
+} as Meta<typeof Field>;
 
-const Template: ComponentStory<typeof Field> = (args) => (
+const Template: StoryFn<typeof Field> = (args) => (
   <Field {...args}>
     <strong>Any children</strong>
   </Field>
 );
 
-export const Default = Template.bind({});
-Default.args = {
-  text: "This is an optional text",
-  rightText: "Right text",
+export const Default = {
+  render: Template,
+
+  args: {
+    text: "This is an optional text",
+    rightText: "Right text",
+  },
 };
 
-export const Success = Template.bind({});
-Success.args = {
-  state: "success",
-  text: "This is an optional success message",
-  rightText: "Right text",
+export const Success = {
+  render: Template,
+
+  args: {
+    state: "success",
+    text: "This is an optional success message",
+    rightText: "Right text",
+  },
 };
 
-export const Error = Template.bind({});
-Error.args = {
-  state: "error",
-  text: "This is an optional error message",
-  rightText: "Right text",
+export const Error = {
+  render: Template,
+
+  args: {
+    state: "error",
+    text: "This is an optional error message",
+    rightText: "Right text",
+  },
 };