shepherd-pro/shepherd

Can't use FloutingUI autoPlacement

Opened this issue · 3 comments

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

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

Popper.js Floating UI
Screenshot 2024-05-14 at 12 04 46 Screenshot 2024-05-14 at 12 04 49

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

@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.

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