search

skyra-project / discord-components

Discord Webcomponents for real looking messages on the web
MIT License
242 stars 31 forks source link

request: add modals #228

Open Mateo-tem opened 2 years ago

Mateo-tem commented 2 years ago

Is your feature request related to a problem? Please describe.

Be up to date on Discord Interactions, such as modal interactions.

Describe the solution you'd like

Add support for modals and text input components. Basically, is a pop-up form and I'd like (if possible) to write on text inputs.

modal-example

It contains a Title, a warning, text inputs with a label, a 'Cancel' option and a 'Submit' button.

Describe alternatives you've considered n/a

Additional context n/a

favna commented 2 years ago

I'm honestly not sure if I want to take this into the scope of this project. The thing with modals is that they are not really all that easy to code as UX may make them seem. We'd need to setup a z-index priority, overlay styling, popper styling and more. Even the most simple Modal as described by W3School has a bunch of requirements: https://www.w3schools.com/howto/howto_css_modals.asp

Maybe once DiscordJS, the library we use for our bots, merges in modals and we can start using them we can come back to this because we can pull styles from the element inspector but until that time this is either stalled or open for PRs

Mateo-tem commented 2 years ago

Oh, no problem. It was like an idea because I was thinking about applying that for the modals section on the discord.js guide. I think the animation opening the modal is not necessary, just like showing the opened modal. But that's in your hands and what you can do.

favna commented 2 years ago

It was like an idea because I was thinking about applying that for the modals section on the discord.js guide.

DJS guide uses Sanc's library (https://github.com/Danktuary/discord-message-components/tree/main/packages/vue), not this one.

I think the animation opening the modal is not necessary

Animation can be done with pure CSS using transitions. It's more so that I have no idea what the CSS is and I want to wait for DJS to actually have modals that I can then use for testing and the dev tools to find the proper CSS. That's literally what most of the CSS in this lib is, copied straight from the Discord desktop client

Mateo-tem commented 2 years ago

Ohhh, right. I misread the package.json on discordjs/guide and I thought it said this library, sorry.