Nested components - divs in particular

Hello -

I’m working on leveraging components a bit better, and have a question regarding divs and properties within components.

Business case I’m trying to address:

  • I have created a standard modal layout that I enjoy. I hope to ultimately have one modal layout, and swap the content inside of it (I use Finsweets Filter systems), dependent on what the user is trying to filter
  • I have no issue creating the first component
  • I’m struggling to find a way to make certain content within the modal visible or hidden, depending on where the modal is being viewed

Is it possible to have div content within a modal hidden or visible, based on which modal is being used?

I’m really trying to avoid having two separate modals.

A very loose overview of what I’m trying to achieve

  • Component A - Modal → Content for Filter group A
  • Component A - Modal → Content for Filter group B

Here is my site Read-Only: [MY WEBSITE PREVIEW → ][1]