|
Object.assign(popover.style, { position: strategy, left: yOnly ? "0" : px(x), right: "auto", top: px(y) }); |
Based on the placement you should set the transform-origin as well so that when a transition is enabled that adjusts the scale or rotate the transition starts from the correct place instead of in the center (default of transform-origin).
Can be done by doing something like this (copied from my own implementation of floating-ui):
Object.assign(popoverElement!.style, {
left: `${x}px`,
top: `${y}px`,
transformOrigin:
{
top: 'bottom',
bottom: 'top',
left: 'right',
right: 'left'
}[placement.split('-')[0]] || 'center'
});
If not desired then give the option to adjust the popover style based on properties like placement so people can do it themselves.
flowbite-svelte/src/lib/utils/Popper.svelte
Line 85 in 3fbf1a1
Based on the
placementyou should set thetransform-originas well so that when a transition is enabled that adjusts thescaleorrotatethe transition starts from the correct place instead of in the center (default oftransform-origin).Can be done by doing something like this (copied from my own implementation of floating-ui):
If not desired then give the option to adjust the popover style based on properties like
placementso people can do it themselves.