1 | <div
|
2 | class="popover-wrapper"
|
3 | ref="wrapper"
|
4 | :class="classes"
|
5 | :id="name"
|
6 | v-click-outside="onClickOutside"
|
7 | @keyup.esc="onEscape"
|
8 | >
|
9 | <div
|
10 | class="popover-trigger"
|
11 | ref="trigger"
|
12 | :aria-describedby="`${name}-popup`"
|
13 | :aria-disabled="disabled ? 'true' : 'false'"
|
14 | :aria-expanded="visible ? 'true' : 'false'"
|
15 | >
|
16 | <slot />
|
17 | </div>
|
18 |
|
19 | <transition
|
20 | name="zoom-in-top-transition"
|
21 | @after-leave="destroyPopper"
|
22 | >
|
23 | <div
|
24 | class="popover"
|
25 | ref="popup"
|
26 | role="tooltip"
|
27 | aria-live="polite"
|
28 | :id="`${name}-popup`"
|
29 | :aria-hidden="visible ? 'false' : 'true'"
|
30 | v-show="visible"
|
31 | >
|
32 | <span data-popper-arrow v-if="arrow" />
|
33 | <div class="popover-header" v-if="$slots.header">
|
34 | <slot name="header" />
|
35 | </div>
|
36 | <div class="popover-body" v-if="$slots.body">
|
37 | <slot name="body" />
|
38 | </div>
|
39 | <div class="popover-footer" v-if="$slots.footer">
|
40 | <slot name="footer" />
|
41 | </div>
|
42 | </div>
|
43 | </transition>
|
44 | </div>
|