bard-tag_field 0.4.1 → 0.4.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: fbfde3758dcf03243548db95eb9901f43cbcccbe5eac3a2dc1d64ecee31aaa60
-  data.tar.gz: d7f453d7ad5f9ac62b3a41ae5d8304c8bb01d230059ad630641440b6949622a3
+  metadata.gz: 7a90b26ef508ec001cae14170b6ce96c543d6610c984622a1a2f3d9722c3e713
+  data.tar.gz: 5bafffc31b38325321042c768d96cb9d4b7f829a8d05f803d9f6bb96d38c85e1
 SHA512:
-  metadata.gz: c30cc6a3b8d25fc4a3c9ca0a17c548ae13c785ac437ffbdae5bddfdd3e1f96d95fee9987e2096888cf561e1c9d64ab555124118d24fc35b50afea0e549295d8b
-  data.tar.gz: f521b1e6907f65230310c1a17890a07519da7756efc9ad3b6f2f1047c5d9ec2874b597e2aaf9dc066c6bb4a77104416694593935b096d1e788a67bd5c0675083
+  metadata.gz: ca88e6931e551b19f280e6ecec610251c44b7778ebc88b93693ce3b9a3f05df800d9743b5bf58bf9d97f45bb542be0fae5e8a64ad6d04a5dbd813dac455eeb79
+  data.tar.gz: 61013f52ca3daadefc24a4d1a7f3346d392a31ebefd2c144ddd2490975d4a51a6d27d840fb818bdbdf463256661f1dd655915e7e6f2c237c5b4f99f16ad7e402

data/app/assets/javascripts/input-tag.js

@@ -1120,8 +1120,17 @@ class InputTag extends HTMLElement {
 
   processTagOptions() {
     if(!this._taggle || !this._taggle.tag) return
-    const tagOptions = Array.from(this.children).filter(e => e.tagName === 'TAG-OPTION');
-    const values = tagOptions.map(e => e.value).filter(value => value !== null && value !== undefined);
+    let tagOptions = Array.from(this.children).filter(e => e.tagName === 'TAG-OPTION');
+    let values = tagOptions.map(e => e.value).filter(value => value !== null && value !== undefined);
+
+    // Enforce maxTags constraint for single mode
+    if (!this.multiple && values.length > 1) {
+      // Remove excess tag-options from DOM (keep only the first one)
+      tagOptions.slice(1).forEach(el => el.remove());
+      tagOptions = tagOptions.slice(0, 1);
+      values = values.slice(0, 1);
+    }
+
     this._taggle.tag.elements = tagOptions;
     this._taggle.tag.values = values;
     this._inputPosition = this._taggle.tag.values.length;
@@ -1136,6 +1145,9 @@ class InputTag extends HTMLElement {
 
     // Update internal value to match
     this.updateValue();
+
+    // Ensure input visibility is updated when tags change via DOM
+    this.updateInputVisibility();
   }
 
   get form() {
@@ -1146,9 +1158,13 @@ class InputTag extends HTMLElement {
     return this.getAttribute("name");
   }
 
+  get multiple() {
+    return this.hasAttribute('multiple');
+  }
+
   get value() {
     const internalValue = this._internals.value;
-    if (this.hasAttribute('multiple')) {
+    if (this.multiple) {
       return internalValue; // Return array for multiple mode
     } else {
       return internalValue.length > 0 ? internalValue[0] : ''; // Return string for single mode
@@ -1173,7 +1189,7 @@ class InputTag extends HTMLElement {
     values.forEach(value => formData.append(this.name, value));
     // For single mode, append empty string when no values (like standard HTML inputs)
     // For multiple mode, leave empty (like standard HTML multiple selects)
-    if (values.length === 0 && !this.hasAttribute('multiple')) {
+    if (values.length === 0 && !this.multiple) {
       formData.append(this.name, "");
     }
     this._internals.setFormValue(formData);
@@ -1379,7 +1395,6 @@ class InputTag extends HTMLElement {
     this.inputTarget = this.shadowRoot.querySelector("#inputTarget");
 
     this.required = this.hasAttribute("required");
-    this.multiple = this.hasAttribute("multiple");
 
     const maxTags = this.multiple ? undefined : 1;
     const placeholder = this.inputTarget.getAttribute("placeholder");
@@ -1443,6 +1458,12 @@ class InputTag extends HTMLElement {
       },
       render: item => h(`<li class="ui-menu-item" data-value="${item.value}">${item.label}</li>`),
       onSelect: item => {
+        // Prevent adding multiple tags in single mode
+        if (!this.multiple && this._taggle.getTagValues().length > 0) {
+          this._taggleInputTarget.value = '';
+          return
+        }
+
         // Create a tag-option element with proper value/label separation
         const tagOption = document.createElement('tag-option');
         tagOption.setAttribute('value', item.value);
@@ -1580,7 +1601,7 @@ class InputTag extends HTMLElement {
     values.forEach(value => formData.append(this.name, value));
     // For single mode, append empty string when no values (like standard HTML inputs)
     // For multiple mode, leave empty (like standard HTML multiple selects)
-    if (values.length === 0 && !this.hasAttribute('multiple')) {
+    if (values.length === 0 && !this.multiple) {
       formData.append(this.name, "");
     }
     this._internals.setFormValue(formData);
@@ -1643,10 +1664,9 @@ class InputTag extends HTMLElement {
   updateInputVisibility() {
     if (!this._taggleInputTarget || !this.buttonTarget) return;
 
-    const isMultiple = this.hasAttribute('multiple');
     const hasTags = this._taggle && this._taggle.getTagValues().length > 0;
 
-    if (isMultiple) {
+    if (this.multiple) {
       // Multiple mode: always show input and button
       this._taggleInputTarget.style.display = '';
       this.buttonTarget.style.display = '';
@@ -1715,9 +1735,6 @@ class InputTag extends HTMLElement {
   handleMultipleChange(isMultiple) {
     if (!this._taggle) return;
 
-    // Update the internal multiple state
-    this.multiple = isMultiple;
-
     // Get current tags
     const currentTags = this._taggle.getTagValues();
 
@@ -1816,7 +1833,7 @@ class InputTag extends HTMLElement {
     values.forEach(value => formData.append(this.name, value));
     // For single mode, append empty string when no values (like standard HTML inputs)
     // For multiple mode, leave empty (like standard HTML multiple selects)
-    if (values.length === 0 && !this.hasAttribute('multiple')) {
+    if (values.length === 0 && !this.multiple) {
       formData.append(this.name, "");
     }
     this._internals.setFormValue(formData);

data/bard-tag/package.json

@@ -5,11 +5,11 @@
     "build": "rollup -c"
   },
   "devDependencies": {
-    "@rollup/plugin-commonjs": "^25.0.7",
-    "@rollup/plugin-node-resolve": "^15.2.3",
-    "rollup": "^4.5.2"
+    "@rollup/plugin-commonjs": "^28.0.8",
+    "@rollup/plugin-node-resolve": "^16.0.3",
+    "rollup": "^4.52.5"
   },
   "dependencies": {
-    "@botandrose/input-tag": "0.3.0"
+    "@botandrose/input-tag": "0.4.2"
   }
 }

data/lib/bard/tag_field/version.rb

@@ -2,6 +2,6 @@
 
 module Bard
   module TagField
-    VERSION = "0.4.1"
+    VERSION = "0.4.2"
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: bard-tag_field
 version: !ruby/object:Gem::Version
-  version: 0.4.1
+  version: 0.4.2
 platform: ruby
 authors:
 - Micah Geisel
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2025-08-27 00:00:00.000000000 Z
+date: 2025-10-19 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails