From 85befe55ba50284a7fd7e77cd16c3f8fc4f8749f Mon Sep 17 00:00:00 2001
From: "Guillaume (gdi)" <gdi@odoo.com>
Date: Fri, 9 Sep 2022 11:03:52 +0200
Subject: [PATCH] [IMP] website: allow to have reference SCSS variables for
 color pickers

This commit allows the color picker widget to manage an SCSS variable
which can itself be a reference to another SCSS variable.

task-2904507

Part-of: odoo/odoo#99732
---
 .../website/static/src/js/editor/snippets.options.js  | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/addons/website/static/src/js/editor/snippets.options.js b/addons/website/static/src/js/editor/snippets.options.js
index fe61122a5d4..1bb0a773406 100644
--- a/addons/website/static/src/js/editor/snippets.options.js
+++ b/addons/website/static/src/js/editor/snippets.options.js
@@ -719,7 +719,16 @@ options.Class.include({
             case 'customizeWebsiteVariable': {
                 const ownerDocument = this.$target[0].ownerDocument;
                 const style = ownerDocument.defaultView.getComputedStyle(ownerDocument.documentElement);
-                return weUtils.getCSSVariableValue(params.variable, style);
+                let finalValue = weUtils.getCSSVariableValue(params.variable, style);
+                if (!params.colorNames) {
+                    return finalValue;
+                }
+                let tempValue = finalValue;
+                while (tempValue) {
+                    finalValue = tempValue;
+                    tempValue = weUtils.getCSSVariableValue(tempValue.replaceAll("'", ''), style);
+                }
+                return finalValue;
             }
             case 'customizeWebsiteColor': {
                 const ownerDocument = this.$target[0].ownerDocument;