floating-ui.utils.mjs
1 /** 2 * Custom positioning reference element. 3 * @see https://floating-ui.com/docs/virtual-elements 4 */ 5 6 const sides = ['top', 'right', 'bottom', 'left']; 7 const alignments = ['start', 'end']; 8 const placements = /*#__PURE__*/sides.reduce((acc, side) => acc.concat(side, side + "-" + alignments[0], side + "-" + alignments[1]), []); 9 const min = Math.min; 10 const max = Math.max; 11 const round = Math.round; 12 const floor = Math.floor; 13 const createCoords = v => ({ 14 x: v, 15 y: v 16 }); 17 const oppositeSideMap = { 18 left: 'right', 19 right: 'left', 20 bottom: 'top', 21 top: 'bottom' 22 }; 23 const oppositeAlignmentMap = { 24 start: 'end', 25 end: 'start' 26 }; 27 function clamp(start, value, end) { 28 return max(start, min(value, end)); 29 } 30 function evaluate(value, param) { 31 return typeof value === 'function' ? value(param) : value; 32 } 33 function getSide(placement) { 34 return placement.split('-')[0]; 35 } 36 function getAlignment(placement) { 37 return placement.split('-')[1]; 38 } 39 function getOppositeAxis(axis) { 40 return axis === 'x' ? 'y' : 'x'; 41 } 42 function getAxisLength(axis) { 43 return axis === 'y' ? 'height' : 'width'; 44 } 45 function getSideAxis(placement) { 46 return ['top', 'bottom'].includes(getSide(placement)) ? 'y' : 'x'; 47 } 48 function getAlignmentAxis(placement) { 49 return getOppositeAxis(getSideAxis(placement)); 50 } 51 function getAlignmentSides(placement, rects, rtl) { 52 if (rtl === void 0) { 53 rtl = false; 54 } 55 const alignment = getAlignment(placement); 56 const alignmentAxis = getAlignmentAxis(placement); 57 const length = getAxisLength(alignmentAxis); 58 let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top'; 59 if (rects.reference[length] > rects.floating[length]) { 60 mainAlignmentSide = getOppositePlacement(mainAlignmentSide); 61 } 62 return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)]; 63 } 64 function getExpandedPlacements(placement) { 65 const oppositePlacement = getOppositePlacement(placement); 66 return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)]; 67 } 68 function getOppositeAlignmentPlacement(placement) { 69 return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]); 70 } 71 function getSideList(side, isStart, rtl) { 72 const lr = ['left', 'right']; 73 const rl = ['right', 'left']; 74 const tb = ['top', 'bottom']; 75 const bt = ['bottom', 'top']; 76 switch (side) { 77 case 'top': 78 case 'bottom': 79 if (rtl) return isStart ? rl : lr; 80 return isStart ? lr : rl; 81 case 'left': 82 case 'right': 83 return isStart ? tb : bt; 84 default: 85 return []; 86 } 87 } 88 function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) { 89 const alignment = getAlignment(placement); 90 let list = getSideList(getSide(placement), direction === 'start', rtl); 91 if (alignment) { 92 list = list.map(side => side + "-" + alignment); 93 if (flipAlignment) { 94 list = list.concat(list.map(getOppositeAlignmentPlacement)); 95 } 96 } 97 return list; 98 } 99 function getOppositePlacement(placement) { 100 return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]); 101 } 102 function expandPaddingObject(padding) { 103 return { 104 top: 0, 105 right: 0, 106 bottom: 0, 107 left: 0, 108 ...padding 109 }; 110 } 111 function getPaddingObject(padding) { 112 return typeof padding !== 'number' ? expandPaddingObject(padding) : { 113 top: padding, 114 right: padding, 115 bottom: padding, 116 left: padding 117 }; 118 } 119 function rectToClientRect(rect) { 120 const { 121 x, 122 y, 123 width, 124 height 125 } = rect; 126 return { 127 width, 128 height, 129 top: y, 130 left: x, 131 right: x + width, 132 bottom: y + height, 133 x, 134 y 135 }; 136 } 137 138 export { alignments, clamp, createCoords, evaluate, expandPaddingObject, floor, getAlignment, getAlignmentAxis, getAlignmentSides, getAxisLength, getExpandedPlacements, getOppositeAlignmentPlacement, getOppositeAxis, getOppositeAxisPlacements, getOppositePlacement, getPaddingObject, getSide, getSideAxis, max, min, placements, rectToClientRect, round, sides };