diff --git a/lib/ruby_ui/combobox/combobox_controller.js b/lib/ruby_ui/combobox/combobox_controller.js index 7372ed40..0dd4531a 100644 --- a/lib/ruby_ui/combobox/combobox_controller.js +++ b/lib/ruby_ui/combobox/combobox_controller.js @@ -9,6 +9,7 @@ export default class extends Controller { static targets = [ "input", + "toggleAll", "popover", "item", "emptyState", @@ -33,12 +34,22 @@ export default class extends Controller { if (e.target.type == "radio") { this.closePopover() } + + if (this.hasToggleAllTarget && !e.target.checked) { + this.toggleAllTarget.checked = false + } } inputContent(input) { return input.dataset.text || input.parentElement.innerText } + toggleAllItems() { + const isChecked = this.toggleAllTarget.checked + this.inputTargets.forEach(input => input.checked = isChecked) + this.updateTriggerContent() + } + updateTriggerContent() { const checkedInputs = this.inputTargets.filter(input => input.checked) @@ -73,6 +84,12 @@ export default class extends Controller { } const filterTerm = this.searchInputTarget.value.toLowerCase() + + if (this.hasToggleAllTarget) { + if (filterTerm) this.toggleAllTarget.parentElement.classList.add("hidden") + else this.toggleAllTarget.parentElement.classList.remove("hidden") + } + let resultCount = 0 this.selectedItemIndex = null diff --git a/lib/ruby_ui/combobox/combobox_toggle_all_checkbox.rb b/lib/ruby_ui/combobox/combobox_toggle_all_checkbox.rb new file mode 100644 index 00000000..5ac8beca --- /dev/null +++ b/lib/ruby_ui/combobox/combobox_toggle_all_checkbox.rb @@ -0,0 +1,25 @@ +# frozen_string_literal: true + +module RubyUI + class ComboboxToggleAllCheckbox < Base + def view_template + input(type: "checkbox", **attrs) + end + + private + + def default_attrs + { + class: [ + "peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background accent-primary", + "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", + "disabled:cursor-not-allowed disabled:opacity-50" + ], + data: { + ruby_ui__combobox_target: "toggleAll", + action: "change->ruby-ui--combobox#toggleAllItems" + } + } + end + end +end