1 | import { MapPlacementInToRL } from './models';
|
2 | import { arrow, flip, initData, preventOverflow, shift } from './modifiers';
|
3 | import { getOffsets, getReferenceOffsets, setStyles, updateContainerClass } from './utils';
|
4 | export class Positioning {
|
5 | position(hostElement, targetElement ) {
|
6 | return this.offset(hostElement, targetElement );
|
7 | }
|
8 | offset(hostElement, targetElement ) {
|
9 | return getReferenceOffsets(targetElement, hostElement);
|
10 | }
|
11 | positionElements(hostElement, targetElement, position, appendToBody, options) {
|
12 | const chainOfModifiers = [flip, shift, preventOverflow, arrow];
|
13 | const _position = MapPlacementInToRL[position];
|
14 | const data = initData(targetElement, hostElement, _position, options);
|
15 | if (!data) {
|
16 | return;
|
17 | }
|
18 | return chainOfModifiers.reduce((modifiedData, modifier) => modifier(modifiedData), data);
|
19 | }
|
20 | }
|
21 | const positionService = new Positioning();
|
22 | export function positionElements(hostElement, targetElement, placement, appendToBody, options, renderer) {
|
23 | const data = positionService.positionElements(hostElement, targetElement, placement, appendToBody, options);
|
24 | if (!data) {
|
25 | return;
|
26 | }
|
27 | const offsets = getOffsets(data);
|
28 | setStyles(targetElement, {
|
29 | 'will-change': 'transform',
|
30 | top: '0px',
|
31 | left: '0px',
|
32 | transform: `translate3d(${offsets.left}px, ${offsets.top}px, 0px)`
|
33 | }, renderer);
|
34 | if (data.instance.arrow) {
|
35 | setStyles(data.instance.arrow, data.offsets.arrow, renderer);
|
36 | }
|
37 | updateContainerClass(data, renderer);
|
38 | }
|
39 |
|
\ | No newline at end of file |