Can't use FloutingUI autoPlacement

[sirmspencer]

Shepherd adds flip and shift to default options, then does a deep merge with any other options passed in. Flip and autoPlacement are not compatible so adding autoPlacement to floatingUIOptions.middleware just causes errors.

I tried not passing in a placement so shouldCenter is true, but there are side effects in other parts of the code that block floating UI all together.

You could check for something like :on "auto" to skip adding flip. autoPlacement doesn't need a placement so you can skip options.placement = attachToOptions.on; too.

https://github.com/shepherd-pro/shepherd/blob/master/src/js/utils/floating-ui.js#L169

[patrikholcak]

Same here, version 12.0.1, if I pass on: 'auto' the step is positioned weirdly.

Popper.js	Floating UI

---

Another problem is with passing offset middleware, when clicking between steps, the step jumps to its offset. Not sure if tied to the same problem

Screen.Recording.2024-05-14.at.12.10.52.mp4

[chuckcarpenter]

@patrikholcak 'auto' isn't an option for position, we just use the as noted by FUI

export type PopperPlacement =
  | 'top'
  | 'top-start'
  | 'top-end'
  | 'bottom'
  | 'bottom-start'
  | 'bottom-end'
  | 'right'
  | 'right-start'
  | 'right-end'
  | 'left'
  | 'left-start'
  | 'left-end';

Sounds like what is asked by @sirmspencer is an option to have 'auto' and then use autoPlacement middleware and omit flip.

[patrikholcak]

Right, so should I open another issue for my problem? I can’t upgrade because of this. 😞

[sirmspencer]

@patrikholcak 'auto' isn't an option for position, we just use the as noted by FUI

export type PopperPlacement =
  | 'top'
  | 'top-start'
  | 'top-end'
  | 'bottom'
  | 'bottom-start'
  | 'bottom-end'
  | 'right'
  | 'right-start'
  | 'right-end'
  | 'left'
  | 'left-start'
  | 'left-end';

Sounds like what is asked by @sirmspencer is an option to have 'auto' and then use autoPlacement middleware and omit flip.

I think so. Its been 6 months so id have to look a little deeper again.

[chuckcarpenter]

@patrikholcak @sirmspencer we'd be happy to also take a PR to prioritize this if you're up for it?

[RobbieTheWagner]

It seems like you both had a good handle on what you wanted and where to insert it into the library, so a PR would be great if you have the time!

[RobbieTheWagner]

@sirmspencer @patrikholcak we changed the ordering of the merging for the floatingUIOptions. Could you please see if things work better for you now?

[patrikholcak]

👋 I just opened a PR for auto positions support #3009

[sirmspencer]

I'll take a look, thanks!

[RobbieTheWagner]

Closed by #3009