withDecline does not work

[rosskhanas]

I follow the docs: https://www.docuseal.co/docs/embedded/form#react

My code:

<DocusealForm
        customCss="#expand_form_button, #submit_form_button { background-color: #7BEEB3; border: none; color: #000000; } #submit_form_button:hover { background-color: #7BEEB333; }"
        email={customer.email}
        minimize
        src={submitter.embedSrc}
        withDecline
        withTitle={false}
        onComplete={async () => {}}
        onDecline={() => {}}
      />

Result - no "Decline" button:

[omohokcoj]

Hi @rosskhanas can you please try withDecline={true} - make sure it's the latest react npm version Let me know if it works

[rosskhanas]

@omohokcoj just tried 1.0.47 and explicitly pass true, it does not work. Here is a piece of HTML:

[omohokcoj]

@rosskhanas are you using react client side render - or maybe some SSR engine? I wonder what happens if you pass withDecline={'true'} ?

[rosskhanas]

@omohokcoj with the string "true" it works:

We use next with server rendering, but this part of the page is a client-only component and is not rendered on a server.

[omohokcoj]

@rosskhanas it must be related to how your next app renders html attributes with react - by default true and false boolean is rendered explicitly as strings (data-with-decline="true"). But it seems like in your app it's not rendered explicitly - might be related to the nextjs version/configs. Using 'true'/'false' prop strings should solve the issue in your nextjs app