lato 3.14.9 → 3.15.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 3f424fc472d1089710195d8c872e462f4418c010fb452725d7f566ea7bd8b475
-  data.tar.gz: 5610d6b09ba78c999ea26e0acddf49855e836fca77c5ffc00438064f43cf4b91
+  metadata.gz: a16695350bb974f347a29439898cade24c9447d2fa239468fd9309165295c41c
+  data.tar.gz: ba68397002e0adc6d2f07d36f574157d15a75ac817620a172b6885c7541411c4
 SHA512:
-  metadata.gz: df88eb580c7e43b08baec394249349e540dbc7ffdd1b0ef170db037ede14368a8d3f876e1a4333f41a6b61f7ee8e746290ece67b335d2f5844be80f2b6637b93
-  data.tar.gz: b3c24f61a461e6fc47eb8a2d6605eb42c73d3fb9be81946d31d5257404140874aacde6360ea0de1066ce69f6c60a843239cfed23a77792c7641ed17547da8427
+  metadata.gz: cbd1f1c3aa108c5bd9ccccff548705a32946fe3978ee6a9d5af009a82d79229f75371882444c117c0e704ef5259bbb08e60c3476608bd2ec94506e9474a600c4
+  data.tar.gz: 14714a2de245b82ae0abbbeb1ba859c5b1ebc74af64fc00a511d002a5625904e833d2277a9333284ded22894310d2eb95d6aab6b803d8e506f72d1cbcd0fa188

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

@@ -0,0 +1,212 @@
+import { Controller } from "@hotwired/stimulus"
+import { DirectUpload } from "@rails/activestorage"
+
+export default class extends Controller {
+  static targets = ["input", "dropzone", "preview"]
+  static values = {
+    multiple: Boolean,
+    directUpload: Boolean
+  }
+
+  connect() {
+    this.files = []
+    
+    if (this.directUploadValue) {
+      this.inputName = this.inputTarget.name
+      this.inputTarget.removeAttribute('name')
+    }
+
+    // Initialize files from input if any (e.g. browser back button)
+    if (this.inputTarget.files.length > 0) {
+      this.handleFiles(Array.from(this.inputTarget.files))
+    }
+  }
+
+  onClick(e) {
+    this.inputTarget.click()
+  }
+
+  onDragOver(e) {
+    e.preventDefault()
+    this.dropzoneTarget.classList.add("opacity-75")
+  }
+
+  onDragLeave(e) {
+    e.preventDefault()
+    this.dropzoneTarget.classList.remove("opacity-75")
+  }
+
+  onDrop(e) {
+    e.preventDefault()
+    this.dropzoneTarget.classList.remove("opacity-75")
+
+    if (e.dataTransfer.files.length > 0) {
+      this.handleFiles(Array.from(e.dataTransfer.files))
+    }
+  }
+
+  onInputChange(e) {
+    if (this.inputTarget.files.length > 0) {
+      // When input changes via dialog, we add these files.
+      // Note: standard input behavior replaces files.
+      // We treat the input selection as "new files to add" if multiple, or "replace" if single.
+      // But since we can't easily distinguish "add" vs "replace" intent from a simple change event on the same input,
+      // and the input itself only holds the new selection, we have to be careful.
+      
+      // Strategy:
+      // 1. Read new files from input.
+      // 2. Update our internal list.
+      // 3. Update the input to reflect the FULL list (so form submit works for normal uploads).
+      
+      const newFiles = Array.from(this.inputTarget.files)
+      this.handleFiles(newFiles)
+    }
+  }
+
+  handleFiles(newFiles) {
+    if (this.multipleValue) {
+      // Filter duplicates if needed, or just add.
+      // For simplicity, just add.
+      this.files = [...this.files, ...newFiles]
+    } else {
+      this.files = newFiles
+    }
+    
+    this.updateInput()
+    this.updatePreview()
+    
+    if (this.directUploadValue) {
+      this.uploadFiles(newFiles)
+    }
+  }
+
+  updateInput() {
+    const dataTransfer = new DataTransfer()
+    this.files.forEach(file => dataTransfer.items.add(file))
+    this.inputTarget.files = dataTransfer.files
+  }
+
+  updatePreview() {
+    this.previewTarget.innerHTML = ""
+    this.files.forEach((file, index) => {
+      const fileElement = document.createElement("div")
+      fileElement.classList.add("d-flex", "align-items-center", "justify-content-between", "p-2", "border", "rounded", "mb-2")
+      
+      const info = document.createElement("div")
+      info.classList.add("d-flex", "align-items-center")
+      
+      const icon = document.createElement("i")
+      icon.classList.add("bi", "bi-file-earmark", "fs-4", "me-2")
+      
+      const name = document.createElement("span")
+      name.textContent = file.name
+      name.classList.add("text-truncate")
+      name.style.maxWidth = "200px"
+      
+      info.appendChild(icon)
+      info.appendChild(name)
+      
+      const rightSide = document.createElement("div")
+      rightSide.classList.add("d-flex", "align-items-center")
+
+      // Progress bar container
+      if (this.directUploadValue) {
+        const progressContainer = document.createElement("div")
+        progressContainer.classList.add("me-3")
+        progressContainer.style.width = "100px"
+        progressContainer.id = `upload-progress-${this.getFileId(file)}`
+        progressContainer.style.display = "none"
+        
+        const progressBar = document.createElement("div")
+        progressBar.classList.add("progress")
+        progressBar.style.height = "5px"
+        
+        const progressBarInner = document.createElement("div")
+        progressBarInner.classList.add("progress-bar")
+        progressBarInner.role = "progressbar"
+        progressBarInner.style.width = "0%"
+        
+        progressBar.appendChild(progressBarInner)
+        progressContainer.appendChild(progressBar)
+        rightSide.appendChild(progressContainer)
+      }
+
+      const removeBtn = document.createElement("button")
+      removeBtn.type = "button"
+      removeBtn.classList.add("btn", "btn-sm", "btn-outline-danger")
+      removeBtn.innerHTML = '<i class="bi bi-x"></i>'
+      removeBtn.onclick = (e) => {
+        e.stopPropagation()
+        this.removeFile(index)
+      }
+      
+      rightSide.appendChild(removeBtn)
+      fileElement.appendChild(info)
+      fileElement.appendChild(rightSide)
+      
+      this.previewTarget.appendChild(fileElement)
+    })
+  }
+
+  removeFile(index) {
+    const file = this.files[index]
+    
+    if (this.directUploadValue) {
+      const hiddenInput = this.element.querySelector(`input[type="hidden"][data-file-id="${this.getFileId(file)}"]`)
+      if (hiddenInput) hiddenInput.remove()
+    }
+
+    this.files.splice(index, 1)
+    this.updateInput()
+    this.updatePreview()
+  }
+
+  getFileId(file) {
+    return `${file.name.replace(/[^a-zA-Z0-9]/g, '')}-${file.lastModified}`
+  }
+
+  uploadFiles(files) {
+    const url = this.inputTarget.dataset.directUploadUrl
+    if (!url) return
+
+    files.forEach(file => {
+      const progressId = `upload-progress-${this.getFileId(file)}`
+      
+      const delegate = {
+        directUploadWillStoreFileWithXHR: (request) => {
+          request.upload.addEventListener("progress", (event) => {
+            const element = document.getElementById(progressId)
+            if (element) {
+              element.style.display = "block"
+              const progress = (event.loaded / event.total) * 100
+              element.querySelector(".progress-bar").style.width = `${progress}%`
+            }
+          })
+        }
+      }
+      
+      const upload = new DirectUpload(file, url, delegate)
+      
+      upload.create((error, blob) => {
+        if (error) {
+          const element = document.getElementById(progressId)
+          if (element) {
+             element.querySelector(".progress-bar").classList.add("bg-danger")
+          }
+        } else {
+          const element = document.getElementById(progressId)
+          if (element) {
+             element.querySelector(".progress-bar").classList.add("bg-success")
+             
+             const hiddenInput = document.createElement("input")
+             hiddenInput.type = "hidden"
+             hiddenInput.name = this.inputName
+             hiddenInput.value = blob.signed_id
+             hiddenInput.dataset.fileId = this.getFileId(file)
+             this.element.appendChild(hiddenInput)
+          }
+        }
+      })
+    })
+  }
+}

