From b0c9e2a059cc3126d72298e01da485a4c77350ab Mon Sep 17 00:00:00 2001
From: Niclas Fors <niclas.fors@qlik.com>
Date: Fri, 12 Jan 2024 11:27:04 +0100
Subject: [PATCH] fix: use SVG renderer for labels

---
 src/coloring/picasso/index.js         | 3 ++-
 src/coloring/picasso/legend/visual.js | 3 ++-
 src/pic-definition.js                 | 4 +++-
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/coloring/picasso/index.js b/src/coloring/picasso/index.js
index 26447797..e34e8ea7 100644
--- a/src/coloring/picasso/index.js
+++ b/src/coloring/picasso/index.js
@@ -153,11 +153,12 @@ export default function coloringFn(resources) {
      * @param {string} [cfg.styleReference='object.legend']
      * @returns {object}
      */
-    legend({ eventName, key, styleOptions } = {}) {
+    legend({ eventName, key, renderer, styleOptions } = {}) {
       return legend(
         {
           eventName,
           key,
+          renderer,
         },
         {
           legendConfig: chartColorModel.getLegendSettings(),
diff --git a/src/coloring/picasso/legend/visual.js b/src/coloring/picasso/legend/visual.js
index 30d82353..9e189ccf 100644
--- a/src/coloring/picasso/legend/visual.js
+++ b/src/coloring/picasso/legend/visual.js
@@ -12,7 +12,7 @@ export const legendShow = (legendProps, hc, coloring) => {
 };
 
 export function catLegend(componentConfig, opts) {
-  const { key } = componentConfig;
+  const { key, renderer } = componentConfig;
 
   const { scaleKey, scales, coloring, hc, constraints, styleOptions } = opts;
 
@@ -21,6 +21,7 @@ export function catLegend(componentConfig, opts) {
   return {
     type: "legend-cat",
     key: `${key}-cat`,
+    renderer,
     scale: s in scales ? s : scaleKey,
     show: legendShow(opts.legendConfig, hc, coloring),
     layout: {
diff --git a/src/pic-definition.js b/src/pic-definition.js
index 0f232165..e2511898 100644
--- a/src/pic-definition.js
+++ b/src/pic-definition.js
@@ -72,12 +72,15 @@ export default function picDefinition({
     };
   }
 
+  const textRenderer = getTextRenderer(flags);
+
   const colorDatum = picassoColoring.datumProps();
   const colorFill = picassoColoring.color();
 
   const leg = picassoColoring.legend({
     key: "color-legend",
     eventName: "ev",
+    renderer: textRenderer,
     styleOptions: {
       title: getLegendTitleStyle(theme, layout, flags),
       label: getLegendLabelStyle(theme, layout, flags),
@@ -86,7 +89,6 @@ export default function picDefinition({
   const axisLabelStyle = getAxisLabelStyle(theme, layout, flags);
   const valueLabelStyle = getValueLabelStyle(theme, layout, flags);
   const allowTooltip = !constraints.passive;
-  const textRenderer = getTextRenderer(flags);
 
   return {
     strategy: {