UNPKG

6.58 kBJavaScriptView Raw
1import { top, left, right, bottom, start } from "../enums.js";
2import getBasePlacement from "../utils/getBasePlacement.js";
3import getMainAxisFromPlacement from "../utils/getMainAxisFromPlacement.js";
4import getAltAxis from "../utils/getAltAxis.js";
5import { within, withinMaxClamp } from "../utils/within.js";
6import getLayoutRect from "../dom-utils/getLayoutRect.js";
7import getOffsetParent from "../dom-utils/getOffsetParent.js";
8import detectOverflow from "../utils/detectOverflow.js";
9import getVariation from "../utils/getVariation.js";
10import getFreshSideObject from "../utils/getFreshSideObject.js";
11import { min as mathMin, max as mathMax } from "../utils/math.js";
12
13function preventOverflow(_ref) {
14 var state = _ref.state,
15 options = _ref.options,
16 name = _ref.name;
17 var _options$mainAxis = options.mainAxis,
18 checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,
19 _options$altAxis = options.altAxis,
20 checkAltAxis = _options$altAxis === void 0 ? false : _options$altAxis,
21 boundary = options.boundary,
22 rootBoundary = options.rootBoundary,
23 altBoundary = options.altBoundary,
24 padding = options.padding,
25 _options$tether = options.tether,
26 tether = _options$tether === void 0 ? true : _options$tether,
27 _options$tetherOffset = options.tetherOffset,
28 tetherOffset = _options$tetherOffset === void 0 ? 0 : _options$tetherOffset;
29 var overflow = detectOverflow(state, {
30 boundary: boundary,
31 rootBoundary: rootBoundary,
32 padding: padding,
33 altBoundary: altBoundary
34 });
35 var basePlacement = getBasePlacement(state.placement);
36 var variation = getVariation(state.placement);
37 var isBasePlacement = !variation;
38 var mainAxis = getMainAxisFromPlacement(basePlacement);
39 var altAxis = getAltAxis(mainAxis);
40 var popperOffsets = state.modifiersData.popperOffsets;
41 var referenceRect = state.rects.reference;
42 var popperRect = state.rects.popper;
43 var tetherOffsetValue = typeof tetherOffset === 'function' ? tetherOffset(Object.assign({}, state.rects, {
44 placement: state.placement
45 })) : tetherOffset;
46 var normalizedTetherOffsetValue = typeof tetherOffsetValue === 'number' ? {
47 mainAxis: tetherOffsetValue,
48 altAxis: tetherOffsetValue
49 } : Object.assign({
50 mainAxis: 0,
51 altAxis: 0
52 }, tetherOffsetValue);
53 var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;
54 var data = {
55 x: 0,
56 y: 0
57 };
58
59 if (!popperOffsets) {
60 return;
61 }
62
63 if (checkMainAxis) {
64 var _offsetModifierState$;
65
66 var mainSide = mainAxis === 'y' ? top : left;
67 var altSide = mainAxis === 'y' ? bottom : right;
68 var len = mainAxis === 'y' ? 'height' : 'width';
69 var offset = popperOffsets[mainAxis];
70 var min = offset + overflow[mainSide];
71 var max = offset - overflow[altSide];
72 var additive = tether ? -popperRect[len] / 2 : 0;
73 var minLen = variation === start ? referenceRect[len] : popperRect[len];
74 var maxLen = variation === start ? -popperRect[len] : -referenceRect[len]; // We need to include the arrow in the calculation so the arrow doesn't go
75 // outside the reference bounds
76
77 var arrowElement = state.elements.arrow;
78 var arrowRect = tether && arrowElement ? getLayoutRect(arrowElement) : {
79 width: 0,
80 height: 0
81 };
82 var arrowPaddingObject = state.modifiersData['arrow#persistent'] ? state.modifiersData['arrow#persistent'].padding : getFreshSideObject();
83 var arrowPaddingMin = arrowPaddingObject[mainSide];
84 var arrowPaddingMax = arrowPaddingObject[altSide]; // If the reference length is smaller than the arrow length, we don't want
85 // to include its full size in the calculation. If the reference is small
86 // and near the edge of a boundary, the popper can overflow even if the
87 // reference is not overflowing as well (e.g. virtual elements with no
88 // width or height)
89
90 var arrowLen = within(0, referenceRect[len], arrowRect[len]);
91 var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;
92 var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;
93 var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);
94 var clientOffset = arrowOffsetParent ? mainAxis === 'y' ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;
95 var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;
96 var tetherMin = offset + minOffset - offsetModifierValue - clientOffset;
97 var tetherMax = offset + maxOffset - offsetModifierValue;
98 var preventedOffset = within(tether ? mathMin(min, tetherMin) : min, offset, tether ? mathMax(max, tetherMax) : max);
99 popperOffsets[mainAxis] = preventedOffset;
100 data[mainAxis] = preventedOffset - offset;
101 }
102
103 if (checkAltAxis) {
104 var _offsetModifierState$2;
105
106 var _mainSide = mainAxis === 'x' ? top : left;
107
108 var _altSide = mainAxis === 'x' ? bottom : right;
109
110 var _offset = popperOffsets[altAxis];
111
112 var _len = altAxis === 'y' ? 'height' : 'width';
113
114 var _min = _offset + overflow[_mainSide];
115
116 var _max = _offset - overflow[_altSide];
117
118 var isOriginSide = [top, left].indexOf(basePlacement) !== -1;
119
120 var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;
121
122 var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;
123
124 var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;
125
126 var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);
127
128 popperOffsets[altAxis] = _preventedOffset;
129 data[altAxis] = _preventedOffset - _offset;
130 }
131
132 state.modifiersData[name] = data;
133} // eslint-disable-next-line import/no-unused-modules
134
135
136export default {
137 name: 'preventOverflow',
138 enabled: true,
139 phase: 'main',
140 fn: preventOverflow,
141 requiresIfExists: ['offset']
142};
\No newline at end of file