1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
| import { inject, ref, computed, unref, watch, onMounted } from 'vue';
| import { isUndefined } from 'lodash-unified';
| import '../../../../hooks/index.mjs';
| import { POPPER_INJECTION_KEY } from '../constants.mjs';
| import { buildPopperOptions, unwrapMeasurableEl } from '../utils.mjs';
| import { usePopper } from '../../../../hooks/use-popper/index.mjs';
|
| const DEFAULT_ARROW_OFFSET = 0;
| const usePopperContent = (props) => {
| const { popperInstanceRef, contentRef, triggerRef, role } = inject(POPPER_INJECTION_KEY, void 0);
| const arrowRef = ref();
| const arrowOffset = ref();
| const eventListenerModifier = computed(() => {
| return {
| name: "eventListeners",
| enabled: !!props.visible
| };
| });
| const arrowModifier = computed(() => {
| var _a;
| const arrowEl = unref(arrowRef);
| const offset = (_a = unref(arrowOffset)) != null ? _a : DEFAULT_ARROW_OFFSET;
| return {
| name: "arrow",
| enabled: !isUndefined(arrowEl),
| options: {
| element: arrowEl,
| padding: offset
| }
| };
| });
| const options = computed(() => {
| return {
| onFirstUpdate: () => {
| update();
| },
| ...buildPopperOptions(props, [
| unref(arrowModifier),
| unref(eventListenerModifier)
| ])
| };
| });
| const computedReference = computed(() => unwrapMeasurableEl(props.referenceEl) || unref(triggerRef));
| const { attributes, state, styles, update, forceUpdate, instanceRef } = usePopper(computedReference, contentRef, options);
| watch(instanceRef, (instance) => popperInstanceRef.value = instance);
| onMounted(() => {
| watch(() => {
| var _a;
| return (_a = unref(computedReference)) == null ? void 0 : _a.getBoundingClientRect();
| }, () => {
| update();
| });
| });
| return {
| attributes,
| arrowRef,
| contentRef,
| instanceRef,
| state,
| styles,
| role,
| forceUpdate,
| update
| };
| };
|
| export { usePopperContent };
| //# sourceMappingURL=use-content.mjs.map
|
|
