css-zero 0.0.81 → 0.0.83

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: '093a0bb191b8b84a8caa29e3a141fba1cf4680150a26960134fa63fd06b42294'
-  data.tar.gz: d1e303641e4f440a1ac65545946bbaff931ad31cdb49150bf7cdd270ecf2e3b3
+  metadata.gz: 71c3c38650e2b111579da72c2349589c5ae2bd114223701b7dd6dc2459136b35
+  data.tar.gz: 19401b13fa751a752893c70e9d9b84d641984a510fd66e246e188054360edbb1
 SHA512:
-  metadata.gz: 5f54e73025fb075cfe9b876f3c7ea4ce83e4687053a8595034459cd2ef59aea41c8e44869929a9840bacac3eef4d5f9ed963982d155930790d559b651faa4951
-  data.tar.gz: 584b223cf4b28bf706a1ebeab29b750dbbf1207aa0014285d7662106ec1ea9135b7f7b85502e5735cd9e432583f61649f045c7b08db96b22db31dd61b6fda5b3
+  metadata.gz: d67f8fb7778c60e40e7bfcedd7524b6296091777561e48c60c267d1c4bef5969f124c8b80ccd37a1f28f2da8d7e9988e8d9d3b90fbc67e9d4e70c904aabf4c51
+  data.tar.gz: 52d1ebd7224d43b4a4d67cd9b473fbbd60f849cfe02f56b8abecd3cdb8c02f460d6f8795411a7a22fd08234e0f0958e8de7bd263ca5059bb09809d9c623bf877

data/lib/css_zero/version.rb

@@ -1,3 +1,3 @@
 module CssZero
-  VERSION = "0.0.81"
+  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/assets/stylesheets/prose.css

@@ -7,37 +7,37 @@
   -webkit-font-smoothing: antialiased;
 
   :is(h1, h2, h3, h4, h5, h6) {
-    font-weight: 800;
+    font-weight: var(--font-extrabold);
     hyphens: auto;
     letter-spacing: -0.02ch;
     line-height: 1.1;
-    margin-block: 0.65em;
+    margin-block: 0.5em;
     overflow-wrap: break-word;
     text-wrap: balance;
   }
 
   h1 {
-    font-size: 2.25em;
+    font-size: 2.4em;
   }
 
   h2 {
-    font-size: 1.5em;
+    font-size: 1.8em;
   }
 
   h3 {
-    font-size: 1.125em;
+    font-size: 1.5em;
   }
 
   h4 {
-    font-size: 1em;
+    font-size: 1.2em;
   }
 
   h5 {
-    font-size: 0.875em;
+    font-size: 1em;
   }
 
   h6 {
-    font-size: 0.75em;
+    font-size: 0.9em;
   }
 
   :is(ul, ol, menu) {
@@ -58,13 +58,13 @@
   }
 
   :is(b, strong) {
-    font-weight: 700;
+    font-weight: var(--font-bold);
   }
 
   :is(pre, code) {
     background-color: var(--color-border-light);
     border: 1px solid var(--color-border);
-    border-radius: 0.3em;
+    border-radius: var(--rounded);
     font-family: var(--font-monospace-code);
     font-size: 0.85em;
   }
@@ -108,7 +108,7 @@
   }
 
   th {
-    font-weight: 700;
+    font-weight: var(--font-bold);
   }
 
   :is(th, td) {

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.81
+  version: 0.0.83
 platform: ruby
 authors:
 - Lázaro Nixon
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-01-07 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
-  }
-}