[FIX] web_editor: reduce clickable area of checkboxes in editor panel

Before this commit the clickable zone of a checkbox in the editor was
all the width of the panel.

After this commit, the clickable zone is only the label width + the
checkbox width. Also, the active and hover states of the label have been
removed to not confuse the user.

task-2312878

closes odoo/odoo#59240

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>

1 files changed, 15 insertions, 0 deletions

diff --git a/addons/web_editor/static/src/js/editor/snippets.options.js b/addons/web_editor/static/src/js/editor/snippets.options.js
index d8887d67095..14bc101290f 100644
--- a/addons/web_editor/static/src/js/editor/snippets.options.js
+++ b/addons/web_editor/static/src/js/editor/snippets.options.js
@@ -705,6 +705,21 @@ const CheckboxUserValueWidget = ButtonUserValueWidget.extend({
 
         return this._super(...arguments);
     },
+
+    //--------------------------------------------------------------------------
+    // Handlers
+    //--------------------------------------------------------------------------
+
+    /**
+     * @override
+     */
+    _onButtonClick(ev) {
+        if (!ev.target.closest('we-title, we-checkbox')) {
+            // Only consider clicks on the label and the checkbox control itself
+            return;
+        }
+        return this._super(...arguments);
+    },
 });
 
 const BaseSelectionUserValueWidget = UserValueWidget.extend({