YunoHost/yunohost-admin
1
0
Fork 0
mirror of https://github.com/YunoHost/yunohost-admin.git synced 2024-09-03 20:06:15 +02:00
Code Issues Projects Releases Packages Wiki Activity

fix: CardDeckFeed slots slicing + keyboard navigation

Browse source
This commit is contained in:
axolotle 2024-03-19 01:17:26 +01:00
parent cc02444e33
commit 620694c42d
1 changed files with 9 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
app/src/components/CardDeckFeed.vue
View file

@ -15,19 +15,19 @@ export default {
return { return {
busy: false, busy: false,
range: this.stacks, range: this.stacks,
childrenCount: this.$slots.default().length, childrenCount: this.$slots.default()[0].children,
} }
}, },
methods: { methods: {
getTopParent(prev) { getTopParent(prev) {
return prev.parentElement === this.$refs.feed return prev.parentElement === this.$refs.feed.$el
? prev ? prev
: this.getTopParent(prev.parentElement) : this.getTopParent(prev.parentElement)
}, },
onScroll() { onScroll() {
const elem = this.$refs.feed const elem = this.$refs.feed.$el
if ( if (
window.innerHeight > window.innerHeight >
elem.clientHeight + elem.getBoundingClientRect().top - 200 elem.clientHeight + elem.getBoundingClientRect().top - 200
@ -56,12 +56,12 @@ export default {
mounted() { mounted() {
window.addEventListener('scroll', this.onScroll) window.addEventListener('scroll', this.onScroll)
this.$refs.feed.addEventListener('keydown', this.onKeydown) this.$refs.feed.$el.addEventListener('keydown', this.onKeydown)
this.onScroll() this.onScroll()
}, },
beforeUpdate() { beforeUpdate() {
const slots = this.$slots.default() const slots = this.$slots.default()[0].children
if (this.childrenCount !== slots.length) { if (this.childrenCount !== slots.length) {
this.range = this.stacks this.range = this.stacks
this.childrenCount = slots.length this.childrenCount = slots.length
@ -77,13 +77,15 @@ export default {
'aria-busy': this.busy.toString(), 'aria-busy': this.busy.toString(),
ref: 'feed', ref: 'feed',
}, },
this.$slots.default().slice(0, this.range), {
default: () => this.$slots.default()[0].children.slice(0, this.range),
},
) )
}, },
beforeUnmount() { beforeUnmount() {
window.removeEventListener('scroll', this.onScroll) window.removeEventListener('scroll', this.onScroll)
this.$refs.feed.removeEventListener('keydown', this.onKeydown) this.$refs.feed.$el.removeEventListener('keydown', this.onKeydown)
}, },
} }
</script> </script>