[IMP] web_widget_numeric_step: option to add classes

New option so we can add new classes to the input or remove existing
ones so we can style the input at our will.

TT49390

web_widget_numeric_step/README.rst

@@ -7,7 +7,7 @@ Web Widget Numeric Step
    !! This file is generated by oca-gen-addon-readme !!
    !! changes will be overwritten.                   !!
    !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
-   !! source digest: sha256:a2b6cac785e6c68124e9b96656216e49d609e2af60effef85a069ee295d3bc41
+   !! source digest: sha256:3f4e1a0c2c047ce2fc2dcc1f2b9bd928cf1c5c5a26f131d17b64d3f5b98459ad
    !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
 
 .. |badge1| image:: https://img.shields.io/badge/maturity-Beta-yellow.png
@@ -65,6 +65,8 @@ Example for an 0.25 step, min to -1 and max to 10 :
 - max > Max. value allowed (default: no limit)
 - auto_select > Select the content when the element get focus (default: False)
 - placeholder > Define the placeholder text (default: None)
+- add_class > Define additional classes for the input (default: None)
+- remove_class > Remove default classes from the input (default: None)
 
 **Examples**
 

web_widget_numeric_step/readme/USAGE.rst

@@ -22,6 +22,8 @@ Example for an 0.25 step, min to -1 and max to 10 :
 - max > Max. value allowed (default: no limit)
 - auto_select > Select the content when the element get focus (default: False)
 - placeholder > Define the placeholder text (default: None)
+- add_class > Define additional classes for the input (default: None)
+- remove_class > Remove default classes from the input (default: None)
 
 **Examples**
 

web_widget_numeric_step/static/description/index.html

@@ -367,7 +367,7 @@ ul.auto-toc {
 !! This file is generated by oca-gen-addon-readme !!
 !! changes will be overwritten.                   !!
 !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
-!! source digest: sha256:a2b6cac785e6c68124e9b96656216e49d609e2af60effef85a069ee295d3bc41
+!! source digest: sha256:3f4e1a0c2c047ce2fc2dcc1f2b9bd928cf1c5c5a26f131d17b64d3f5b98459ad
 !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! -->
 <p><a class="reference external image-reference" href="https://odoo-community.org/page/development-status"><img alt="Beta" src="https://img.shields.io/badge/maturity-Beta-yellow.png" /></a> <a class="reference external image-reference" href="http://www.gnu.org/licenses/agpl-3.0-standalone.html"><img alt="License: AGPL-3" src="https://img.shields.io/badge/licence-AGPL--3-blue.png" /></a> <a class="reference external image-reference" href="https://github.com/OCA/web/tree/15.0/web_widget_numeric_step"><img alt="OCA/web" src="https://img.shields.io/badge/github-OCA%2Fweb-lightgray.png?logo=github" /></a> <a class="reference external image-reference" href="https://translation.odoo-community.org/projects/web-15-0/web-15-0-web_widget_numeric_step"><img alt="Translate me on Weblate" src="https://img.shields.io/badge/weblate-Translate%20me-F47D42.png" /></a> <a class="reference external image-reference" href="https://runboat.odoo-community.org/builds?repo=OCA/web&amp;target_branch=15.0"><img alt="Try me on Runboat" src="https://img.shields.io/badge/runboat-Try%20me-875A7B.png" /></a></p>
 <p>This widget changes input number field and make it easier to increment the number thanks to 2 buttons (+ and -).
@@ -407,6 +407,8 @@ Iteration step by default is 1.</p>
 <li>max &gt; Max. value allowed (default: no limit)</li>
 <li>auto_select &gt; Select the content when the element get focus (default: False)</li>
 <li>placeholder &gt; Define the placeholder text (default: None)</li>
+<li>add_class &gt; Define additional classes for the input (default: None)</li>
+<li>remove_class &gt; Remove default classes from the input (default: None)</li>
 </ul>
 <p><strong>Examples</strong></p>
 <p>Iteration with 0.25 step, min to -1 and max to 10.</p>

web_widget_numeric_step/static/src/js/numeric_step.js

@@ -49,12 +49,13 @@ odoo.define("web_widget_numeric_step.field", function (require) {
                 min_val = this.nodeOptions.max;
                 max_val = this.nodeOptions.min;
             }
-
             this._config = {
                 step: Number(this.nodeOptions.step) || 1,
                 min: Number(min_val),
                 max: Number(max_val),
                 autoSelect: this.nodeOptions.auto_select,
+                addClasses: this.nodeOptions.add_class,
+                removeClasses: this.nodeOptions.remove_class,
             };
 
             this._lazyOnChangeTrigger = _.debounce(
@@ -139,6 +140,12 @@ odoo.define("web_widget_numeric_step.field", function (require) {
                     .addClass("numeric_step_editing_cell")
             );
             this._prepareInput(this.$el.find("input.input_numeric_step"));
+            if (this._config.addClasses) {
+                this.$input.addClass(this._config.addClasses);
+            }
+            if (this._config.removeClasses) {
+                this.$input.removeClass(this._config.removeClasses);
+            }
         },
 
         /**