Skip to content

Commit e9f5843

Browse files
author
Nathan Reyes
committed
Fix popover dismissal bug in Chrome.
1 parent 3290b90 commit e9f5843

File tree

6 files changed

+27
-4
lines changed

6 files changed

+27
-4
lines changed

lib/v-calendar.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

lib/v-calendar.min.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "v-calendar",
3-
"version": "0.0.9",
3+
"version": "0.1.0",
44
"description": "A clean and extendable plugin for building simple attributed calendars in Vue.js.",
55
"keywords": ["vue", "calendar", "highlights", "indicators"],
66
"homepage": "vcalendar.netlify.com",

src/components/CalendarPane.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -198,6 +198,7 @@ export default {
198198
},
199199
data() {
200200
return {
201+
todayComps,
201202
pages: [],
202203
page_: null,
203204
transitionDirection: '',

src/components/Popover.vue

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
:class='["anchor", "direction-" + direction, "align-" + align]'
1111
v-if='visibleDelay'>
1212
<div
13+
ref='popoverContent'
1314
:class='["content", "direction-" + direction, "align-" + align]'>
1415
<slot name='popover-content'>
1516
<div>Popover content goes here</div>
@@ -24,6 +25,9 @@
2425
</template>
2526

2627
<script>
28+
import Vue from 'vue';
29+
import { composedPath } from '../utils/helpers';
30+
2731
const POPOVER_AUTO = -1;
2832
const POPOVER_VISIBLE = 1;
2933
const _tapTolerance = 0;
@@ -102,6 +106,10 @@ export default {
102106
this.$emit('focusin', e);
103107
},
104108
focusout(e) {
109+
// Trap focus if element losing focus is nested within the popover content
110+
if (e.target !== this.$refs.popover && composedPath(e.target).includes(this.$refs.popoverContent)) {
111+
Vue.nextTick(() => this.$refs.popover.focus());
112+
}
105113
this.visible = false;
106114
this.$emit('focusout', e);
107115
},

src/utils/helpers.js

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -103,6 +103,20 @@ export const getLastArrayItem = (array) => {
103103
return array.length ? array[array.length - 1] : undefined;
104104
};
105105

106+
export const composedPath = (el) => {
107+
const path = [];
108+
while (el) {
109+
path.push(el);
110+
if (el.tagName === 'HTML') {
111+
path.push(document);
112+
path.push(window);
113+
return path;
114+
}
115+
el = el.parentElement;
116+
}
117+
return path;
118+
};
119+
106120
export const isMobile = {
107121
andriod() {
108122
return navigator.userAgent.match(/Android/i);

0 commit comments

Comments
 (0)