Conditional Prototyping - Not possible to manually position modals?

Hey guys, I’m trying to manually position a modal that should be open under a condition but when the manual option is selected, it does not preview the element in the page. Is this expected or a bug?


I noticed the same.

It seems to be a bug because I can still place overlays if using “Open overlay” without the conditional interaction. Also are missing the interaction lines from the interactive element to the overlay when used inside the conditional interaction.

There seem to be other things bugging as well inside the conditional. Which otherwise is insanely useful feature.

As workaround I left an empty space in my overlay. This works because manual positioning of the overlay defaults so that overlay’s and interactive element’s top left corners align.

So in the image below dropdown is the interactive element and there is transparent part on the overlaying frame that lets the element show through.

1 Like

The offset solution works great for absolute screen positions but unfortunately not for relative ones.

I ended up getting a conditional overlay with manual positioning to work by doing this:

  • Set Interaction to On click.
  • Add Open overlay action. Choose some default state/variant as your overlay.
  • Set position to Manual. You should now be able to manually place the overlay.
  • Add a Conditional.
  • Set conditional to if [boolean] == true.
  • Add Swap overlay for this conditional and choose your second overlay state/variant. This second overlay will inherit the position of the first

If you’re trying to make a SINGLE overlay only show when some condition is met, I imagine you could just make the first default variant a transparent rectangle.

Feels super janky that it works this way but not inside a conditional - it has to be a bug.

Edit: You can only select instances of variants as your overlay so make sure to create instances of your overlay component variants first! I kept forgetting and got super confused why I couldn’t find it in the list!

This topic was automatically closed after 29 days. New replies are no longer allowed.