sideModal hooks not working?

[Andrea-gli]

hi team, the example given here seems not to be working (no modal body is being shown when clicking):
https://paste.twilio.design/components/side-modal#using-state-hooks

Screen.Recording.2024-04-29.at.12.35.15.PM.mov

could you please take a look? thanks!

[dosubot[bot]]

Hey there @Andrea-gli! 😄 Fancy meeting you here again. Hope you're doing well! I'm diving into your sideModal hooks conundrum as we speak and will get back to you with an update shortly. Stay tuned!

[TwilioPasteBot]

Disclaimer: This is a very experimental bot using OpenAI's GPT-4. The answers may not be correct, a human will review the answer and update it if necessary.

---

Sorry, I don't know how to help with that.

I did do a search though, and I managed to find these other Discussions that might be similar or related to your question. Give them a read to see if they answer your question. If they do, head back here and update this discussion and mark it as answered, pointing others to the related discussion:

• Broken link on Modal component docs page (updated: 11/05/2020, similarity score: 87%)
• Tabbing between inputs not working - Answer (updated: 09/29/2020, similarity score: 86%)
• Modal Body doesn't scroll as expected - Answer (updated: 01/19/2023, similarity score: 86%)

[dosubot]

It seems there might be an issue with the example provided for using state hooks with the sideModal component. To address the problem where the modal body is not being displayed upon clicking, I recommend checking a few things:

1. Ensure that the state is correctly set up to control the visibility of the sideModal. The example should demonstrate how to use useState to manage the modal's open state.
2. Verify that the event handler for opening the modal is correctly implemented and attached to the appropriate element or button.
3. Check if there are any console errors that might indicate a problem with the implementation or with conflicting dependencies.
4. Review the versions of the dependencies you're using, especially if they're related to the Twilio Paste design system, to ensure compatibility with the example.

If these steps do not resolve the issue, it might be beneficial to refer to the discussions linked by @TwilioPasteBot, as they contain related issues and solutions that other users have found helpful. Specifically, the discussion on the broken link in the Modal component docs might indicate a broader issue with documentation or examples that could be affecting your implementation.

If after exploring these resources the problem persists, providing a more detailed description of the issue, including any error messages or problematic behavior observed, could help in diagnosing and resolving the issue more effectively.

Details

About Dosu
This response is meant to be useful and save you time. It is not meant to be a precise solution, but rather a starting point for your own research.

Help me be more useful! Please leave a 👍 if this is helpful and 👎 if it is irrelevant.

To continue the conversation, mention @dosu.

[TheSisb]

Hi @Andrea-gli,

Thank you reporting this issue!

This is a small issue and was an oversight. I opened a PR to fix it in the next release of @twilio-paste/core, but to work around this for now, you can add unstable_fixed: true to your state hook. The new version of Paste core will have this line applied automatically when using the state hook.

[TheSisb]

The fix has merged. It will be released in the next version of @twilio-paste/core.