css-zero 0.0.82 → 0.0.83

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: e8ec29ec17afa74563dcc2fa5bd24685b96132de62a6aa0cb14785463925dcf2
-  data.tar.gz: 183f5f659feb95a2d82467e8c4739acd0ba2cdb9f49b143cadcc4e4d5688aa59
+  metadata.gz: 71c3c38650e2b111579da72c2349589c5ae2bd114223701b7dd6dc2459136b35
+  data.tar.gz: 19401b13fa751a752893c70e9d9b84d641984a510fd66e246e188054360edbb1
 SHA512:
-  metadata.gz: d68e553275f7974dbb96e912119d23c70e2362eb63ec111485d601ac15f07f17d36c172001eb63e958b4f2c29bf21d34f8bab6954355645574784e10730ccf1a
-  data.tar.gz: 799ae1844ba99b374498076523c3050473eaf40dccfaa0b05f1e680293ca679c7e96a8fe005909985d3f8cf2de12a30e8f9c6186425c599e43020dab837cf076
+  metadata.gz: d67f8fb7778c60e40e7bfcedd7524b6296091777561e48c60c267d1c4bef5969f124c8b80ccd37a1f28f2da8d7e9988e8d9d3b90fbc67e9d4e70c904aabf4c51
+  data.tar.gz: 52d1ebd7224d43b4a4d67cd9b473fbbd60f849cfe02f56b8abecd3cdb8c02f460d6f8795411a7a22fd08234e0f0958e8de7bd263ca5059bb09809d9c623bf877

data/lib/css_zero/version.rb

@@ -1,3 +1,3 @@
 module CssZero
-  VERSION = "0.0.82"
+  VERSION = "0.0.83"
 end

data/lib/generators/css_zero/add/resources.yml

@@ -36,7 +36,7 @@ combobox:
 command:
   - app/assets/stylesheets/command.css
   - app/javascript/controllers/filter_controller.js
-  - app/javascript/controllers/list_controller.js
+  - app/javascript/controllers/listbox_controller.js
   - app/assets/images/search.svg
 collapsible:
   - app/javascript/controllers/collapsible_controller.js

data/lib/generators/css_zero/add/templates/app/javascript/controllers/listbox_controller.js

@@ -0,0 +1,22 @@
+import { Controller } from "@hotwired/stimulus"
+import Listbox from "https://cdn.skypack.dev/@github/combobox-nav@3.0.1?min"
+
+export default class extends Controller {
+  static targets = [ "input", "list" ]
+
+  connect() {
+    this.listbox = new Listbox(this.inputTarget, this.listTarget)
+  }
+
+  disconnect() {
+    this.listbox.destroy()
+  }
+
+  start() {
+    this.listbox.start()
+  }
+
+  stop() {
+    this.listbox.stop()
+  }
+}

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: css-zero
 version: !ruby/object:Gem::Version
-  version: 0.0.82
+  version: 0.0.83
 platform: ruby
 authors:
 - Lázaro Nixon
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-01-08 00:00:00.000000000 Z
+date: 2025-01-09 00:00:00.000000000 Z
 dependencies: []
 description:
 email: lazaronixon@hotmail.com
@@ -105,7 +105,7 @@ files:
 - lib/generators/css_zero/add/templates/app/javascript/controllers/hotkey_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/inputmask_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/lightbox_controller.js
-- lib/generators/css_zero/add/templates/app/javascript/controllers/list_controller.js
+- lib/generators/css_zero/add/templates/app/javascript/controllers/listbox_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/local_time_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/menu_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/navigation_controller.js

data/lib/generators/css_zero/add/templates/app/javascript/controllers/list_controller.js

@@ -1,79 +0,0 @@
-import { Controller } from "@hotwired/stimulus"
-
-export default class extends Controller {
-  static targets = [ "option" ]
-  static values  = { index: Number }
-
-  connect() {
-    this.#removeTabstops()
-    this.#selectFirstOption()
-  }
-
-  reset() {
-    this.indexValue = 0
-    this.#selectCurrentOption()
-  }
-
-  navigate(event) {
-    switch (event.key) {
-      case "ArrowUp":
-        event.preventDefault()
-        this.#prev()
-        break
-      case "ArrowDown":
-        event.preventDefault()
-        this.#next()
-        break
-      case "Enter":
-        event.preventDefault()
-        this.#clickSelected()
-        break
-    }
-  }
-
-  #prev() {
-    if (this.indexValue > 0) {
-      this.indexValue--
-      this.#selectCurrentOption()
-    }
-  }
-
-  #next() {
-    if (this.indexValue < this.#lastIndex) {
-      this.indexValue++
-      this.#selectCurrentOption()
-    }
-  }
-
-  #clickSelected() {
-    this.#visibleOptions[this.indexValue]?.click()
-  }
-
-  #removeTabstops() {
-    this.optionTargets.forEach(e => e.tabIndex = -1)
-  }
-
-  #selectFirstOption() {
-    this.optionTargets.forEach((element, index) => {
-      element.ariaSelected = index === 0
-    })
-  }
-
-  #selectCurrentOption() {
-    this.optionTargets.forEach((element, index) => {
-      element.ariaSelected = false
-    })
-
-    this.#visibleOptions.forEach((element, index) => {
-      element.ariaSelected = index === this.indexValue
-    })
-  }
-
-  get #visibleOptions() {
-    return this.optionTargets.filter(e => e.offsetParent != null)
-  }
-
-  get #lastIndex() {
-    return this.#visibleOptions.length -1
-  }
-}