floating-ui.utils.esm.js 3.9 KB

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