formstrap 0.4.1 → 0.4.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 47528e297776dc1c0bfaf1d0d15fcbe65a6872631c1275d4cfcd1af722b92bad
-  data.tar.gz: b8002a2e136bc2b14ae89b41a7641d9562cf23a151d6f37c94bb07d7fdcbcc99
+  metadata.gz: ee49a6e7a9f068d3403b4ebfd46c19cf07b6c293e8893f1e561e8ae20ed0af77
+  data.tar.gz: f85517d919e6c9360ac31c7f1aa7b8f2ff3705ea31a2a6a76f0b72ae82f58c30
 SHA512:
-  metadata.gz: 402ca1e7525e7847453c7026d46828c6c60f73020cd77d927757cdbbecfbb29e3dbfad79cc08b3ffcb1e95be5b66d490fa437f4d52eda80c1180a68f2e7d5b6f
-  data.tar.gz: 764ed214b9c39f07a01a7028b0a2b65ef4c3719717db522efd86936231eba94151f008d81274920af8d697ececef6fc60deca7ab3db0bfaa9c82b9ae4c727301
+  metadata.gz: ab80f8fd25603f0c9ce6f5ea6c92dc025b62f7b932f0b0e7bd7867bd4432845f902a6f5f7ba6492a6455ae9f3eb93fe411497a9dc2cf346538e3a610a05fd253
+  data.tar.gz: a5db302d1730c5f0cb801ddf248d24a0c5111ec0f8ae6d7aaa24d5a36c0e50913f1939a71df275c47429016162b59e47024a4be0e186e23b661c3393321cb9e4

data/app/assets/javascripts/formstrap/controllers/media_controller.js

