1 | /*
|
2 | * Copyright 2017 Palantir Technologies, Inc. All rights reserved.
|
3 | *
|
4 | * Licensed under the Apache License, Version 2.0 (the "License");
|
5 | * you may not use this file except in compliance with the License.
|
6 | * You may obtain a copy of the License at
|
7 | *
|
8 | * http://www.apache.org/licenses/LICENSE-2.0
|
9 | *
|
10 | * Unless required by applicable law or agreed to in writing, software
|
11 | * distributed under the License is distributed on an "AS IS" BASIS,
|
12 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
13 | * See the License for the specific language governing permissions and
|
14 | * limitations under the License.
|
15 | */
|
16 | // Popper placement utils
|
17 | // ======================
|
18 | /** Converts a full placement to one of the four positions by stripping text after the `-`. */
|
19 | export function getPosition(placement) {
|
20 | return placement.split("-")[0];
|
21 | }
|
22 | /** Returns true if position is left or right. */
|
23 | export function isVerticalPosition(side) {
|
24 | return ["left", "right"].indexOf(side) !== -1;
|
25 | }
|
26 | /** Returns the opposite position. */
|
27 | export function getOppositePosition(side) {
|
28 | switch (side) {
|
29 | case "top":
|
30 | return "bottom";
|
31 | case "left":
|
32 | return "right";
|
33 | case "bottom":
|
34 | return "top";
|
35 | default:
|
36 | return "left";
|
37 | }
|
38 | }
|
39 | /** Returns the CSS alignment keyword corresponding to given placement. */
|
40 | export function getAlignment(placement) {
|
41 | var align = placement.split("-")[1];
|
42 | switch (align) {
|
43 | case "start":
|
44 | return "left";
|
45 | case "end":
|
46 | return "right";
|
47 | default:
|
48 | return "center";
|
49 | }
|
50 | }
|
51 | // Popper modifiers
|
52 | // ================
|
53 | /** Modifier helper function to compute popper transform-origin based on arrow position */
|
54 | export function getTransformOrigin(data) {
|
55 | var position = getPosition(data.placement);
|
56 | if (data.arrowElement == null) {
|
57 | return isVerticalPosition(position)
|
58 | ? "".concat(getOppositePosition(position), " ").concat(getAlignment(position))
|
59 | : "".concat(getAlignment(position), " ").concat(getOppositePosition(position));
|
60 | }
|
61 | else {
|
62 | var arrowSizeShift = data.arrowElement.clientHeight / 2;
|
63 | var arrow = data.offsets.arrow;
|
64 | // can use keyword for dimension without the arrow, to ease computation burden.
|
65 | // move origin by half arrow's height to keep it centered.
|
66 | return isVerticalPosition(position)
|
67 | ? "".concat(getOppositePosition(position), " ").concat(arrow.top + arrowSizeShift, "px")
|
68 | : "".concat(arrow.left + arrowSizeShift, "px ").concat(getOppositePosition(position));
|
69 | }
|
70 | }
|
71 | // additional space between arrow and edge of target
|
72 | var ARROW_SPACING = 4;
|
73 | /** Popper modifier that offsets popper and arrow so arrow points out of the correct side */
|
74 | export var arrowOffsetModifier = function (data) {
|
75 | if (data.arrowElement == null) {
|
76 | return data;
|
77 | }
|
78 | // our arrows have equal width and height
|
79 | var arrowSize = data.arrowElement.clientWidth;
|
80 | // this logic borrowed from original Popper arrow modifier itself
|
81 | var position = getPosition(data.placement);
|
82 | var isVertical = isVerticalPosition(position);
|
83 | var len = isVertical ? "width" : "height";
|
84 | var offsetSide = isVertical ? "left" : "top";
|
85 | var arrowOffsetSize = Math.round(arrowSize / 2 / Math.sqrt(2));
|
86 | // offset popover by arrow size, offset arrow in the opposite direction
|
87 | if (position === "top" || position === "left") {
|
88 | // the "up & back" directions require negative popper offsets
|
89 | data.offsets.popper[offsetSide] -= arrowOffsetSize + ARROW_SPACING;
|
90 | // can only use left/top on arrow so gotta get clever with 100% + X
|
91 | data.offsets.arrow[offsetSide] = data.offsets.popper[len] - arrowSize + arrowOffsetSize;
|
92 | }
|
93 | else {
|
94 | data.offsets.popper[offsetSide] += arrowOffsetSize + ARROW_SPACING;
|
95 | data.offsets.arrow[offsetSide] = -arrowOffsetSize;
|
96 | }
|
97 | return data;
|
98 | };
|
99 | //# sourceMappingURL=popperUtils.js.map |
\ | No newline at end of file |