floating-ui.utils.esm.js 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  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. function clamp(start, value, end) {
  23. return max(start, min(value, end));
  24. }
  25. function evaluate(value, param) {
  26. return typeof value === 'function' ? value(param) : value;
  27. }
  28. function getSide(placement) {
  29. return placement.split('-')[0];
  30. }
  31. function getAlignment(placement) {
  32. return placement.split('-')[1];
  33. }
  34. function getOppositeAxis(axis) {
  35. return axis === 'x' ? 'y' : 'x';
  36. }
  37. function getAxisLength(axis) {
  38. return axis === 'y' ? 'height' : 'width';
  39. }
  40. function getSideAxis(placement) {
  41. const firstChar = placement[0];
  42. return firstChar === 't' || firstChar === 'b' ? 'y' : 'x';
  43. }
  44. function getAlignmentAxis(placement) {
  45. return getOppositeAxis(getSideAxis(placement));
  46. }
  47. function getAlignmentSides(placement, rects, rtl) {
  48. if (rtl === void 0) {
  49. rtl = false;
  50. }
  51. const alignment = getAlignment(placement);
  52. const alignmentAxis = getAlignmentAxis(placement);
  53. const length = getAxisLength(alignmentAxis);
  54. let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
  55. if (rects.reference[length] > rects.floating[length]) {
  56. mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
  57. }
  58. return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
  59. }
  60. function getExpandedPlacements(placement) {
  61. const oppositePlacement = getOppositePlacement(placement);
  62. return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
  63. }
  64. function getOppositeAlignmentPlacement(placement) {
  65. return placement.includes('start') ? placement.replace('start', 'end') : placement.replace('end', 'start');
  66. }
  67. const lrPlacement = ['left', 'right'];
  68. const rlPlacement = ['right', 'left'];
  69. const tbPlacement = ['top', 'bottom'];
  70. const btPlacement = ['bottom', 'top'];
  71. function getSideList(side, isStart, rtl) {
  72. switch (side) {
  73. case 'top':
  74. case 'bottom':
  75. if (rtl) return isStart ? rlPlacement : lrPlacement;
  76. return isStart ? lrPlacement : rlPlacement;
  77. case 'left':
  78. case 'right':
  79. return isStart ? tbPlacement : btPlacement;
  80. default:
  81. return [];
  82. }
  83. }
  84. function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
  85. const alignment = getAlignment(placement);
  86. let list = getSideList(getSide(placement), direction === 'start', rtl);
  87. if (alignment) {
  88. list = list.map(side => side + "-" + alignment);
  89. if (flipAlignment) {
  90. list = list.concat(list.map(getOppositeAlignmentPlacement));
  91. }
  92. }
  93. return list;
  94. }
  95. function getOppositePlacement(placement) {
  96. const side = getSide(placement);
  97. return oppositeSideMap[side] + placement.slice(side.length);
  98. }
  99. function expandPaddingObject(padding) {
  100. return {
  101. top: 0,
  102. right: 0,
  103. bottom: 0,
  104. left: 0,
  105. ...padding
  106. };
  107. }
  108. function getPaddingObject(padding) {
  109. return typeof padding !== 'number' ? expandPaddingObject(padding) : {
  110. top: padding,
  111. right: padding,
  112. bottom: padding,
  113. left: padding
  114. };
  115. }
  116. function rectToClientRect(rect) {
  117. const {
  118. x,
  119. y,
  120. width,
  121. height
  122. } = rect;
  123. return {
  124. width,
  125. height,
  126. top: y,
  127. left: x,
  128. right: x + width,
  129. bottom: y + height,
  130. x,
  131. y
  132. };
  133. }
  134. 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 };