Popper-core: Proper way to add space between popper and reference element?

[c0bra]

I asked on spectrum.chat but didn't get a response after a week.

I've done a bunch of searching through issues and haven't found anything, but maybe I'm missing it? I was hoping there would be a simple modifier property like a margin or something.

It seems like it can be done with an offset modifier function that looks at the placement and adds an offset to the correct side. Is that the only way?

[FezVrasta]

You can just use some CSS margin, it will work.

[c0bra]

@FezVrasta margin would have to be conditionally applied to the correct side otherwise the element will be shifted along all axes equally, making it look offset strangely. This is why I'm asking the question..

Let me rephrase: "What is the proper way to conditionally apply margin to a single side?"

[FezVrasta]

CSS is the way I use in the examples on popper.js.org, the CSS gets conditionally applied reading the x-placement attribute.

I guess you can use offset also:

{
  offset: {
    offset: '0, 10px'
  }
}

https://popper.js.org/popper-documentation.html#modifiers..offset

[c0bra]

Ah, x-placement is what I was looking for. Thanks!

And thanks for all the hard work you've put into this library. I really appreciate it!

[FezVrasta]

You are welcome, sorry for the rough edges, I'm refining the API in the next branch, I hope it will be easier to use then.