1 | import getCompositeRect from "./dom-utils/getCompositeRect.js";
|
2 | import getLayoutRect from "./dom-utils/getLayoutRect.js";
|
3 | import listScrollParents from "./dom-utils/listScrollParents.js";
|
4 | import getOffsetParent from "./dom-utils/getOffsetParent.js";
|
5 | import getComputedStyle from "./dom-utils/getComputedStyle.js";
|
6 | import orderModifiers from "./utils/orderModifiers.js";
|
7 | import debounce from "./utils/debounce.js";
|
8 | import validateModifiers from "./utils/validateModifiers.js";
|
9 | import uniqueBy from "./utils/uniqueBy.js";
|
10 | import getBasePlacement from "./utils/getBasePlacement.js";
|
11 | import mergeByName from "./utils/mergeByName.js";
|
12 | import detectOverflow from "./utils/detectOverflow.js";
|
13 | import { isElement } from "./dom-utils/instanceOf.js";
|
14 | import { auto } from "./enums.js";
|
15 | var INVALID_ELEMENT_ERROR = 'Popper: Invalid reference or popper argument provided. They must be either a DOM element or virtual element.';
|
16 | var INFINITE_LOOP_ERROR = 'Popper: An infinite loop in the modifiers cycle has been detected! The cycle has been interrupted to prevent a browser crash.';
|
17 | var DEFAULT_OPTIONS = {
|
18 | placement: 'bottom',
|
19 | modifiers: [],
|
20 | strategy: 'absolute'
|
21 | };
|
22 |
|
23 | function areValidElements() {
|
24 | for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
25 | args[_key] = arguments[_key];
|
26 | }
|
27 |
|
28 | return !args.some(function (element) {
|
29 | return !(element && typeof element.getBoundingClientRect === 'function');
|
30 | });
|
31 | }
|
32 |
|
33 | export function popperGenerator(generatorOptions) {
|
34 | if (generatorOptions === void 0) {
|
35 | generatorOptions = {};
|
36 | }
|
37 |
|
38 | var _generatorOptions = generatorOptions,
|
39 | _generatorOptions$def = _generatorOptions.defaultModifiers,
|
40 | defaultModifiers = _generatorOptions$def === void 0 ? [] : _generatorOptions$def,
|
41 | _generatorOptions$def2 = _generatorOptions.defaultOptions,
|
42 | defaultOptions = _generatorOptions$def2 === void 0 ? DEFAULT_OPTIONS : _generatorOptions$def2;
|
43 | return function createPopper(reference, popper, options) {
|
44 | if (options === void 0) {
|
45 | options = defaultOptions;
|
46 | }
|
47 |
|
48 | var state = {
|
49 | placement: 'bottom',
|
50 | orderedModifiers: [],
|
51 | options: Object.assign({}, DEFAULT_OPTIONS, defaultOptions),
|
52 | modifiersData: {},
|
53 | elements: {
|
54 | reference: reference,
|
55 | popper: popper
|
56 | },
|
57 | attributes: {},
|
58 | styles: {}
|
59 | };
|
60 | var effectCleanupFns = [];
|
61 | var isDestroyed = false;
|
62 | var instance = {
|
63 | state: state,
|
64 | setOptions: function setOptions(setOptionsAction) {
|
65 | var options = typeof setOptionsAction === 'function' ? setOptionsAction(state.options) : setOptionsAction;
|
66 | cleanupModifierEffects();
|
67 | state.options = Object.assign({}, defaultOptions, state.options, options);
|
68 | state.scrollParents = {
|
69 | reference: isElement(reference) ? listScrollParents(reference) : reference.contextElement ? listScrollParents(reference.contextElement) : [],
|
70 | popper: listScrollParents(popper)
|
71 | };
|
72 |
|
73 |
|
74 | var orderedModifiers = orderModifiers(mergeByName([].concat(defaultModifiers, state.options.modifiers)));
|
75 |
|
76 | state.orderedModifiers = orderedModifiers.filter(function (m) {
|
77 | return m.enabled;
|
78 | });
|
79 |
|
80 |
|
81 | if (process.env.NODE_ENV !== "production") {
|
82 | var modifiers = uniqueBy([].concat(orderedModifiers, state.options.modifiers), function (_ref) {
|
83 | var name = _ref.name;
|
84 | return name;
|
85 | });
|
86 | validateModifiers(modifiers);
|
87 |
|
88 | if (getBasePlacement(state.options.placement) === auto) {
|
89 | var flipModifier = state.orderedModifiers.find(function (_ref2) {
|
90 | var name = _ref2.name;
|
91 | return name === 'flip';
|
92 | });
|
93 |
|
94 | if (!flipModifier) {
|
95 | console.error(['Popper: "auto" placements require the "flip" modifier be', 'present and enabled to work.'].join(' '));
|
96 | }
|
97 | }
|
98 |
|
99 | var _getComputedStyle = getComputedStyle(popper),
|
100 | marginTop = _getComputedStyle.marginTop,
|
101 | marginRight = _getComputedStyle.marginRight,
|
102 | marginBottom = _getComputedStyle.marginBottom,
|
103 | marginLeft = _getComputedStyle.marginLeft;
|
104 |
|
105 |
|
106 |
|
107 | if ([marginTop, marginRight, marginBottom, marginLeft].some(function (margin) {
|
108 | return parseFloat(margin);
|
109 | })) {
|
110 | console.warn(['Popper: CSS "margin" styles cannot be used to apply padding', 'between the popper and its reference element or boundary.', 'To replicate margin, use the `offset` modifier, as well as', 'the `padding` option in the `preventOverflow` and `flip`', 'modifiers.'].join(' '));
|
111 | }
|
112 | }
|
113 |
|
114 | runModifierEffects();
|
115 | return instance.update();
|
116 | },
|
117 |
|
118 |
|
119 |
|
120 |
|
121 |
|
122 | forceUpdate: function forceUpdate() {
|
123 | if (isDestroyed) {
|
124 | return;
|
125 | }
|
126 |
|
127 | var _state$elements = state.elements,
|
128 | reference = _state$elements.reference,
|
129 | popper = _state$elements.popper;
|
130 |
|
131 |
|
132 | if (!areValidElements(reference, popper)) {
|
133 | if (process.env.NODE_ENV !== "production") {
|
134 | console.error(INVALID_ELEMENT_ERROR);
|
135 | }
|
136 |
|
137 | return;
|
138 | }
|
139 |
|
140 |
|
141 | state.rects = {
|
142 | reference: getCompositeRect(reference, getOffsetParent(popper), state.options.strategy === 'fixed'),
|
143 | popper: getLayoutRect(popper)
|
144 | };
|
145 |
|
146 |
|
147 |
|
148 |
|
149 |
|
150 | state.reset = false;
|
151 | state.placement = state.options.placement;
|
152 |
|
153 |
|
154 |
|
155 |
|
156 | state.orderedModifiers.forEach(function (modifier) {
|
157 | return state.modifiersData[modifier.name] = Object.assign({}, modifier.data);
|
158 | });
|
159 | var __debug_loops__ = 0;
|
160 |
|
161 | for (var index = 0; index < state.orderedModifiers.length; index++) {
|
162 | if (process.env.NODE_ENV !== "production") {
|
163 | __debug_loops__ += 1;
|
164 |
|
165 | if (__debug_loops__ > 100) {
|
166 | console.error(INFINITE_LOOP_ERROR);
|
167 | break;
|
168 | }
|
169 | }
|
170 |
|
171 | if (state.reset === true) {
|
172 | state.reset = false;
|
173 | index = -1;
|
174 | continue;
|
175 | }
|
176 |
|
177 | var _state$orderedModifie = state.orderedModifiers[index],
|
178 | fn = _state$orderedModifie.fn,
|
179 | _state$orderedModifie2 = _state$orderedModifie.options,
|
180 | _options = _state$orderedModifie2 === void 0 ? {} : _state$orderedModifie2,
|
181 | name = _state$orderedModifie.name;
|
182 |
|
183 | if (typeof fn === 'function') {
|
184 | state = fn({
|
185 | state: state,
|
186 | options: _options,
|
187 | name: name,
|
188 | instance: instance
|
189 | }) || state;
|
190 | }
|
191 | }
|
192 | },
|
193 |
|
194 |
|
195 | update: debounce(function () {
|
196 | return new Promise(function (resolve) {
|
197 | instance.forceUpdate();
|
198 | resolve(state);
|
199 | });
|
200 | }),
|
201 | destroy: function destroy() {
|
202 | cleanupModifierEffects();
|
203 | isDestroyed = true;
|
204 | }
|
205 | };
|
206 |
|
207 | if (!areValidElements(reference, popper)) {
|
208 | if (process.env.NODE_ENV !== "production") {
|
209 | console.error(INVALID_ELEMENT_ERROR);
|
210 | }
|
211 |
|
212 | return instance;
|
213 | }
|
214 |
|
215 | instance.setOptions(options).then(function (state) {
|
216 | if (!isDestroyed && options.onFirstUpdate) {
|
217 | options.onFirstUpdate(state);
|
218 | }
|
219 | });
|
220 |
|
221 |
|
222 |
|
223 |
|
224 |
|
225 | function runModifierEffects() {
|
226 | state.orderedModifiers.forEach(function (_ref3) {
|
227 | var name = _ref3.name,
|
228 | _ref3$options = _ref3.options,
|
229 | options = _ref3$options === void 0 ? {} : _ref3$options,
|
230 | effect = _ref3.effect;
|
231 |
|
232 | if (typeof effect === 'function') {
|
233 | var cleanupFn = effect({
|
234 | state: state,
|
235 | name: name,
|
236 | instance: instance,
|
237 | options: options
|
238 | });
|
239 |
|
240 | var noopFn = function noopFn() {};
|
241 |
|
242 | effectCleanupFns.push(cleanupFn || noopFn);
|
243 | }
|
244 | });
|
245 | }
|
246 |
|
247 | function cleanupModifierEffects() {
|
248 | effectCleanupFns.forEach(function (fn) {
|
249 | return fn();
|
250 | });
|
251 | effectCleanupFns = [];
|
252 | }
|
253 |
|
254 | return instance;
|
255 | };
|
256 | }
|
257 | export var createPopper = popperGenerator();
|
258 |
|
259 | export { detectOverflow }; |
\ | No newline at end of file |