Sha256: 4fb23d614dd977b300cac8f7f170fad0209cb784f8fe93dd9f051b7c7effeb93
Contents?: true
Size: 1.29 KB
Versions: 6
Compression:
Stored size: 1.29 KB
Contents
import { Controller } from "@hotwired/stimulus"
export default class extends Controller {
static targets = ['listItem', 'category', 'recommended']
filter(event) {
const query = event.currentTarget.value.toLowerCase()
this.handleFilter(query)
}
clearSearch() {
this.handleFilter('')
}
handleFilter(query) {
const visibleCategories = new Set()
// hide / show listItem links that match the query and note which
// categories should be visible
this.listItemTargets.forEach(listItemNode => {
const listItemName = listItemNode.dataset.listItemValue.toLowerCase()
if (listItemName.includes(query)) {
listItemNode.hidden = false
visibleCategories.add(listItemNode.dataset.category)
} else {
listItemNode.hidden = true
}
})
this.recommendedTargets.forEach(recommendedNode => {
(query !== '' && visibleCategories.size === 0) ? recommendedNode.hidden = true : recommendedNode.hidden = false
})
// hide / show category headers that have visible listItems
this.categoryTargets.forEach(categoryNode => {
const categoryName = categoryNode.innerHTML
if (visibleCategories.has(categoryName)) {
categoryNode.hidden = false
} else {
categoryNode.hidden = true
}
})
}
}
Version data entries
6 entries across 6 versions & 1 rubygems