1 | import getBasePlacement from "../utils/getBasePlacement.js";
|
---|
2 | import getLayoutRect from "../dom-utils/getLayoutRect.js";
|
---|
3 | import contains from "../dom-utils/contains.js";
|
---|
4 | import getOffsetParent from "../dom-utils/getOffsetParent.js";
|
---|
5 | import getMainAxisFromPlacement from "../utils/getMainAxisFromPlacement.js";
|
---|
6 | import { within } from "../utils/within.js";
|
---|
7 | import mergePaddingObject from "../utils/mergePaddingObject.js";
|
---|
8 | import expandToHashMap from "../utils/expandToHashMap.js";
|
---|
9 | import { left, right, basePlacements, top, bottom } from "../enums.js"; // eslint-disable-next-line import/no-unused-modules
|
---|
10 |
|
---|
11 | var toPaddingObject = function toPaddingObject(padding, state) {
|
---|
12 | padding = typeof padding === 'function' ? padding(Object.assign({}, state.rects, {
|
---|
13 | placement: state.placement
|
---|
14 | })) : padding;
|
---|
15 | return mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));
|
---|
16 | };
|
---|
17 |
|
---|
18 | function arrow(_ref) {
|
---|
19 | var _state$modifiersData$;
|
---|
20 |
|
---|
21 | var state = _ref.state,
|
---|
22 | name = _ref.name,
|
---|
23 | options = _ref.options;
|
---|
24 | var arrowElement = state.elements.arrow;
|
---|
25 | var popperOffsets = state.modifiersData.popperOffsets;
|
---|
26 | var basePlacement = getBasePlacement(state.placement);
|
---|
27 | var axis = getMainAxisFromPlacement(basePlacement);
|
---|
28 | var isVertical = [left, right].indexOf(basePlacement) >= 0;
|
---|
29 | var len = isVertical ? 'height' : 'width';
|
---|
30 |
|
---|
31 | if (!arrowElement || !popperOffsets) {
|
---|
32 | return;
|
---|
33 | }
|
---|
34 |
|
---|
35 | var paddingObject = toPaddingObject(options.padding, state);
|
---|
36 | var arrowRect = getLayoutRect(arrowElement);
|
---|
37 | var minProp = axis === 'y' ? top : left;
|
---|
38 | var maxProp = axis === 'y' ? bottom : right;
|
---|
39 | var endDiff = state.rects.reference[len] + state.rects.reference[axis] - popperOffsets[axis] - state.rects.popper[len];
|
---|
40 | var startDiff = popperOffsets[axis] - state.rects.reference[axis];
|
---|
41 | var arrowOffsetParent = getOffsetParent(arrowElement);
|
---|
42 | var clientSize = arrowOffsetParent ? axis === 'y' ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0;
|
---|
43 | var centerToReference = endDiff / 2 - startDiff / 2; // Make sure the arrow doesn't overflow the popper if the center point is
|
---|
44 | // outside of the popper bounds
|
---|
45 |
|
---|
46 | var min = paddingObject[minProp];
|
---|
47 | var max = clientSize - arrowRect[len] - paddingObject[maxProp];
|
---|
48 | var center = clientSize / 2 - arrowRect[len] / 2 + centerToReference;
|
---|
49 | var offset = within(min, center, max); // Prevents breaking syntax highlighting...
|
---|
50 |
|
---|
51 | var axisProp = axis;
|
---|
52 | state.modifiersData[name] = (_state$modifiersData$ = {}, _state$modifiersData$[axisProp] = offset, _state$modifiersData$.centerOffset = offset - center, _state$modifiersData$);
|
---|
53 | }
|
---|
54 |
|
---|
55 | function effect(_ref2) {
|
---|
56 | var state = _ref2.state,
|
---|
57 | options = _ref2.options;
|
---|
58 | var _options$element = options.element,
|
---|
59 | arrowElement = _options$element === void 0 ? '[data-popper-arrow]' : _options$element;
|
---|
60 |
|
---|
61 | if (arrowElement == null) {
|
---|
62 | return;
|
---|
63 | } // CSS selector
|
---|
64 |
|
---|
65 |
|
---|
66 | if (typeof arrowElement === 'string') {
|
---|
67 | arrowElement = state.elements.popper.querySelector(arrowElement);
|
---|
68 |
|
---|
69 | if (!arrowElement) {
|
---|
70 | return;
|
---|
71 | }
|
---|
72 | }
|
---|
73 |
|
---|
74 | if (!contains(state.elements.popper, arrowElement)) {
|
---|
75 | return;
|
---|
76 | }
|
---|
77 |
|
---|
78 | state.elements.arrow = arrowElement;
|
---|
79 | } // eslint-disable-next-line import/no-unused-modules
|
---|
80 |
|
---|
81 |
|
---|
82 | export default {
|
---|
83 | name: 'arrow',
|
---|
84 | enabled: true,
|
---|
85 | phase: 'main',
|
---|
86 | fn: arrow,
|
---|
87 | effect: effect,
|
---|
88 | requires: ['popperOffsets'],
|
---|
89 | requiresIfExists: ['preventOverflow']
|
---|
90 | }; |
---|