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 orderModifiers from "./utils/orderModifiers.js";
|
---|
6 | import debounce from "./utils/debounce.js";
|
---|
7 | import mergeByName from "./utils/mergeByName.js";
|
---|
8 | import detectOverflow from "./utils/detectOverflow.js";
|
---|
9 | import { isElement } from "./dom-utils/instanceOf.js";
|
---|
10 | var DEFAULT_OPTIONS = {
|
---|
11 | placement: 'bottom',
|
---|
12 | modifiers: [],
|
---|
13 | strategy: 'absolute'
|
---|
14 | };
|
---|
15 |
|
---|
16 | function areValidElements() {
|
---|
17 | for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
---|
18 | args[_key] = arguments[_key];
|
---|
19 | }
|
---|
20 |
|
---|
21 | return !args.some(function (element) {
|
---|
22 | return !(element && typeof element.getBoundingClientRect === 'function');
|
---|
23 | });
|
---|
24 | }
|
---|
25 |
|
---|
26 | export function popperGenerator(generatorOptions) {
|
---|
27 | if (generatorOptions === void 0) {
|
---|
28 | generatorOptions = {};
|
---|
29 | }
|
---|
30 |
|
---|
31 | var _generatorOptions = generatorOptions,
|
---|
32 | _generatorOptions$def = _generatorOptions.defaultModifiers,
|
---|
33 | defaultModifiers = _generatorOptions$def === void 0 ? [] : _generatorOptions$def,
|
---|
34 | _generatorOptions$def2 = _generatorOptions.defaultOptions,
|
---|
35 | defaultOptions = _generatorOptions$def2 === void 0 ? DEFAULT_OPTIONS : _generatorOptions$def2;
|
---|
36 | return function createPopper(reference, popper, options) {
|
---|
37 | if (options === void 0) {
|
---|
38 | options = defaultOptions;
|
---|
39 | }
|
---|
40 |
|
---|
41 | var state = {
|
---|
42 | placement: 'bottom',
|
---|
43 | orderedModifiers: [],
|
---|
44 | options: Object.assign({}, DEFAULT_OPTIONS, defaultOptions),
|
---|
45 | modifiersData: {},
|
---|
46 | elements: {
|
---|
47 | reference: reference,
|
---|
48 | popper: popper
|
---|
49 | },
|
---|
50 | attributes: {},
|
---|
51 | styles: {}
|
---|
52 | };
|
---|
53 | var effectCleanupFns = [];
|
---|
54 | var isDestroyed = false;
|
---|
55 | var instance = {
|
---|
56 | state: state,
|
---|
57 | setOptions: function setOptions(setOptionsAction) {
|
---|
58 | var options = typeof setOptionsAction === 'function' ? setOptionsAction(state.options) : setOptionsAction;
|
---|
59 | cleanupModifierEffects();
|
---|
60 | state.options = Object.assign({}, defaultOptions, state.options, options);
|
---|
61 | state.scrollParents = {
|
---|
62 | reference: isElement(reference) ? listScrollParents(reference) : reference.contextElement ? listScrollParents(reference.contextElement) : [],
|
---|
63 | popper: listScrollParents(popper)
|
---|
64 | }; // Orders the modifiers based on their dependencies and `phase`
|
---|
65 | // properties
|
---|
66 |
|
---|
67 | var orderedModifiers = orderModifiers(mergeByName([].concat(defaultModifiers, state.options.modifiers))); // Strip out disabled modifiers
|
---|
68 |
|
---|
69 | state.orderedModifiers = orderedModifiers.filter(function (m) {
|
---|
70 | return m.enabled;
|
---|
71 | });
|
---|
72 | runModifierEffects();
|
---|
73 | return instance.update();
|
---|
74 | },
|
---|
75 | // Sync update – it will always be executed, even if not necessary. This
|
---|
76 | // is useful for low frequency updates where sync behavior simplifies the
|
---|
77 | // logic.
|
---|
78 | // For high frequency updates (e.g. `resize` and `scroll` events), always
|
---|
79 | // prefer the async Popper#update method
|
---|
80 | forceUpdate: function forceUpdate() {
|
---|
81 | if (isDestroyed) {
|
---|
82 | return;
|
---|
83 | }
|
---|
84 |
|
---|
85 | var _state$elements = state.elements,
|
---|
86 | reference = _state$elements.reference,
|
---|
87 | popper = _state$elements.popper; // Don't proceed if `reference` or `popper` are not valid elements
|
---|
88 | // anymore
|
---|
89 |
|
---|
90 | if (!areValidElements(reference, popper)) {
|
---|
91 | return;
|
---|
92 | } // Store the reference and popper rects to be read by modifiers
|
---|
93 |
|
---|
94 |
|
---|
95 | state.rects = {
|
---|
96 | reference: getCompositeRect(reference, getOffsetParent(popper), state.options.strategy === 'fixed'),
|
---|
97 | popper: getLayoutRect(popper)
|
---|
98 | }; // Modifiers have the ability to reset the current update cycle. The
|
---|
99 | // most common use case for this is the `flip` modifier changing the
|
---|
100 | // placement, which then needs to re-run all the modifiers, because the
|
---|
101 | // logic was previously ran for the previous placement and is therefore
|
---|
102 | // stale/incorrect
|
---|
103 |
|
---|
104 | state.reset = false;
|
---|
105 | state.placement = state.options.placement; // On each update cycle, the `modifiersData` property for each modifier
|
---|
106 | // is filled with the initial data specified by the modifier. This means
|
---|
107 | // it doesn't persist and is fresh on each update.
|
---|
108 | // To ensure persistent data, use `${name}#persistent`
|
---|
109 |
|
---|
110 | state.orderedModifiers.forEach(function (modifier) {
|
---|
111 | return state.modifiersData[modifier.name] = Object.assign({}, modifier.data);
|
---|
112 | });
|
---|
113 |
|
---|
114 | for (var index = 0; index < state.orderedModifiers.length; index++) {
|
---|
115 | if (state.reset === true) {
|
---|
116 | state.reset = false;
|
---|
117 | index = -1;
|
---|
118 | continue;
|
---|
119 | }
|
---|
120 |
|
---|
121 | var _state$orderedModifie = state.orderedModifiers[index],
|
---|
122 | fn = _state$orderedModifie.fn,
|
---|
123 | _state$orderedModifie2 = _state$orderedModifie.options,
|
---|
124 | _options = _state$orderedModifie2 === void 0 ? {} : _state$orderedModifie2,
|
---|
125 | name = _state$orderedModifie.name;
|
---|
126 |
|
---|
127 | if (typeof fn === 'function') {
|
---|
128 | state = fn({
|
---|
129 | state: state,
|
---|
130 | options: _options,
|
---|
131 | name: name,
|
---|
132 | instance: instance
|
---|
133 | }) || state;
|
---|
134 | }
|
---|
135 | }
|
---|
136 | },
|
---|
137 | // Async and optimistically optimized update – it will not be executed if
|
---|
138 | // not necessary (debounced to run at most once-per-tick)
|
---|
139 | update: debounce(function () {
|
---|
140 | return new Promise(function (resolve) {
|
---|
141 | instance.forceUpdate();
|
---|
142 | resolve(state);
|
---|
143 | });
|
---|
144 | }),
|
---|
145 | destroy: function destroy() {
|
---|
146 | cleanupModifierEffects();
|
---|
147 | isDestroyed = true;
|
---|
148 | }
|
---|
149 | };
|
---|
150 |
|
---|
151 | if (!areValidElements(reference, popper)) {
|
---|
152 | return instance;
|
---|
153 | }
|
---|
154 |
|
---|
155 | instance.setOptions(options).then(function (state) {
|
---|
156 | if (!isDestroyed && options.onFirstUpdate) {
|
---|
157 | options.onFirstUpdate(state);
|
---|
158 | }
|
---|
159 | }); // Modifiers have the ability to execute arbitrary code before the first
|
---|
160 | // update cycle runs. They will be executed in the same order as the update
|
---|
161 | // cycle. This is useful when a modifier adds some persistent data that
|
---|
162 | // other modifiers need to use, but the modifier is run after the dependent
|
---|
163 | // one.
|
---|
164 |
|
---|
165 | function runModifierEffects() {
|
---|
166 | state.orderedModifiers.forEach(function (_ref) {
|
---|
167 | var name = _ref.name,
|
---|
168 | _ref$options = _ref.options,
|
---|
169 | options = _ref$options === void 0 ? {} : _ref$options,
|
---|
170 | effect = _ref.effect;
|
---|
171 |
|
---|
172 | if (typeof effect === 'function') {
|
---|
173 | var cleanupFn = effect({
|
---|
174 | state: state,
|
---|
175 | name: name,
|
---|
176 | instance: instance,
|
---|
177 | options: options
|
---|
178 | });
|
---|
179 |
|
---|
180 | var noopFn = function noopFn() {};
|
---|
181 |
|
---|
182 | effectCleanupFns.push(cleanupFn || noopFn);
|
---|
183 | }
|
---|
184 | });
|
---|
185 | }
|
---|
186 |
|
---|
187 | function cleanupModifierEffects() {
|
---|
188 | effectCleanupFns.forEach(function (fn) {
|
---|
189 | return fn();
|
---|
190 | });
|
---|
191 | effectCleanupFns = [];
|
---|
192 | }
|
---|
193 |
|
---|
194 | return instance;
|
---|
195 | };
|
---|
196 | }
|
---|
197 | export var createPopper = /*#__PURE__*/popperGenerator(); // eslint-disable-next-line import/no-unused-modules
|
---|
198 |
|
---|
199 | export { detectOverflow }; |
---|