data/app/helpers/lato/components_helper.rb

@@ -202,6 +202,12 @@ module Lato
       form.file_field key, options
     end
 
+    def lato_form_item_input_file_dropzone(form, key, options = {})
+      _lato_form_input_options(form, key, options, :change, '')
+
+      render 'lato/components/form_item_input_file_dropzone', form: form, key: key, options: options
+    end
+
     def lato_form_item_input_textarea(form, key, options = {})
       _lato_form_input_options(form, key, options, :keyup, 'form-control')
 

data/app/views/lato/components/_form_item_input_file_dropzone.html.erb

@@ -0,0 +1,48 @@
+<%
+form ||= nil
+key ||= nil
+options ||= {}
+
+multiple = options[:multiple] || false
+direct_upload = options[:direct_upload] || false
+
+# Merge classes
+input_classes = options[:class] || []
+input_classes = input_classes.is_a?(Array) ? input_classes : input_classes.split(' ')
+input_classes.push('d-none')
+
+# Merge data attributes
+input_data = options[:data] || {}
+input_data[:lato_input_dropzone_target] = 'input'
+current_action = input_data[:action] || ''
+input_data[:action] = "#{current_action} change->lato-input-dropzone#onInputChange".strip
+
+input_options = options.merge(
+  class: input_classes,
+  data: input_data
+)
+%>
+
+<div class="lato-input-dropzone mb-3"
+     data-controller="lato-input-dropzone"
+     data-lato-input-dropzone-multiple-value="<%= multiple %>"
+     data-lato-input-dropzone-direct-upload-value="<%= direct_upload %>">
+
+  <%= form.file_field key, input_options %>
+
+  <div class="border rounded p-4 text-center cursor-pointer position-relative"
+       style="border-style: dashed !important; border-width: 2px !important;"
+       data-lato-input-dropzone-target="dropzone"
+       data-action="click->lato-input-dropzone#onClick dragover->lato-input-dropzone#onDragOver dragleave->lato-input-dropzone#onDragLeave drop->lato-input-dropzone#onDrop">
+    
+    <div class="text-muted pointer-events-none">
+      <i class="bi bi-cloud-arrow-up fs-1"></i>
+      <div class="mt-2">
+        <%= I18n.t('lato.dropzone_drag_and_drop_or_click') %>
+      </div>
+    </div>
+  </div>
+
+  <div class="file-list mt-3" data-lato-input-dropzone-target="preview"></div>
+</div>
+

