lato 0.1.47 → 0.1.48

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: bd2a16b3cd379e5f7c8fc085e35c16a1111ecfd1e2284ce8c055d8a42f52b242
-  data.tar.gz: 1c05f2dd442acb6a2d5139474634c2cd79e97a3c716e13fb95428b5ae5af52de
+  metadata.gz: 1b950d52eacb976f1c5c268d08e601c3a4c5cd3b3c92b5bdedc56ef5ba0daeb8
+  data.tar.gz: 99410bc99efc35de36892b57d19d768d94cf7489867b5d0fef82f7d8ca604b5d
 SHA512:
-  metadata.gz: ef997bd4a6a83abed77335af0a80e3466e3457864b8c35b203a36814ca6bde3054fded2471164518fd8ddbc2b9b95919bb4d11a98e965ecde84f59b0a5a66d1b
-  data.tar.gz: 5925fa2fd8c4e077ce9d8d3281e48eade697567d5ac4ea1788e65b6e917bdbea13f41e4f3523e67df7472b9c63890e9dea8b03ec940d14061890b01bae31f94e
+  metadata.gz: 3b232a44f90d3f38f7d0e8321d2085a9d7d7bf7a4aae52ed0160d2cb8d2b654f2e549164eb3e0c15c8623e9f30b097f736d5e96838fb61109a25fceeece75536
+  data.tar.gz: '0588148e4e64b91b9b92ab609ab95439ab3a08e1e5bfd1d661166f4654cbebdf913dc69b035a0b00027907870e8d5b5214c38a8f1b3ceb8e48c994783224ecdb'

data/app/assets/javascripts/lato/controllers/lato_input_autocomplete_controller.js

@@ -0,0 +1,51 @@
+import { Controller } from "@hotwired/stimulus"
+import _ from 'lodash'
+
+export default class extends Controller {
+  static values = {
+    path: String
+  }
+
+  /**
+   * Stimulus
+   */
+
+  connect() {
+    this.search = _.debounce(this.search, 500)
+    this.datalist = document.createElement('datalist')
+    this.datalist.id = Math.random().toString(36)
+    this.element.setAttribute('list', this.datalist.id)
+    this.element.parentNode.appendChild(this.datalist)
+
+    this.element.addEventListener('keyup', (e) => {
+      this.search(e.target.value)
+    })
+  }
+
+  async search(value) {
+    if (!value || value.length < 3) return this.clear()
+
+    try {
+      const response = await fetch(this.pathValue + '?q=' + value)
+      const data = await response.json()
+      this.suggest(data)
+    } catch (err) {
+      console.error(err)
+      this.clear()
+    }
+  }
+
+  suggest(data = []) {
+    this.clear()
+
+    data.forEach((item) => {
+      const option = document.createElement('option')
+      option.value = item
+      this.datalist.appendChild(option)
+    })
+  }
+
+  clear() {
+    this.datalist.innerHTML = ''
+  }
+}

data/config/importmap.rb

@@ -3,3 +3,4 @@ pin_all_from Lato::Engine.root.join("app/assets/javascripts/lato/controllers"),
 
 pin "bootstrap", to: "bootstrap.js", preload: true
 # pin "@popperjs/core", to: "popper.js", preload: true
+pin "lodash", to: "https://ga.jspm.io/npm:lodash@4.17.21/lodash.js"

data/lib/lato/version.rb

@@ -1,3 +1,3 @@
 module Lato
-  VERSION = "0.1.47"
+  VERSION = "0.1.48"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: lato
 version: !ruby/object:Gem::Version
-  version: 0.1.47
+  version: 0.1.48
 platform: ruby
 authors:
 - Gregorio Galante
@@ -117,6 +117,7 @@ files:
 - app/assets/javascripts/lato/controllers/lato_feedback_controller.js
 - app/assets/javascripts/lato/controllers/lato_form_controller.js
 - app/assets/javascripts/lato/controllers/lato_hello_controller.js
+- app/assets/javascripts/lato/controllers/lato_input_autocomplete_controller.js
 - app/assets/javascripts/lato/controllers/lato_operation_controller.js
 - app/assets/stylesheets/lato/application.scss
 - app/controllers/concerns/lato/componentable.rb