mirror of
https://github.com/we-promise/sure.git
synced 2026-04-23 22:14:08 +00:00
@@ -2,15 +2,29 @@ import { Controller } from "@hotwired/stimulus";
|
||||
|
||||
// Basic functionality to filter a list based on a provided text attribute.
|
||||
export default class extends Controller {
|
||||
static targets = ["input", "list"];
|
||||
static targets = ["input", "list", "emptyMessage"];
|
||||
|
||||
filter() {
|
||||
const filterValue = this.inputTarget.value.toLowerCase();
|
||||
const items = this.listTarget.querySelectorAll(".filterable-item");
|
||||
let noMatchFound = true;
|
||||
|
||||
if (this.hasEmptyMessageTarget) {
|
||||
this.emptyMessageTarget.classList.add("hidden");
|
||||
}
|
||||
|
||||
items.forEach((item) => {
|
||||
const text = item.getAttribute("data-filter-name").toLowerCase();
|
||||
item.style.display = text.includes(filterValue) ? "" : "none";
|
||||
const shouldDisplay = text.includes(filterValue);
|
||||
item.style.display = shouldDisplay ? "" : "none";
|
||||
|
||||
if (shouldDisplay) {
|
||||
noMatchFound = false;
|
||||
}
|
||||
});
|
||||
|
||||
if (noMatchFound && this.hasEmptyMessageTarget) {
|
||||
this.emptyMessageTarget.classList.remove("hidden");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user