data/app/views/lato/components/_index.html.erb

@@ -27,7 +27,7 @@ total_pages = collection.empty? ? params["#{key}_page"]&.to_i : 999_999_999 if s
             ><i class="bi bi-search"></i></button>
           </div>
         <% else %>
-          <div></div>
+          <div class="w-100"></div>
         <% end %>
         
         <% if custom_actions.any? %>
@@ -105,7 +105,7 @@ total_pages = collection.empty? ? params["#{key}_page"]&.to_i : 999_999_999 if s
     <% else %>
 
       <div class="table-responsive">
-        <table class="table table-striped table-bordered">
+        <table class="table table-striped table-bordered mb-0">
           <thead>
             <tr class="align-middle">
               <% columns.each do |column| %>

data/config/importmap.rb

@@ -1,6 +1,8 @@
 pin "lato/application", to: "lato/application.js"
 pin_all_from Lato::Engine.root.join("app/assets/javascripts/lato/controllers"), under: "controllers", to: "lato/controllers"
 
+pin "@rails/activestorage", to: "activestorage.esm.js", preload: true
+
 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/config/locales/en.yml

@@ -70,6 +70,7 @@ en:
     operation_completed_subtitle: The operation has been completed successfully
     operation_failed_title: Operation failed
     operation_failed_subtitle: The operation has failed because of an error
+    dropzone_drag_and_drop_or_click: Drag and drop files here or click to upload
 
     invitation_mailer:
       invite_mail_subject: You received an invitation

data/config/locales/fr.yml

@@ -72,6 +72,7 @@ fr:
     operation_completed_subtitle: L'opération a été réalisée avec succès
     operation_failed_title: Échec de l'opération
     operation_failed_subtitle: Une erreur s'est produite lors de l'opération
+    dropzone_drag_and_drop_or_click: Faites glisser et déposez les fichiers ici ou cliquez pour télécharger
 
     invitation_mailer:
       invite_mail_subject: Vous avez reçu une invitation

data/config/locales/it.yml

@@ -72,6 +72,7 @@ it:
     operation_completed_subtitle: L'operazione è stata completata con successo
     operation_failed_title: Operazione fallita
     operation_failed_subtitle: Si è verificato un errore durante l'operazione
+    dropzone_drag_and_drop_or_click: Trascina qui i file o clicca per caricare
 
     invitation_mailer:
       invite_mail_subject: Hai ricevuto un invito

data/config/locales/ro.yml

@@ -72,6 +72,7 @@ ro:
     operation_completed_subtitle: Operația a fost finalizată cu succes
     operation_failed_title: Operație eșuată
     operation_failed_subtitle: A apărut o eroare în timpul operației
+    dropzone_drag_and_drop_or_click: Trage și plasează fișiere aici sau fă clic pentru a le încărca
 
     invitation_mailer:
       invite_mail_subject: Ai primit o invitație

data/lib/lato/version.rb

@@ -1,3 +1,3 @@
 module Lato
-  VERSION = "3.14.9"
+  VERSION = "3.15.0"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: lato
 version: !ruby/object:Gem::Version
-  version: 3.14.9
+  version: 3.15.0
 platform: ruby
 authors:
 - Gregorio Galante
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-11-16 00:00:00.000000000 Z
+date: 2025-11-25 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -167,6 +167,7 @@ files:
 - app/assets/javascripts/lato/controllers/lato_index_controller.js
 - app/assets/javascripts/lato/controllers/lato_input_autocomplete2_controller.js
 - app/assets/javascripts/lato/controllers/lato_input_autocomplete_controller.js
+- app/assets/javascripts/lato/controllers/lato_input_dropzone_controller.js
 - app/assets/javascripts/lato/controllers/lato_network_controller.js
 - app/assets/javascripts/lato/controllers/lato_operation_controller.js
 - app/assets/javascripts/lato/controllers/lato_tooltip_controller.js
@@ -222,6 +223,7 @@ files:
 - app/views/lato/authentication/update_password.html.erb
 - app/views/lato/authentication/verify_email.html.erb
 - app/views/lato/authentication/web3_signin.html.erb
+- app/views/lato/components/_form_item_input_file_dropzone.html.erb
 - app/views/lato/components/_index.html.erb
 - app/views/lato/components/_navbar_nav_item.html.erb
 - app/views/lato/components/_navbar_nav_locales_item.html.erb