Improve Select and RadioButtons documentation

Author: garronej

stories/RadioButtons.stories.tsx

@@ -9,7 +9,92 @@ const { meta, getStory } = getStoryFactory({
     "wrappedComponent": { RadioButtons },
     "description": `
 - [See DSFR documentation](https://www.systeme-de-design.gouv.fr/elements-d-interface/composants/boutons-radio)
-- [See source code](https://github.com/codegouvfr/react-dsfr/blob/main/src/RadioButtons.tsx)`,
+- [See source code](https://github.com/codegouvfr/react-dsfr/blob/main/src/RadioButtons.tsx)  
+  
+## Controlled
+
+\`\`\`tsx
+import { useState } from "react";
+import { RadioButtons } from "@codegouvfr/react-dsfr/RadioButtons";
+
+function MyComponent(){
+
+    const [ value, setValue ] = useState<"one" | "two" | "three" | undefined>(undefined);
+
+    return (
+        <RadioButtons 
+            label="Label" 
+            options={[
+                {
+                    label: "Label radio",
+                    nativeInputProps: {
+                        checked: value === "one"
+                        onChange: ()=> setValue("one")
+                    }
+                },
+                {
+                    label: "Label radio 2",
+                    nativeInputProps: {
+                        checked: value === "two"
+                        onChange: ()=> setValue("two")
+                    }
+                },
+                {
+                    label: "Label radio 3",
+                    nativeInputProps: {
+                        checked: value === "three"
+                        onChange: ()=> setValue("three")
+                    }
+                }
+            ]}
+        />
+    );
+
+}
+\`\`\`  
+  
+## Uncontrolled  
+
+\`\`\`tsx
+import { useState } from "react";
+import { RadioButtons } from "@codegouvfr/react-dsfr/RadioButtons";
+
+function MyComponent(){
+
+    return (
+        <form>
+            <RadioButtons
+                label="Label"
+                name="my-radio"
+                options={[
+                    {
+                        label: "Label radio",
+                        nativeInputProps: {
+                            value: "one"
+                        }
+                    },
+                    {
+                        label: "Label radio 2",
+                        nativeInputProps: {
+                            value: "two"
+                        }
+                    },
+                    {
+                        label: "Label radio 3",
+                        nativeInputProps: {
+                            value: "three"
+                        }
+                    }
+                ]}
+            />
+        </form>
+    );
+
+}
+\`\`\`
+
+
+`,
     "argTypes": {
         "name": {
             "description":

stories/Select.stories.tsx

@@ -16,7 +16,7 @@ const { meta, getStory } = getStoryFactory({
 
 \`\`\`tsx
 import { useState } from "react";
-import { Select } from "../../dist/Select";
+import { Select } from "@codegouvfr/react-dsfr/Select";
 
 function MyComponent(){
 
@@ -45,25 +45,25 @@ function MyComponent(){
 
 \`\`\`tsx
 import { useState } from "react";
-import { Select } from "../../dist/Select";
+import { Select } from "@codegouvfr/react-dsfr/Select";
 
 function MyComponent(){
 
-    const [ value, setValue ] = useState("");
-
     return (
-        <Select
-            label="Label"
-            nativeSelectProps={{
-                name: "my-select"
-            }}
-        >
-            <option value="" selected disabled hidden>Selectionnez une option</option>
-            <option value="1">Option 1</option>
-            <option value="2">Option 2</option>
-            <option value="3">Option 3</option>
-            <option value="4">Option 4</option>
-        </Select>
+        <form>
+            <Select
+                label="Label"
+                nativeSelectProps={{
+                    name: "my-select"
+                }}
+            >
+                <option value="" selected disabled hidden>Selectionnez une option</option>
+                <option value="1">Option 1</option>
+                <option value="2">Option 2</option>
+                <option value="3">Option 3</option>
+                <option value="4">Option 4</option>
+            </Select>
+        </form>
     );
 
 }