diff --git a/stories/Modal.stories.tsx b/stories/Modal.stories.tsx index fbbe2ba2c..701fb0804 100644 --- a/stories/Modal.stories.tsx +++ b/stories/Modal.stories.tsx @@ -60,6 +60,40 @@ useIsModalOpen( } ); \`\`\` + +You can have custom buttons to your modal, here is an example: + +\`\`\`tsx +function MyModalWithCustomButton() { + return ( + props objects with one additional property: doClosesModal + buttons={[ + { + doClosesModal: true, + children: "Cancel", + }, + { + doClosesModal: false, + children: "Ok", + onClick: async () => { + + // Do something async + + modal.close(); + + } + } + ]} + > + My form + + ); +} +\`\`\` + + To create a Dialog component, something that you would use to ask the user a question, like "Do you want to proceed?", you can implement this pattern: - [Component](https://github.com/codegouvfr/react-dsfr/blob/main/test/integration/cra/src/MyDialog.tsx),