@@ -3,22 +3,20 @@ import { Controller } from '@hotwired/stimulus'
 import Sortable from 'sortablejs'
 
 export default class extends Controller {
+  static get values () {
+    return {
+      name: String
+    }
+  }
+
   static get targets () {
     return ['item', 'template', 'thumbnails', 'modalButton', 'placeholder', 'count', 'editButton', 'validationInput']
   }
 
   connect () {
-    document.addEventListener('mediaSelectionSubmitted', (event) => {
-      if (event.detail.name === this.element.dataset.name) {
-        this.selectItems(event.detail.items)
-      }
-    })
-
-    // Init sorting
-    if (this.hasSorting()) {
-      this.initSortable()
-    }
-
+    this.randomizeName()
+    this.listenForMediaSelection()
+    this.initializeSorting()
     this.validate()
   }
 
@@ -48,6 +46,34 @@ export default class extends Controller {
   }
 
   // Methods
+  randomizeName () {
+    this.nameValue = crypto.randomUUID().substring(0, 8)
+    this.updateModalButtonUrls()
+  }
+
+  updateModalButtonUrls () {
+    this.modalButtonTargets.forEach((button) => {
+      const url = new URL(button.getAttribute('href'))
+      url.searchParams.set('name', this.nameValue)
+      button.setAttribute('href', url.toString())
+    })
+  }
+
+  listenForMediaSelection () {
+    document.addEventListener('mediaSelectionSubmitted', (event) => {
+      if (event.detail.name === this.nameValue) {
+        this.selectItems(event.detail.items)
+        this.updateModalButtonUrls()
+      }
+    })
+  }
+
+  initializeSorting () {
+    if (this.hasSorting()) {
+      this.initSortable()
+    }
+  }
+
   initSortable () {
     Sortable.create(this.thumbnailsTarget, {
       handle: '.media-drag-sort-handle',
@@ -171,9 +197,8 @@ export default class extends Controller {
 
   createItem (item) {
     // Copy template
-    const template = this.templateTarget
-    const html = this.randomizeIds(template)
-    this.thumbnailsTarget.insertAdjacentHTML('beforeend', html)
+    const templateHtml = this.templateTarget.innerHTML
+    this.thumbnailsTarget.insertAdjacentHTML('beforeend', templateHtml)
 
     // Set new values
     const newItem = this.itemTargets.pop()
@@ -192,12 +217,6 @@ export default class extends Controller {
     oldThumbnail.parentNode.replaceChild(newThumbnail, oldThumbnail)
   }
 
-  randomizeIds (template) {
-    const regex = new RegExp(template.dataset.templateIdRegex, 'g')
-    const randomNumber = crypto.randomUUID().substring(0, 8)
-    return template.innerHTML.replace(regex, randomNumber)
-  }
-
   removeAllDeselectedItems (items) {
     this.removeDeselectedItems(items, this.itemTargets)
   }

data/app/assets/javascripts/formstrap/controllers/select_controller.js

@@ -4,7 +4,7 @@ import I18n from '../config/i18n'
 
 export default class extends Controller {
   connect () {
-    if (this.element.hasAttribute('multiple')) {
+    if (this.element.hasAttribute('multiple') || this.element.dataset.tomSelect === 'true') {
       this.initTomSelect()
     }
   }

data/app/assets/javascripts/formstrap.js

@@ -11076,18 +11076,18 @@ var sortable_esm_default = Sortable;
 
 // app/assets/javascripts/formstrap/controllers/media_controller.js
 var media_controller_default = class extends Controller {
+  static get values() {
+    return {
+      name: String
+    };
+  }
   static get targets() {
     return ["item", "template", "thumbnails", "modalButton", "placeholder", "count", "editButton", "validationInput"];
   }
   connect() {
-    document.addEventListener("mediaSelectionSubmitted", (event) => {
-      if (event.detail.name === this.element.dataset.name) {
-        this.selectItems(event.detail.items);
-      }
-    });
-    if (this.hasSorting()) {
-      this.initSortable();
-    }
+    this.randomizeName();
+    this.listenForMediaSelection();
+    this.initializeSorting();
     this.validate();
   }
   destroy(event) {
@@ -11106,6 +11106,30 @@ var media_controller_default = class extends Controller {
       button.setAttribute("href", url.toString());
     });
   }
+  randomizeName() {
+    this.nameValue = crypto.randomUUID().substring(0, 8);
+    this.updateModalButtonUrls();
+  }
+  updateModalButtonUrls() {
+    this.modalButtonTargets.forEach((button) => {
+      const url = new URL(button.getAttribute("href"));
+      url.searchParams.set("name", this.nameValue);
+      button.setAttribute("href", url.toString());
+    });
+  }
+  listenForMediaSelection() {
+    document.addEventListener("mediaSelectionSubmitted", (event) => {
+      if (event.detail.name === this.nameValue) {
+        this.selectItems(event.detail.items);
+        this.updateModalButtonUrls();
+      }
+    });
+  }
+  initializeSorting() {
+    if (this.hasSorting()) {
+      this.initSortable();
+    }
+  }
   initSortable() {
     sortable_esm_default.create(this.thumbnailsTarget, {
       handle: ".media-drag-sort-handle",
@@ -11197,9 +11221,8 @@ var media_controller_default = class extends Controller {
     item.classList.remove("d-none");
   }
   createItem(item) {
-    const template = this.templateTarget;
-    const html = this.randomizeIds(template);
-    this.thumbnailsTarget.insertAdjacentHTML("beforeend", html);
+    const templateHtml = this.templateTarget.innerHTML;
+    this.thumbnailsTarget.insertAdjacentHTML("beforeend", templateHtml);
     const newItem = this.itemTargets.pop();
     newItem.querySelector('input[name*="[blob_id]"]').value = item.blobId;
     newItem.querySelector('input[name*="[_destroy]"]').value = false;
@@ -11211,11 +11234,6 @@ var media_controller_default = class extends Controller {
     const newThumbnail = item.thumbnail.cloneNode(true);
     oldThumbnail.parentNode.replaceChild(newThumbnail, oldThumbnail);
   }
-  randomizeIds(template) {
-    const regex = new RegExp(template.dataset.templateIdRegex, "g");
-    const randomNumber = crypto.randomUUID().substring(0, 8);
-    return template.innerHTML.replace(regex, randomNumber);
-  }
   removeAllDeselectedItems(items) {
     this.removeDeselectedItems(items, this.itemTargets);
   }
@@ -13374,7 +13392,7 @@ var repeater_controller_default = class extends Controller {
 var import_tom_select = __toESM(require_tom_select_complete());
 var select_controller_default = class extends Controller {
   connect() {
-    if (this.element.hasAttribute("multiple")) {
+    if (this.element.hasAttribute("multiple") || this.element.dataset.tomSelect === "true") {
       this.initTomSelect();
     }
   }

data/app/assets/stylesheets/formstrap/vendor/overrides/redactor.scss

@@ -15,7 +15,6 @@
 }
 
 .rx-container {
-  overflow: hidden;
   padding: 0 !important;
   border: var(--bs-border-width) solid var(--bs-border-color);
   border-radius: var(--bs-border-radius);

data/app/assets/stylesheets/formstrap.css

@@ -1299,7 +1299,6 @@ span.flatpickr-weekday {
   --bs-input-focus-color: var(--bs-body-color);
 }
 .rx-container {
-  overflow: hidden;
   padding: 0 !important;
   border: var(--bs-border-width) solid var(--bs-border-color);
   border-radius: var(--bs-border-radius);

data/app/models/formstrap/media_view.rb

@@ -18,7 +18,6 @@ module Formstrap
         class: ["mb-3", ("form-floating" if float)],
         data: {
           controller: "media",
-          name: name,
           sort: sort,
           accept: accept,
           required: required.nil? ? 0 : required
@@ -122,7 +121,7 @@ module Formstrap
     end
 
     def modal_url
-      formstrap_media_path(
+      formstrap_media_url(
         name: name,
         ids: blob_ids,
         min: min,

data/app/models/formstrap/redactor_view.rb

@@ -28,8 +28,6 @@ module Formstrap
         theme: "light",
         # Popup when highlighting text
         context: false,
-        # Top toolbar
-        toolbar: true,
         popups: {
           # Options in addbar popup (press + button)
           addbar: %w[format bold italic deleted list table link embed],

data/app/models/formstrap/wysiwyg_view.rb

@@ -11,13 +11,16 @@ module Formstrap
     end
 
     def default_options
-      {
+      options = {
         redactor: {
           context: !toolbar,
           extrabar: toolbar,
-          toolbar: toolbar
         }
       }
+
+      options[:redactor][:toolbar] = false if @toolbar == false
+
+      options
     end
   end
 end

data/lib/formstrap/version.rb

@@ -1,3 +1,3 @@
 module Formstrap
-  VERSION = "0.4.1"
+  VERSION = "0.4.2"
 end

data/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@frontierdotbe/formstrap",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "description": "Bootstrap-powered Form Helpers",
   "module": "app/assets/javascripts/formstrap.js",
   "main": "app/assets/javascripts/formstrap.js",

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: formstrap
 version: !ruby/object:Gem::Version
-  version: 0.4.1
+  version: 0.4.2
 platform: ruby
 authors:
 - Jef Vlamings
 autorequire:
 bindir: exe
 cert_chain: []
-date: 2024-05-16 00:00:00.000000000 Z
+date: 2024-06-27 00:00:00.000000000 Z
 dependencies: []
 description: An extensive Bootstrap form library to power your Ruby On Rails application.
 email: