Fix Table rule based styling by applying the first valid rule

Author: “Bastien

src/chart/table/TableChart.tsx

@@ -256,21 +256,28 @@ export const NeoTableChart = (props: ChartProps) => {
     getCellClassName: (params) => {
       return ['cell color', 'cell text color']
         .map((e) => {
-          let trueRulesList = [''];
-          let trueRule;
+          let validRuleClass = '';
           for (const [index, rule] of styleRules.entries()) {
+            let ruleClass = '';
+            // If the rule target is not the current cell
             if (rule.targetField) {
               if (rule.targetField === params.field) {
-                trueRule = `rule${evaluateSingleRuleOnDict({ [rule.field]: params.row[rule.field] }, rule, index, [
+                ruleClass = `rule${evaluateSingleRuleOnDict({ [rule.field]: params.row[rule.field] }, rule, index, [
                   e,
                 ])}`;
               }
-            } else {
-              trueRule = `rule${evaluateSingleRuleOnDict({ [params.field]: params.value }, rule, index, [e])}`;
             }
-            trueRulesList.push(trueRule);
+            // If the rule target is the current cell
+            else {
+              ruleClass = `rule${evaluateSingleRuleOnDict({ [params.field]: params.value }, rule, index, [e])}`;
+            }
+            // If rule class is valid (rule-1 means rule check has failed)
+            if (ruleClass && ruleClass !== 'rule-1') {
+              validRuleClass = ruleClass;
+              break;
+            }
           }
-          return trueRulesList.join(' ');
+          return validRuleClass;
         })
         .join(' ');
     },