bootstrap-italia 2.7.8 → 2.7.9

package/dist/plugins/input.js

@@ -6,10 +6,6 @@ import InputLabel from './input-label.js';
 const NAME = 'input';
 const DATA_KEY = 'bs.input';
 const EVENT_KEY = `.${DATA_KEY}`;
-const DATA_API_KEY = '.data-api';
-
-const EVENT_MOUSEDOWN_DATA_API = `mousedown${EVENT_KEY}${DATA_API_KEY}`;
-const EVENT_KEYUP_DATA_API = `keyup${EVENT_KEY}${DATA_API_KEY}`;
 
 const EVENT_CHANGE = `change${EVENT_KEY}`;
 
@@ -65,26 +61,14 @@ class Input extends BaseComponent {
  */
 const excludes = [
   'select',
-  //'input[data-bs-input][type="number"]',
   'input[data-bs-input][type="password"]',
   'input.input-password[data-bs-input]',
   'input[data-bs-autocomplete][type="search"]',
   'input[type="time"]',
+  'input[type="radio"]',
+  'input[type="checkbox"]',
 ];
 
-/*const inputs = SelectorEngine.find('input, textarea').filter((input) => {
-  let result = true
-  excludes.forEach((selector) => {
-    if (input.matches(selector)) {
-      result = false
-    }
-  })
-  return result
-})
-inputs.forEach((input) => {
-  Input.getOrCreateInstance(input)
-})*/
-
 const createInput = (element) => {
   const toExclude = !!excludes.find((selector) => element.matches(selector));
   const isInputNumber = !!(element.getAttribute('type') === 'number' && element.parentNode.querySelector('button[class^="input-number-"]')); //check if it's a InputNumber component
@@ -94,16 +78,12 @@ const createInput = (element) => {
   return null
 };
 
-EventHandler.on(document, EVENT_MOUSEDOWN_DATA_API, 'input, textarea, label', function () {
-  const target = InputLabel.getInputFromLabel(this) || this;
-  createInput(target);
-});
-EventHandler.on(document, EVENT_KEYUP_DATA_API, 'input, textarea, label', function () {
-  const target = InputLabel.getInputFromLabel(this) || this;
-  const element = createInput(target);
-  if (element && element._label) {
-    element._label._labelOut();
-  }
+document.addEventListener('DOMContentLoaded', function () {
+  var frmel = document.querySelectorAll('input, textarea, label');
+  frmel.forEach(function (item) {
+    const target = InputLabel.getInputFromLabel(item) || item;
+    createInput(target);
+  });
 });
 
 export { Input as default };

package/dist/plugins/input.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.js","sources":["../../src/js/plugins/input.js"],"sourcesContent":["import BaseComponent from 'bootstrap/js/src/base-component.js'\n\nimport EventHandler from 'bootstrap/js/src/dom/event-handler'\nimport SelectorEngine from 'bootstrap/js/src/dom/selector-engine'\n\nimport InputLabel from './input-label'\n\nconst NAME = 'input'\nconst DATA_KEY = 'bs.input'\nconst EVENT_KEY = `.${DATA_KEY}`\nconst DATA_API_KEY = '.data-api'\n\nconst EVENT_MOUSEDOWN_DATA_API = `mousedown${EVENT_KEY}${DATA_API_KEY}`\nconst EVENT_KEYUP_DATA_API = `keyup${EVENT_KEY}${DATA_API_KEY}`\n\nconst EVENT_CHANGE = `change${EVENT_KEY}`\n\nclass Input extends BaseComponent {\n  constructor(element) {\n    super(element)\n\n    this._label = new InputLabel(element)\n    this._bindEvents()\n  }\n\n  // Getters\n\n  static get NAME() {\n    return NAME\n  }\n\n  // Public\n\n  // Private\n  _bindEvents() {\n    if (this._element.getAttribute('type') === 'file') {\n      EventHandler.on(this._element, EVENT_CHANGE, () => {\n        this._handleFileDescription()\n      })\n    }\n  }\n\n  _handleFileDescription() {\n    const fileNames = []\n    let labelPrefix = ''\n\n    Array.from(this._element.files).forEach((file) => {\n      const fileSize = Math.round(parseInt(file.size, 10) / 1024)\n      fileNames.push(file.name + ' (' + fileSize + 'kb)')\n    })\n\n    if (this._element.files.length > 1) {\n      labelPrefix = this._element.files.length + ' file da caricare: '\n    }\n\n    const label = SelectorEngine.findOne('label[for=\"' + this._element.getAttribute('id') + '\"] label.form-file-name', this._element)\n    if (label) {\n      label.innerText = labelPrefix + fileNames.join('; ')\n    }\n  }\n}\n\n/**\n * ------------------------------------------------------------------------\n * Data Api implementation\n * ------------------------------------------------------------------------\n */\nconst excludes = [\n  'select',\n  //'input[data-bs-input][type=\"number\"]',\n  'input[data-bs-input][type=\"password\"]',\n  'input.input-password[data-bs-input]',\n  'input[data-bs-autocomplete][type=\"search\"]',\n  'input[type=\"time\"]',\n]\n\n/*const inputs = SelectorEngine.find('input, textarea').filter((input) => {\n  let result = true\n  excludes.forEach((selector) => {\n    if (input.matches(selector)) {\n      result = false\n    }\n  })\n  return result\n})\ninputs.forEach((input) => {\n  Input.getOrCreateInstance(input)\n})*/\n\nconst createInput = (element) => {\n  const toExclude = !!excludes.find((selector) => element.matches(selector))\n  const isInputNumber = !!(element.getAttribute('type') === 'number' && element.parentNode.querySelector('button[class^=\"input-number-\"]')) //check if it's a InputNumber component\n  if (!toExclude && !isInputNumber) {\n    return Input.getOrCreateInstance(element)\n  }\n  return null\n}\n\nEventHandler.on(document, EVENT_MOUSEDOWN_DATA_API, 'input, textarea, label', function () {\n  const target = InputLabel.getInputFromLabel(this) || this\n  createInput(target)\n})\nEventHandler.on(document, EVENT_KEYUP_DATA_API, 'input, textarea, label', function () {\n  const target = InputLabel.getInputFromLabel(this) || this\n  const element = createInput(target)\n  if (element && element._label) {\n    element._label._labelOut()\n  }\n})\n\nexport default Input\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"input.js","sources":["../../src/js/plugins/input.js"],"sourcesContent":["import BaseComponent from 'bootstrap/js/src/base-component.js'\n\nimport EventHandler from 'bootstrap/js/src/dom/event-handler'\nimport SelectorEngine from 'bootstrap/js/src/dom/selector-engine'\n\nimport InputLabel from './input-label'\n\nconst NAME = 'input'\nconst DATA_KEY = 'bs.input'\nconst EVENT_KEY = `.${DATA_KEY}`\n\nconst EVENT_CHANGE = `change${EVENT_KEY}`\n\nclass Input extends BaseComponent {\n  constructor(element) {\n    super(element)\n\n    this._label = new InputLabel(element)\n    this._bindEvents()\n  }\n\n  // Getters\n\n  static get NAME() {\n    return NAME\n  }\n\n  // Public\n\n  // Private\n  _bindEvents() {\n    if (this._element.getAttribute('type') === 'file') {\n      EventHandler.on(this._element, EVENT_CHANGE, () => {\n        this._handleFileDescription()\n      })\n    }\n  }\n\n  _handleFileDescription() {\n    const fileNames = []\n    let labelPrefix = ''\n\n    Array.from(this._element.files).forEach((file) => {\n      const fileSize = Math.round(parseInt(file.size, 10) / 1024)\n      fileNames.push(file.name + ' (' + fileSize + 'kb)')\n    })\n\n    if (this._element.files.length > 1) {\n      labelPrefix = this._element.files.length + ' file da caricare: '\n    }\n\n    const label = SelectorEngine.findOne('label[for=\"' + this._element.getAttribute('id') + '\"] label.form-file-name', this._element)\n    if (label) {\n      label.innerText = labelPrefix + fileNames.join('; ')\n    }\n  }\n}\n\n/**\n * ------------------------------------------------------------------------\n * Data Api implementation\n * ------------------------------------------------------------------------\n */\nconst excludes = [\n  'select',\n  'input[data-bs-input][type=\"password\"]',\n  'input.input-password[data-bs-input]',\n  'input[data-bs-autocomplete][type=\"search\"]',\n  'input[type=\"time\"]',\n  'input[type=\"radio\"]',\n  'input[type=\"checkbox\"]',\n]\n\nconst createInput = (element) => {\n  const toExclude = !!excludes.find((selector) => element.matches(selector))\n  const isInputNumber = !!(element.getAttribute('type') === 'number' && element.parentNode.querySelector('button[class^=\"input-number-\"]')) //check if it's a InputNumber component\n  if (!toExclude && !isInputNumber) {\n    return Input.getOrCreateInstance(element)\n  }\n  return null\n}\n\ndocument.addEventListener('DOMContentLoaded', function () {\n  var frmel = document.querySelectorAll('input, textarea, label')\n  frmel.forEach(function (item) {\n    const target = InputLabel.getInputFromLabel(item) || item\n    createInput(target)\n  })\n})\n\nexport default Input\n"],"names":[],"mappings":"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"}

package/dist/plugins/select-autocomplete.js

@@ -2,14 +2,24 @@ import accessibleAutocomplete from 'accessible-autocomplete';
 import BaseComponent from 'bootstrap/js/src/base-component.js';
 
 const NAME = 'selectautocomplete';
-//const DATA_KEY = 'bs.selectautocomplete'
-//const EVENT_KEY = `.${DATA_KEY}`
-//const DATA_API_KEY = '.data-api'
+
+function onClassChange(element, callback) {
+  const observer = new MutationObserver((mutations) => {
+    mutations.forEach((mutation) => {
+      if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
+        callback(mutation.target);
+      }
+    });
+  });
+  observer.observe(element, { attributes: true });
+  return observer.disconnect
+}
 
 class SelectAutocomplete extends BaseComponent {
   constructor(element, config) {
     super(element);
-
+    this._hasFormControl = element.classList.contains('form-control');
+    this.element_original_id = this._element.id;
     this._config = config;
     this._enhance();
   }
@@ -20,11 +30,20 @@ class SelectAutocomplete extends BaseComponent {
     return NAME
   }
 
-  // Public
-
   // Private
   _enhance() {
     accessibleAutocomplete.enhanceSelectElement(Object.assign({}, { selectElement: this._element }, this._config));
+    setTimeout(() => {
+      if (this._hasFormControl) {
+        const inputField = document.getElementById(this.element_original_id);
+        inputField.classList.add('form-control');
+        onClassChange(inputField, (node) => {
+          if (!node.classList.contains('form-control')) {
+            node.classList.add('form-control');
+          }
+        });
+      }
+    }, 100);
   }
 }
 

package/dist/plugins/select-autocomplete.js.map

@@ -1 +1 @@
-{"version":3,"file":"select-autocomplete.js","sources":["../../src/js/plugins/select-autocomplete.js"],"sourcesContent":["import accessibleAutocomplete from 'accessible-autocomplete'\n\nimport BaseComponent from 'bootstrap/js/src/base-component.js'\n\nconst NAME = 'selectautocomplete'\n//const DATA_KEY = 'bs.selectautocomplete'\n//const EVENT_KEY = `.${DATA_KEY}`\n//const DATA_API_KEY = '.data-api'\n\nclass SelectAutocomplete extends BaseComponent {\n  constructor(element, config) {\n    super(element)\n\n    this._config = config\n    this._enhance()\n  }\n\n  // Getters\n\n  static get NAME() {\n    return NAME\n  }\n\n  // Public\n\n  // Private\n  _enhance() {\n    accessibleAutocomplete.enhanceSelectElement(Object.assign({}, { selectElement: this._element }, this._config))\n  }\n}\n\n/**\n * ------------------------------------------------------------------------\n * Data Api implementation\n * ------------------------------------------------------------------------\n */\n\nexport default SelectAutocomplete\n"],"names":[],"mappings":";;;AAIA,MAAM,IAAI,GAAG,qBAAoB;AACjC;AACA;AACA;AACA;AACA,MAAM,kBAAkB,SAAS,aAAa,CAAC;AAC/C,EAAE,WAAW,CAAC,OAAO,EAAE,MAAM,EAAE;AAC/B,IAAI,KAAK,CAAC,OAAO,EAAC;AAClB;AACA,IAAI,IAAI,CAAC,OAAO,GAAG,OAAM;AACzB,IAAI,IAAI,CAAC,QAAQ,GAAE;AACnB,GAAG;AACH;AACA;AACA;AACA,EAAE,WAAW,IAAI,GAAG;AACpB,IAAI,OAAO,IAAI;AACf,GAAG;AACH;AACA;AACA;AACA;AACA,EAAE,QAAQ,GAAG;AACb,IAAI,sBAAsB,CAAC,oBAAoB,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,EAAE,aAAa,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAE,IAAI,CAAC,OAAO,CAAC,EAAC;AAClH,GAAG;AACH;;;;"}
+{"version":3,"file":"select-autocomplete.js","sources":["../../src/js/plugins/select-autocomplete.js"],"sourcesContent":["import accessibleAutocomplete from 'accessible-autocomplete'\n\nimport BaseComponent from 'bootstrap/js/src/base-component.js'\n\nconst NAME = 'selectautocomplete'\n\nfunction onClassChange(element, callback) {\n  const observer = new MutationObserver((mutations) => {\n    mutations.forEach((mutation) => {\n      if (mutation.type === 'attributes' && mutation.attributeName === 'class') {\n        callback(mutation.target)\n      }\n    })\n  })\n  observer.observe(element, { attributes: true })\n  return observer.disconnect\n}\n\nclass SelectAutocomplete extends BaseComponent {\n  constructor(element, config) {\n    super(element)\n    this._hasFormControl = element.classList.contains('form-control')\n    this.element_original_id = this._element.id\n    this._config = config\n    this._enhance()\n  }\n\n  // Getters\n\n  static get NAME() {\n    return NAME\n  }\n\n  // Private\n  _enhance() {\n    accessibleAutocomplete.enhanceSelectElement(Object.assign({}, { selectElement: this._element }, this._config))\n    setTimeout(() => {\n      if (this._hasFormControl) {\n        const inputField = document.getElementById(this.element_original_id)\n        inputField.classList.add('form-control')\n        onClassChange(inputField, (node) => {\n          if (!node.classList.contains('form-control')) {\n            node.classList.add('form-control')\n          }\n        })\n      }\n    }, 100)\n  }\n}\n\n/**\n * ------------------------------------------------------------------------\n * Data Api implementation\n * ------------------------------------------------------------------------\n */\n\nexport default SelectAutocomplete\n"],"names":[],"mappings":";;;AAIA,MAAM,IAAI,GAAG,qBAAoB;AACjC;AACA,SAAS,aAAa,CAAC,OAAO,EAAE,QAAQ,EAAE;AAC1C,EAAE,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC,CAAC,SAAS,KAAK;AACvD,IAAI,SAAS,CAAC,OAAO,CAAC,CAAC,QAAQ,KAAK;AACpC,MAAM,IAAI,QAAQ,CAAC,IAAI,KAAK,YAAY,IAAI,QAAQ,CAAC,aAAa,KAAK,OAAO,EAAE;AAChF,QAAQ,QAAQ,CAAC,QAAQ,CAAC,MAAM,EAAC;AACjC,OAAO;AACP,KAAK,EAAC;AACN,GAAG,EAAC;AACJ,EAAE,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,EAAC;AACjD,EAAE,OAAO,QAAQ,CAAC,UAAU;AAC5B,CAAC;AACD;AACA,MAAM,kBAAkB,SAAS,aAAa,CAAC;AAC/C,EAAE,WAAW,CAAC,OAAO,EAAE,MAAM,EAAE;AAC/B,IAAI,KAAK,CAAC,OAAO,EAAC;AAClB,IAAI,IAAI,CAAC,eAAe,GAAG,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,EAAC;AACrE,IAAI,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAE;AAC/C,IAAI,IAAI,CAAC,OAAO,GAAG,OAAM;AACzB,IAAI,IAAI,CAAC,QAAQ,GAAE;AACnB,GAAG;AACH;AACA;AACA;AACA,EAAE,WAAW,IAAI,GAAG;AACpB,IAAI,OAAO,IAAI;AACf,GAAG;AACH;AACA;AACA,EAAE,QAAQ,GAAG;AACb,IAAI,sBAAsB,CAAC,oBAAoB,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,EAAE,aAAa,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAE,IAAI,CAAC,OAAO,CAAC,EAAC;AAClH,IAAI,UAAU,CAAC,MAAM;AACrB,MAAM,IAAI,IAAI,CAAC,eAAe,EAAE;AAChC,QAAQ,MAAM,UAAU,GAAG,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,mBAAmB,EAAC;AAC5E,QAAQ,UAAU,CAAC,SAAS,CAAC,GAAG,CAAC,cAAc,EAAC;AAChD,QAAQ,aAAa,CAAC,UAAU,EAAE,CAAC,IAAI,KAAK;AAC5C,UAAU,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE;AACxD,YAAY,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,cAAc,EAAC;AAC9C,WAAW;AACX,SAAS,EAAC;AACV,OAAO;AACP,KAAK,EAAE,GAAG,EAAC;AACX,GAAG;AACH;;;;"}

package/dist/version.js

@@ -1,7 +1,7 @@
 // bootstrap italia version variable
 // useful to check for the current version
 // eslint-disable-next-line no-unused-vars
-const BOOTSTRAP_ITALIA_VERSION = '2.7.8';
+const BOOTSTRAP_ITALIA_VERSION = '2.7.9';
 
 export { BOOTSTRAP_ITALIA_VERSION as default };
 //# sourceMappingURL=version.js.map

package/dist/version.js.map

@@ -1 +1 @@
-{"version":3,"file":"version.js","sources":["../src/js/version.js"],"sourcesContent":["// bootstrap italia version variable\n// useful to check for the current version\n// eslint-disable-next-line no-unused-vars\nconst BOOTSTRAP_ITALIA_VERSION = '2.7.8'\nexport default BOOTSTRAP_ITALIA_VERSION\n"],"names":[],"mappings":"AAAA;AACA;AACA;AACK,MAAC,wBAAwB,GAAG;;;;"}
+{"version":3,"file":"version.js","sources":["../src/js/version.js"],"sourcesContent":["// bootstrap italia version variable\n// useful to check for the current version\n// eslint-disable-next-line no-unused-vars\nconst BOOTSTRAP_ITALIA_VERSION = '2.7.9'\nexport default BOOTSTRAP_ITALIA_VERSION\n"],"names":[],"mappings":"AAAA;AACA;AACA;AACK,MAAC,wBAAwB,GAAG;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bootstrap-italia",
-  "version": "2.7.8",
+  "version": "2.7.9",
   "keywords": [
     "css",
     "sass",

package/src/js/plugins/input-label.js

@@ -39,7 +39,10 @@ class InputLabel {
       this._labelOut()
       this._labelOver()
     }
-    this._bindEvents()
+
+    if (label && label.getAttribute('it-bs-static') === null) {
+      this._bindEvents()
+    }
   }
 
   _bindEvents() {

package/src/js/plugins/input-number.js

@@ -12,15 +12,12 @@ const DATA_API_KEY = '.data-api'
 
 const EVENT_CLICK = `click${EVENT_KEY}`
 const EVENT_CHANGE = `change${EVENT_KEY}`
+const EVENT_INPUT = `input`
 
 //const EVENT_FOCUS_DATA_API = `focus${EVENT_KEY}${DATA_API_KEY}`
 const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}`
-const EVENT_MOUSEDOWN_DATA_API = `mousedown${EVENT_KEY}${DATA_API_KEY}`
-const EVENT_KEYUP_DATA_API = `keyup${EVENT_KEY}${DATA_API_KEY}`
 
 const CLASS_NAME_ADAPTIVE = 'input-number-adaptive'
-const CLASS_NAME_PERCENTAGE = 'input-number-percentage'
-const CLASS_NAME_CURRENCY = 'input-number-currency'
 //const CLASS_NAME_INCREMENT = 'input-number-add'
 const CLASS_NAME_DECREMENT = 'input-number-sub'
 
@@ -61,6 +58,7 @@ class InputNumber extends BaseComponent {
         EventHandler.on(btn, EVENT_CLICK, (evt) => {
           evt.preventDefault()
           this._incrDecr(btn.classList.contains(CLASS_NAME_DECREMENT))
+          this._label._labelOut()
         })
       })
 
@@ -72,14 +70,9 @@ class InputNumber extends BaseComponent {
     if (this._wrapperElement.classList.contains(CLASS_NAME_ADAPTIVE)) {
       let newWidth = null
       //let newWidthIE = null
-      if (!this._wrapperElement.classList.contains(CLASS_NAME_PERCENTAGE)) {
-        newWidth = 'calc(44px + ' + this._element.value.length + 'ch)'
-        //newWidthIE = 'calc(44px + (1.5 * ' + this._element.value.length + 'ch))'
-      }
-      if (this._wrapperElement.classList.contains(CLASS_NAME_CURRENCY)) {
-        newWidth = 'calc(40px + 44px + ' + this._element.value.length + 'ch)'
-        //newWidthIE = 'calc(40px + 44px + (1.5 * ' + this._element.value.length + 'ch))'
-      }
+      //74px - buttons (30px) and possible validation icon (40px)
+      newWidth = 'calc(70px + ' + this._element.value.length + 'ch)'
+      //newWidthIE = 'calc(44px + (1.5 * ' + this._element.value.length + 'ch))'
 
       if (newWidth) {
         this._element.style.width = newWidth
@@ -89,7 +82,8 @@ class InputNumber extends BaseComponent {
   }
 
   _incrDecr(isDecr) {
-    const inputVal = parseFloat(this._element.value)
+    var inputVal = 0
+    if (this._element.value !== '') inputVal = parseFloat(this._element.value)
 
     if (!isNaN(inputVal)) {
       //get step
@@ -100,6 +94,7 @@ class InputNumber extends BaseComponent {
 
       this._element.value = inputVal + step * (isDecr ? -1 : 1)
       EventHandler.trigger(this._element, EVENT_CHANGE)
+      EventHandler.trigger(this._element, EVENT_INPUT)
     }
   }
 
@@ -168,17 +163,14 @@ const createInput = (element) => {
   return null
 }
 
-EventHandler.on(document, EVENT_MOUSEDOWN_DATA_API, SELECTOR_INPUT + ', label', function () {
-  const target = InputLabel.getInputFromLabel(this) || this
-  createInput(target)
-})
-EventHandler.on(document, EVENT_KEYUP_DATA_API, SELECTOR_INPUT + ', label', function () {
-  const target = InputLabel.getInputFromLabel(this) || this
-  const element = createInput(target)
-  if (element && element._label) {
-    element._label._labelOut()
-  }
+document.addEventListener('DOMContentLoaded', function () {
+  var frmel = document.querySelectorAll(SELECTOR_INPUT + ', label')
+  frmel.forEach(function (item) {
+    const target = InputLabel.getInputFromLabel(item) || item
+    createInput(target)
+  })
 })
+
 EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_BTN, function () {
   const wrapper = this.closest(SELECTOR_WRAPPER)
   if (wrapper) {

package/src/js/plugins/input-search-autocomplete.js

@@ -9,15 +9,12 @@ import InputLabel from './input-label'
 const NAME = 'inputsearchautocomplete'
 const DATA_KEY = 'bs.inputsearchautocomplete'
 const EVENT_KEY = `.${DATA_KEY}`
-const DATA_API_KEY = '.data-api'
 
 const Default = {
   autocomplete: [],
 }
 
 const EVENT_KEYUP = `keyup${EVENT_KEY}`
-const EVENT_KEYUP_DATA_API = `keyup${EVENT_KEY}${DATA_API_KEY}`
-const EVENT_MOUSEDOWN_DATA_API = `mousedown${EVENT_KEY}${DATA_API_KEY}`
 
 const CLASS_NAME_SHOW = 'autocomplete-list-show'
 const CLASS_NAME_AUTOCOMPLETE = 'autocomplete'
@@ -137,16 +134,12 @@ const createInput = (element) => {
   return null
 }
 
-EventHandler.on(document, EVENT_MOUSEDOWN_DATA_API, SELECTOR_SEARCH + ', label', function () {
-  const target = InputLabel.getInputFromLabel(this) || this
-  createInput(target)
-})
-EventHandler.on(document, EVENT_KEYUP_DATA_API, SELECTOR_SEARCH + ', label', function () {
-  const target = InputLabel.getInputFromLabel(this) || this
-  const element = createInput(target)
-  if (element && element._label) {
-    element._label._labelOut()
-  }
+document.addEventListener('DOMContentLoaded', function () {
+  var frmel = document.querySelectorAll(SELECTOR_SEARCH + ', label')
+  frmel.forEach(function (item) {
+    const target = InputLabel.getInputFromLabel(item) || item
+    createInput(target)
+  })
 })
 
 export default InputSearch

package/src/js/plugins/input.js

@@ -8,10 +8,6 @@ import InputLabel from './input-label'
 const NAME = 'input'
 const DATA_KEY = 'bs.input'
 const EVENT_KEY = `.${DATA_KEY}`
-const DATA_API_KEY = '.data-api'
-
-const EVENT_MOUSEDOWN_DATA_API = `mousedown${EVENT_KEY}${DATA_API_KEY}`
-const EVENT_KEYUP_DATA_API = `keyup${EVENT_KEY}${DATA_API_KEY}`
 
 const EVENT_CHANGE = `change${EVENT_KEY}`
 
@@ -67,26 +63,14 @@ class Input extends BaseComponent {
  */
 const excludes = [
   'select',
-  //'input[data-bs-input][type="number"]',
   'input[data-bs-input][type="password"]',
   'input.input-password[data-bs-input]',
   'input[data-bs-autocomplete][type="search"]',
   'input[type="time"]',
+  'input[type="radio"]',
+  'input[type="checkbox"]',
 ]
 
-/*const inputs = SelectorEngine.find('input, textarea').filter((input) => {
-  let result = true
-  excludes.forEach((selector) => {
-    if (input.matches(selector)) {
-      result = false
-    }
-  })
-  return result
-})
-inputs.forEach((input) => {
-  Input.getOrCreateInstance(input)
-})*/
-
 const createInput = (element) => {
   const toExclude = !!excludes.find((selector) => element.matches(selector))
   const isInputNumber = !!(element.getAttribute('type') === 'number' && element.parentNode.querySelector('button[class^="input-number-"]')) //check if it's a InputNumber component
@@ -96,16 +80,12 @@ const createInput = (element) => {
   return null
 }
 
-EventHandler.on(document, EVENT_MOUSEDOWN_DATA_API, 'input, textarea, label', function () {
-  const target = InputLabel.getInputFromLabel(this) || this
-  createInput(target)
-})
-EventHandler.on(document, EVENT_KEYUP_DATA_API, 'input, textarea, label', function () {
-  const target = InputLabel.getInputFromLabel(this) || this
-  const element = createInput(target)
-  if (element && element._label) {
-    element._label._labelOut()
-  }
+document.addEventListener('DOMContentLoaded', function () {
+  var frmel = document.querySelectorAll('input, textarea, label')
+  frmel.forEach(function (item) {
+    const target = InputLabel.getInputFromLabel(item) || item
+    createInput(target)
+  })
 })
 
 export default Input

package/src/js/plugins/select-autocomplete.js

@@ -3,14 +3,24 @@ import accessibleAutocomplete from 'accessible-autocomplete'
 import BaseComponent from 'bootstrap/js/src/base-component.js'
 
 const NAME = 'selectautocomplete'
-//const DATA_KEY = 'bs.selectautocomplete'
-//const EVENT_KEY = `.${DATA_KEY}`
-//const DATA_API_KEY = '.data-api'
+
+function onClassChange(element, callback) {
+  const observer = new MutationObserver((mutations) => {
+    mutations.forEach((mutation) => {
+      if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
+        callback(mutation.target)
+      }
+    })
+  })
+  observer.observe(element, { attributes: true })
+  return observer.disconnect
+}
 
 class SelectAutocomplete extends BaseComponent {
   constructor(element, config) {
     super(element)
-
+    this._hasFormControl = element.classList.contains('form-control')
+    this.element_original_id = this._element.id
     this._config = config
     this._enhance()
   }
@@ -21,11 +31,20 @@ class SelectAutocomplete extends BaseComponent {
     return NAME
   }
 
-  // Public
-
   // Private
   _enhance() {
     accessibleAutocomplete.enhanceSelectElement(Object.assign({}, { selectElement: this._element }, this._config))
+    setTimeout(() => {
+      if (this._hasFormControl) {
+        const inputField = document.getElementById(this.element_original_id)
+        inputField.classList.add('form-control')
+        onClassChange(inputField, (node) => {
+          if (!node.classList.contains('form-control')) {
+            node.classList.add('form-control')
+          }
+        })
+      }
+    }, 100)
   }
 }
 

package/src/js/version.js

@@ -1,5 +1,5 @@
 // bootstrap italia version variable
 // useful to check for the current version
 // eslint-disable-next-line no-unused-vars
-const BOOTSTRAP_ITALIA_VERSION = '2.7.8'
+const BOOTSTRAP_ITALIA_VERSION = '2.7.9'
 export default BOOTSTRAP_ITALIA_VERSION

package/src/scss/custom/_form-input-number.scss

@@ -1,10 +1,8 @@
 .input-number {
   position: relative;
-  width: 100%;
 
   &.input-number-adaptive {
-    width: auto;
-    display: inline;
+    width: fit-content;
     input[type='number'] {
       width: auto;
       transition: all 0.3s;
@@ -23,80 +21,49 @@
     }
 
     // color: $color-text-muted;
-    padding-right: 32px;
-    padding-left: 12px;
-    min-width: 86px !important;
-    width: 100%;
 
     &:focus {
       color: $color-text-base;
     }
   }
 
-  //currency + percentage version
-  &.input-number-currency,
-  &.input-number-percentage {
-    &:before {
-      position: absolute;
-      left: 14px;
-      top: 0;
-      // color: $color-text-muted;
-      font-weight: bold;
-      font-size: 1rem;
-    }
-    input[type='number'] {
-      padding-left: 40px;
-    }
-  }
-  &.input-number-currency {
-    &:before {
-      content: '€';
-    }
-  }
-  &.input-number-percentage {
-    &:before {
-      content: '%';
-    }
-  }
-
   //disabled version
   &.disabled {
     input[type='number'] {
-      background-color: transparent;
-      color: $gray-label-disabled;
-      border-bottom-color: $gray-border-disabled;
+      background-color: $gray-disabled;
+      color: $gray-800;
       &:hover {
         cursor: not-allowed;
         color: $gray-label-disabled;
       }
     }
-    button {
-      pointer-events: none;
-      &:hover {
-        cursor: not-allowed;
-      }
-      &.input-number-add {
-        &:after {
-          border-color: transparent transparent $gray-border-disabled transparent;
-        }
-      }
-      &.input-number-sub {
-        &:after {
-          border-color: $gray-border-disabled transparent transparent transparent;
+    .input-group-text {
+      background-color: $gray-disabled;
+      color: $gray-800;
+      button {
+        pointer-events: none;
+        &:hover {
+          cursor: not-allowed;
         }
       }
     }
   }
 
   //add + sub buttons
-  button {
+  .input-group-text.align-buttons {
     position: absolute;
-    right: 2px;
+    top: 0;
+    bottom: 0;
+    right: 0;
+    z-index: 10;
+  }
+  .input-group-text button {
+    position: relative;
     transition: opacity 0.1s;
     padding: 0;
     border: none;
-    height: 20px;
-    width: 24px;
+    height: 50%;
+    width: 16px;
     background: transparent;
     &:after {
       position: absolute;
@@ -126,14 +93,12 @@
     }
 
     &.input-number-add {
-      top: -6px;
       &:after {
         border-width: 0 5px 6px 5px;
         border-color: transparent transparent $neutral-1-a7 transparent; // TODO Check if still necessary
       }
     }
     &.input-number-sub {
-      bottom: -6px;
       &:after {
         border-width: 6px 5px 0 5px;
         border-color: $neutral-1-a7 transparent transparent transparent; // TODO Check if still necessary

package/src/scss/custom/_forms.scss

@@ -59,6 +59,13 @@ fieldset {
       font-size: $small-font-size;
       color: $input-label-color;
     }
+    &:not(.active) {
+      & + .input-number-currency {
+        .input-group-text {
+          display: none;
+        }
+      }
+    }
   }
 
   input:is([type='radio']),
@@ -100,7 +107,6 @@ textarea {
   border-radius: 0;
   padding: $input-spacing-y $input-spacing-x;
   outline: 0;
-  height: $input-height;
   width: 100%;
   box-shadow: none;
   transition: none;
@@ -188,7 +194,7 @@ textarea {
   .input-group-text {
     padding: $input-spacing-y $input-spacing-x;
     border-bottom: 1px solid $input-border;
-    height: 100%;
+    border-radius: 0;
   }
 
   .input-group-prepend {