Fix modal

Author: garronej

package.json

@@ -163,7 +163,6 @@
         "./Footer": "./dist/Footer.js",
         "./Download": "./dist/Download.js",
         "./Display": "./dist/Display.js",
-        "./ConsentBannerNext": "./dist/ConsentBannerNext/index.js",
         "./ConsentBanner": "./dist/ConsentBanner/index.js",
         "./Checkbox": "./dist/Checkbox.js",
         "./Card": "./dist/Card.js",

src/Footer.tsx

@@ -434,10 +434,8 @@ export const Footer = memo(
                                     : [
                                           id<FooterProps.BottomItem>({
                                               "text": t("cookies management"),
-                                              "buttonProps": {
-                                                  onClick: cookiesManagementButtonProps.onClick,
-                                                  ...cookiesManagementButtonProps.nativeButtonProps
-                                              }
+                                              "buttonProps":
+                                                  cookiesManagementButtonProps.nativeButtonProps
                                           })
                                       ]),
                                 ...bottomItems

src/Modal.tsx

@@ -223,11 +223,15 @@ export function createModal<Name extends string>(params: {
     function InternalModal(props: ModalProps) {
         return (
             <>
-                {isOpenedByDefault && (
-                    <Button {...openModalButtonProps} className={fr.cx("fr-hidden")}>
-                        {" "}
-                    </Button>
-                )}
+                <Button
+                    nativeButtonProps={{
+                        ...openModalButtonProps.nativeButtonProps,
+                        "id": hiddenControlButtonId
+                    }}
+                    className={fr.cx("fr-hidden")}
+                >
+                    {" "}
+                </Button>
                 <Modal {...props} id={modalId} />
             </>
         );
@@ -238,6 +242,8 @@ export function createModal<Name extends string>(params: {
     overwriteReadonlyProp(InternalModal as any, "name", InternalModal.displayName);
 
     function openModal() {
+        console.log("wesh!");
+
         const hiddenControlButton = document.getElementById(hiddenControlButtonId);
 
         assert(hiddenControlButton !== null, "Modal isn't mounted");

test/integration/next-appdir/app/page.tsx

@@ -133,7 +133,7 @@ export default function Page() {
                 ]}
             />
             <ClientComponent />
-            <Button {...simpleModalButtonProps}>Open simple modal</Button>
+            <Button {...simpleModalButtonProps}>Open simple modal (control button)</Button>
             <SimpleModal
                 title="simple modal title"
                 buttons={

test/integration/next-appdir/ui/ClientComponent.tsx

@@ -4,6 +4,7 @@ import * as React from 'react';
 import Stack from '@mui/material/Stack';
 import Button from '@mui/material/Button';
 import { useIsDark } from "@codegouvfr/react-dsfr/useIsDark";
+import { createModal } from "@codegouvfr/react-dsfr/Modal";
 
 export function ClientComponent() {
 
@@ -17,6 +18,16 @@ export function ClientComponent() {
         <Button variant="outlined">Outlined</Button>
       </Stack>
       <p>Is dark? {isDark ? "yes" : "no"}</p>
+      <Button onClick={openClientModal}>Open client modal</Button>
+      <ClientModal title="Client modal">
+        <p>Client modal content</p>
+        <button onClick={closeClientModal}>Close</button>
+      </ClientModal>
     </>
   );
-}
+}
+
+const { ClientModal, openClientModal, closeClientModal } = createModal({
+  "isOpenedByDefault": false,
+  "name": "client"
+});