From 1d9a594b2164d1ad52bf86be4b1d95eb0e5c9e2c Mon Sep 17 00:00:00 2001
From: Nicolas KOKLA <1872767+nkokla@users.noreply.github.com>
Date: Tue, 28 Mar 2023 18:23:30 +0200
Subject: [PATCH 1/2] Fix `Modal.stories.tsx` code documentation

Signed-off-by: Nicolas KOKLA <1872767+nkokla@users.noreply.github.com>
---
 stories/Modal.stories.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/stories/Modal.stories.tsx b/stories/Modal.stories.tsx
index 8c7c40b62..6a08266be 100644
--- a/stories/Modal.stories.tsx
+++ b/stories/Modal.stories.tsx
@@ -115,10 +115,10 @@ Default.parameters = {
 import { createModal } from "@codegouvfr/react-dsfr/Modal";
 import { Button } from "@codegouvfr/react-dsfr/Button";
 
-const { AcceptTermsModal, acceptTermsModalButtonProps } = createModal(
-    name: "simple",
+const { AcceptTermsModal, acceptTermsModalButtonProps } = createModal({
+    name: "acceptTerms", // The name of Modal component and modalButtonProps is compute from this string
     isOpenedByDefault: false
-);
+});
 
 function MyComponent(){
 

From 9d919445811f8fdd307175cad49d1cb9eba91995 Mon Sep 17 00:00:00 2001
From: Nicolas KOKLA <n.kokla@koaji.fr>
Date: Wed, 29 Mar 2023 10:30:27 +0200
Subject: [PATCH 2/2] Update `Modal.stories.tsx` code documentation

---
 stories/Modal.stories.tsx | 26 +++++++++++++++++++++++++-
 1 file changed, 25 insertions(+), 1 deletion(-)

diff --git a/stories/Modal.stories.tsx b/stories/Modal.stories.tsx
index 6a08266be..727466b5a 100644
--- a/stories/Modal.stories.tsx
+++ b/stories/Modal.stories.tsx
@@ -17,6 +17,30 @@ const { meta, getStory } = getStoryFactory({
 This is a uncontrolled implementation of the modal, compatible with Server Components.  
 An controlled variant is coming soon.  
 
+## The 'createModal' function
+
+The \`createModal(options)\` function take an \`options\` object as parameter.
+
+**Options Params keys:**
+- \`name\` (*STRING - Required*): Prefix of the \`Modal\` component name and \`ModalButtonProps\` object name.
+- \`isOpenedByDefault\` (*BOOLEAN - Required*): Set the opening state of the Modal after it mount.
+
+**Return:**  
+An object with two keys. The name of these keys are computed from the value 
+of \`name\` key of the \`options\` param object :
+- \`\${PascalCasePrefix}Modal\`: The Modal component
+- \`\${camelCasePrefix}ModalButtonProps\`: The props object for \`Button\` DSFR component
+
+**Eg.:**
+\`\`\`
+const { MyComponentModal, myComponentButtonProps } = createModal({
+    name: "myComponent", // The name of Modal component and modalButtonProps is compute from this string
+    isOpenedByDefault: false
+});
+\`\`\`
+
+## The Modal component
+
 `,
     "argTypes": {
         "title": {
@@ -116,7 +140,7 @@ import { createModal } from "@codegouvfr/react-dsfr/Modal";
 import { Button } from "@codegouvfr/react-dsfr/Button";
 
 const { AcceptTermsModal, acceptTermsModalButtonProps } = createModal({
-    name: "acceptTerms", // The name of Modal component and modalButtonProps is compute from this string
+    name: "acceptTerms",
     isOpenedByDefault: false
 });