https://gomontag.com/_content/Blazorise/floatingUi.js?v=2.2.2.0

1import { computePosition, autoUpdate, flip, shift, limitShift, hide } from './vendors/floating-ui.js?v=2.2.2.0';
2
3const DIRECTION_DEFAULT = 'Default'
4const DIRECTION_DOWN = 'Down'
5const DIRECTION_UP = 'Up'
6const DIRECTION_END = 'End'
7const DIRECTION_START = 'Start'
8
9export function createFloatingUiAutoUpdate(targetElement, menuElement, options) {
10    //https://floating-ui.com/docs/autoUpdate
11    return autoUpdate(targetElement, menuElement, () => {
12        if (!shouldUseFloatingUi(options, menuElement)) {
13            menuElement.style.left = '';
14            menuElement.style.top = '';
15            menuElement.style.visibility = '';
16
17            return;
18        }
19
20        computePosition(targetElement, menuElement, { //https://floating-ui.com/docs/computePosition#anchoring
21            placement: getPlacementDirection(options.direction, options.endAligned), //https://floating-ui.com/docs/computePosition#placement
22            strategy: options.strategy, //https://floating-ui.com/docs/computePosition#strategy
23            middleware: [flip(), shift({ padding: 0, limiter: limitShift() }), hide()] //https://floating-ui.com/docs/computePosition#middleware
24        }).then(({ x, y, middlewareData }) => {
25            const { referenceHidden, escaped } = middlewareData.hide ?? {};
26            Object.assign(menuElement.style, {
27                left: `${x}px`,
28                top: `${y}px`,
29                visibility: referenceHidden || escaped ? 'hidden' : 'visible'
30            });
31        });
32    });
33}
34
35function shouldUseFloatingUi(options, menuElement) {
36    if (!options?.onlyWhenPositioned)
37        return true;
38
39    const position = getComputedStyle(menuElement).position;
40
41    return position === 'absolute' || position === 'fixed';
42}
43
44function getPlacementDirection(direction, endAligned) {
45    let suffixAlignment = endAligned ? "end" : "start";
46
47    if (direction === DIRECTION_DEFAULT || direction === DIRECTION_DOWN)
48        return 'bottom-' + suffixAlignment;
49    else if (direction === DIRECTION_UP)
50        return 'top-' + suffixAlignment;
51    else if (direction === DIRECTION_END)
52        return 'right-' + suffixAlignment;
53    else if (direction === DIRECTION_START)
54        return 'left-' + suffixAlignment;
55
56    return 'bottom-' + suffixAlignment;
57}