@hisptz/dhis2-analytics 1.0.5 → 1.0.6

package/{src/components/Map/components/ThematicLayerConfiguration/components/ColorScaleSelect/constants/colors.ts → build/es/components/Map/components/ThematicLayerConfiguration/components/ColorScaleSelect/constants/colors.js}

@@ -6,7 +6,7 @@ export const COLOR_PALETTES = {
     6: ["#ffffcc", "#d9f0a3", "#addd8e", "#78c679", "#31a354", "#006837"],
     7: ["#ffffcc", "#d9f0a3", "#addd8e", "#78c679", "#41ab5d", "#238443", "#005a32"],
     8: ["#ffffe5", "#f7fcb9", "#d9f0a3", "#addd8e", "#78c679", "#41ab5d", "#238443", "#005a32"],
-    9: ["#ffffe5", "#f7fcb9", "#d9f0a3", "#addd8e", "#78c679", "#41ab5d", "#238443", "#006837", "#004529"],
+    9: ["#ffffe5", "#f7fcb9", "#d9f0a3", "#addd8e", "#78c679", "#41ab5d", "#238443", "#006837", "#004529"]
   },
   YlGnBu: {
     3: ["#edf8b1", "#7fcdbb", "#2c7fb8"],
@@ -15,7 +15,7 @@ export const COLOR_PALETTES = {
     6: ["#ffffcc", "#c7e9b4", "#7fcdbb", "#41b6c4", "#2c7fb8", "#253494"],
     7: ["#ffffcc", "#c7e9b4", "#7fcdbb", "#41b6c4", "#1d91c0", "#225ea8", "#0c2c84"],
     8: ["#ffffd9", "#edf8b1", "#c7e9b4", "#7fcdbb", "#41b6c4", "#1d91c0", "#225ea8", "#0c2c84"],
-    9: ["#ffffd9", "#edf8b1", "#c7e9b4", "#7fcdbb", "#41b6c4", "#1d91c0", "#225ea8", "#253494", "#081d58"],
+    9: ["#ffffd9", "#edf8b1", "#c7e9b4", "#7fcdbb", "#41b6c4", "#1d91c0", "#225ea8", "#253494", "#081d58"]
   },
   GnBu: {
     3: ["#e0f3db", "#a8ddb5", "#43a2ca"],
@@ -24,7 +24,7 @@ export const COLOR_PALETTES = {
     6: ["#f0f9e8", "#ccebc5", "#a8ddb5", "#7bccc4", "#43a2ca", "#0868ac"],
     7: ["#f0f9e8", "#ccebc5", "#a8ddb5", "#7bccc4", "#4eb3d3", "#2b8cbe", "#08589e"],
     8: ["#f7fcf0", "#e0f3db", "#ccebc5", "#a8ddb5", "#7bccc4", "#4eb3d3", "#2b8cbe", "#08589e"],
-    9: ["#f7fcf0", "#e0f3db", "#ccebc5", "#a8ddb5", "#7bccc4", "#4eb3d3", "#2b8cbe", "#0868ac", "#084081"],
+    9: ["#f7fcf0", "#e0f3db", "#ccebc5", "#a8ddb5", "#7bccc4", "#4eb3d3", "#2b8cbe", "#0868ac", "#084081"]
   },
   BuGn: {
     3: ["#e5f5f9", "#99d8c9", "#2ca25f"],
@@ -33,7 +33,7 @@ export const COLOR_PALETTES = {
     6: ["#edf8fb", "#ccece6", "#99d8c9", "#66c2a4", "#2ca25f", "#006d2c"],
     7: ["#edf8fb", "#ccece6", "#99d8c9", "#66c2a4", "#41ae76", "#238b45", "#005824"],
     8: ["#f7fcfd", "#e5f5f9", "#ccece6", "#99d8c9", "#66c2a4", "#41ae76", "#238b45", "#005824"],
-    9: ["#f7fcfd", "#e5f5f9", "#ccece6", "#99d8c9", "#66c2a4", "#41ae76", "#238b45", "#006d2c", "#00441b"],
+    9: ["#f7fcfd", "#e5f5f9", "#ccece6", "#99d8c9", "#66c2a4", "#41ae76", "#238b45", "#006d2c", "#00441b"]
   },
   PuBuGn: {
     3: ["#ece2f0", "#a6bddb", "#1c9099"],
@@ -42,7 +42,7 @@ export const COLOR_PALETTES = {
     6: ["#f6eff7", "#d0d1e6", "#a6bddb", "#67a9cf", "#1c9099", "#016c59"],
     7: ["#f6eff7", "#d0d1e6", "#a6bddb", "#67a9cf", "#3690c0", "#02818a", "#016450"],
     8: ["#fff7fb", "#ece2f0", "#d0d1e6", "#a6bddb", "#67a9cf", "#3690c0", "#02818a", "#016450"],
-    9: ["#fff7fb", "#ece2f0", "#d0d1e6", "#a6bddb", "#67a9cf", "#3690c0", "#02818a", "#016c59", "#014636"],
+    9: ["#fff7fb", "#ece2f0", "#d0d1e6", "#a6bddb", "#67a9cf", "#3690c0", "#02818a", "#016c59", "#014636"]
   },
   PuBu: {
     3: ["#ece7f2", "#a6bddb", "#2b8cbe"],
@@ -51,7 +51,7 @@ export const COLOR_PALETTES = {
     6: ["#f1eef6", "#d0d1e6", "#a6bddb", "#74a9cf", "#2b8cbe", "#045a8d"],
     7: ["#f1eef6", "#d0d1e6", "#a6bddb", "#74a9cf", "#3690c0", "#0570b0", "#034e7b"],
     8: ["#fff7fb", "#ece7f2", "#d0d1e6", "#a6bddb", "#74a9cf", "#3690c0", "#0570b0", "#034e7b"],
-    9: ["#fff7fb", "#ece7f2", "#d0d1e6", "#a6bddb", "#74a9cf", "#3690c0", "#0570b0", "#045a8d", "#023858"],
+    9: ["#fff7fb", "#ece7f2", "#d0d1e6", "#a6bddb", "#74a9cf", "#3690c0", "#0570b0", "#045a8d", "#023858"]
   },
   BuPu: {
     3: ["#e0ecf4", "#9ebcda", "#8856a7"],
@@ -60,7 +60,7 @@ export const COLOR_PALETTES = {
     6: ["#edf8fb", "#bfd3e6", "#9ebcda", "#8c96c6", "#8856a7", "#810f7c"],
     7: ["#edf8fb", "#bfd3e6", "#9ebcda", "#8c96c6", "#8c6bb1", "#88419d", "#6e016b"],
     8: ["#f7fcfd", "#e0ecf4", "#bfd3e6", "#9ebcda", "#8c96c6", "#8c6bb1", "#88419d", "#6e016b"],
-    9: ["#f7fcfd", "#e0ecf4", "#bfd3e6", "#9ebcda", "#8c96c6", "#8c6bb1", "#88419d", "#810f7c", "#4d004b"],
+    9: ["#f7fcfd", "#e0ecf4", "#bfd3e6", "#9ebcda", "#8c96c6", "#8c6bb1", "#88419d", "#810f7c", "#4d004b"]
   },
   RdPu: {
     3: ["#fde0dd", "#fa9fb5", "#c51b8a"],
@@ -69,7 +69,7 @@ export const COLOR_PALETTES = {
     6: ["#feebe2", "#fcc5c0", "#fa9fb5", "#f768a1", "#c51b8a", "#7a0177"],
     7: ["#feebe2", "#fcc5c0", "#fa9fb5", "#f768a1", "#dd3497", "#ae017e", "#7a0177"],
     8: ["#fff7f3", "#fde0dd", "#fcc5c0", "#fa9fb5", "#f768a1", "#dd3497", "#ae017e", "#7a0177"],
-    9: ["#fff7f3", "#fde0dd", "#fcc5c0", "#fa9fb5", "#f768a1", "#dd3497", "#ae017e", "#7a0177", "#49006a"],
+    9: ["#fff7f3", "#fde0dd", "#fcc5c0", "#fa9fb5", "#f768a1", "#dd3497", "#ae017e", "#7a0177", "#49006a"]
   },
   PuRd: {
     3: ["#e7e1ef", "#c994c7", "#dd1c77"],
@@ -78,7 +78,7 @@ export const COLOR_PALETTES = {
     6: ["#f1eef6", "#d4b9da", "#c994c7", "#df65b0", "#dd1c77", "#980043"],
     7: ["#f1eef6", "#d4b9da", "#c994c7", "#df65b0", "#e7298a", "#ce1256", "#91003f"],
     8: ["#f7f4f9", "#e7e1ef", "#d4b9da", "#c994c7", "#df65b0", "#e7298a", "#ce1256", "#91003f"],
-    9: ["#f7f4f9", "#e7e1ef", "#d4b9da", "#c994c7", "#df65b0", "#e7298a", "#ce1256", "#980043", "#67001f"],
+    9: ["#f7f4f9", "#e7e1ef", "#d4b9da", "#c994c7", "#df65b0", "#e7298a", "#ce1256", "#980043", "#67001f"]
   },
   OrRd: {
     3: ["#fee8c8", "#fdbb84", "#e34a33"],
@@ -87,7 +87,7 @@ export const COLOR_PALETTES = {
     6: ["#fef0d9", "#fdd49e", "#fdbb84", "#fc8d59", "#e34a33", "#b30000"],
     7: ["#fef0d9", "#fdd49e", "#fdbb84", "#fc8d59", "#ef6548", "#d7301f", "#990000"],
     8: ["#fff7ec", "#fee8c8", "#fdd49e", "#fdbb84", "#fc8d59", "#ef6548", "#d7301f", "#990000"],
-    9: ["#fff7ec", "#fee8c8", "#fdd49e", "#fdbb84", "#fc8d59", "#ef6548", "#d7301f", "#b30000", "#7f0000"],
+    9: ["#fff7ec", "#fee8c8", "#fdd49e", "#fdbb84", "#fc8d59", "#ef6548", "#d7301f", "#b30000", "#7f0000"]
   },
   YlOrRd: {
     3: ["#ffeda0", "#feb24c", "#f03b20"],
@@ -96,7 +96,7 @@ export const COLOR_PALETTES = {
     6: ["#ffffb2", "#fed976", "#feb24c", "#fd8d3c", "#f03b20", "#bd0026"],
     7: ["#ffffb2", "#fed976", "#feb24c", "#fd8d3c", "#fc4e2a", "#e31a1c", "#b10026"],
     8: ["#ffffcc", "#ffeda0", "#fed976", "#feb24c", "#fd8d3c", "#fc4e2a", "#e31a1c", "#b10026"],
-    9: ["#ffffcc", "#ffeda0", "#fed976", "#feb24c", "#fd8d3c", "#fc4e2a", "#e31a1c", "#bd0026", "#800026"],
+    9: ["#ffffcc", "#ffeda0", "#fed976", "#feb24c", "#fd8d3c", "#fc4e2a", "#e31a1c", "#bd0026", "#800026"]
   },
   YlOrBr: {
     3: ["#fff7bc", "#fec44f", "#d95f0e"],
@@ -105,7 +105,7 @@ export const COLOR_PALETTES = {
     6: ["#ffffd4", "#fee391", "#fec44f", "#fe9929", "#d95f0e", "#993404"],
     7: ["#ffffd4", "#fee391", "#fec44f", "#fe9929", "#ec7014", "#cc4c02", "#8c2d04"],
     8: ["#ffffe5", "#fff7bc", "#fee391", "#fec44f", "#fe9929", "#ec7014", "#cc4c02", "#8c2d04"],
-    9: ["#ffffe5", "#fff7bc", "#fee391", "#fec44f", "#fe9929", "#ec7014", "#cc4c02", "#993404", "#662506"],
+    9: ["#ffffe5", "#fff7bc", "#fee391", "#fec44f", "#fe9929", "#ec7014", "#cc4c02", "#993404", "#662506"]
   },
   Purples: {
     3: ["#efedf5", "#bcbddc", "#756bb1"],
@@ -114,7 +114,7 @@ export const COLOR_PALETTES = {
     6: ["#f2f0f7", "#dadaeb", "#bcbddc", "#9e9ac8", "#756bb1", "#54278f"],
     7: ["#f2f0f7", "#dadaeb", "#bcbddc", "#9e9ac8", "#807dba", "#6a51a3", "#4a1486"],
     8: ["#fcfbfd", "#efedf5", "#dadaeb", "#bcbddc", "#9e9ac8", "#807dba", "#6a51a3", "#4a1486"],
-    9: ["#fcfbfd", "#efedf5", "#dadaeb", "#bcbddc", "#9e9ac8", "#807dba", "#6a51a3", "#54278f", "#3f007d"],
+    9: ["#fcfbfd", "#efedf5", "#dadaeb", "#bcbddc", "#9e9ac8", "#807dba", "#6a51a3", "#54278f", "#3f007d"]
   },
   Blues: {
     3: ["#deebf7", "#9ecae1", "#3182bd"],
@@ -123,7 +123,7 @@ export const COLOR_PALETTES = {
     6: ["#eff3ff", "#c6dbef", "#9ecae1", "#6baed6", "#3182bd", "#08519c"],
     7: ["#eff3ff", "#c6dbef", "#9ecae1", "#6baed6", "#4292c6", "#2171b5", "#084594"],
     8: ["#f7fbff", "#deebf7", "#c6dbef", "#9ecae1", "#6baed6", "#4292c6", "#2171b5", "#084594"],
-    9: ["#f7fbff", "#deebf7", "#c6dbef", "#9ecae1", "#6baed6", "#4292c6", "#2171b5", "#08519c", "#08306b"],
+    9: ["#f7fbff", "#deebf7", "#c6dbef", "#9ecae1", "#6baed6", "#4292c6", "#2171b5", "#08519c", "#08306b"]
   },
   Greens: {
     3: ["#e5f5e0", "#a1d99b", "#31a354"],
@@ -132,7 +132,7 @@ export const COLOR_PALETTES = {
     6: ["#edf8e9", "#c7e9c0", "#a1d99b", "#74c476", "#31a354", "#006d2c"],
     7: ["#edf8e9", "#c7e9c0", "#a1d99b", "#74c476", "#41ab5d", "#238b45", "#005a32"],
     8: ["#f7fcf5", "#e5f5e0", "#c7e9c0", "#a1d99b", "#74c476", "#41ab5d", "#238b45", "#005a32"],
-    9: ["#f7fcf5", "#e5f5e0", "#c7e9c0", "#a1d99b", "#74c476", "#41ab5d", "#238b45", "#006d2c", "#00441b"],
+    9: ["#f7fcf5", "#e5f5e0", "#c7e9c0", "#a1d99b", "#74c476", "#41ab5d", "#238b45", "#006d2c", "#00441b"]
   },
   Oranges: {
     3: ["#fee6ce", "#fdae6b", "#e6550d"],
@@ -141,7 +141,7 @@ export const COLOR_PALETTES = {
     6: ["#feedde", "#fdd0a2", "#fdae6b", "#fd8d3c", "#e6550d", "#a63603"],
     7: ["#feedde", "#fdd0a2", "#fdae6b", "#fd8d3c", "#f16913", "#d94801", "#8c2d04"],
     8: ["#fff5eb", "#fee6ce", "#fdd0a2", "#fdae6b", "#fd8d3c", "#f16913", "#d94801", "#8c2d04"],
-    9: ["#fff5eb", "#fee6ce", "#fdd0a2", "#fdae6b", "#fd8d3c", "#f16913", "#d94801", "#a63603", "#7f2704"],
+    9: ["#fff5eb", "#fee6ce", "#fdd0a2", "#fdae6b", "#fd8d3c", "#f16913", "#d94801", "#a63603", "#7f2704"]
   },
   Reds: {
     3: ["#fee0d2", "#fc9272", "#de2d26"],
@@ -150,7 +150,7 @@ export const COLOR_PALETTES = {
     6: ["#fee5d9", "#fcbba1", "#fc9272", "#fb6a4a", "#de2d26", "#a50f15"],
     7: ["#fee5d9", "#fcbba1", "#fc9272", "#fb6a4a", "#ef3b2c", "#cb181d", "#99000d"],
     8: ["#fff5f0", "#fee0d2", "#fcbba1", "#fc9272", "#fb6a4a", "#ef3b2c", "#cb181d", "#99000d"],
-    9: ["#fff5f0", "#fee0d2", "#fcbba1", "#fc9272", "#fb6a4a", "#ef3b2c", "#cb181d", "#a50f15", "#67000d"],
+    9: ["#fff5f0", "#fee0d2", "#fcbba1", "#fc9272", "#fb6a4a", "#ef3b2c", "#cb181d", "#a50f15", "#67000d"]
   },
   Greys: {
     3: ["#f0f0f0", "#bdbdbd", "#636363"],
@@ -159,7 +159,7 @@ export const COLOR_PALETTES = {
     6: ["#f7f7f7", "#d9d9d9", "#bdbdbd", "#969696", "#636363", "#252525"],
     7: ["#f7f7f7", "#d9d9d9", "#bdbdbd", "#969696", "#737373", "#525252", "#252525"],
     8: ["#ffffff", "#f0f0f0", "#d9d9d9", "#bdbdbd", "#969696", "#737373", "#525252", "#252525"],
-    9: ["#ffffff", "#f0f0f0", "#d9d9d9", "#bdbdbd", "#969696", "#737373", "#525252", "#252525", "#000000"],
+    9: ["#ffffff", "#f0f0f0", "#d9d9d9", "#bdbdbd", "#969696", "#737373", "#525252", "#252525", "#000000"]
   },
   PuOr: {
     3: ["#f1a340", "#f7f7f7", "#998ec3"],
@@ -170,7 +170,7 @@ export const COLOR_PALETTES = {
     8: ["#b35806", "#e08214", "#fdb863", "#fee0b6", "#d8daeb", "#b2abd2", "#8073ac", "#542788"],
     9: ["#b35806", "#e08214", "#fdb863", "#fee0b6", "#f7f7f7", "#d8daeb", "#b2abd2", "#8073ac", "#542788"],
     10: ["#7f3b08", "#b35806", "#e08214", "#fdb863", "#fee0b6", "#d8daeb", "#b2abd2", "#8073ac", "#542788", "#2d004b"],
-    11: ["#7f3b08", "#b35806", "#e08214", "#fdb863", "#fee0b6", "#f7f7f7", "#d8daeb", "#b2abd2", "#8073ac", "#542788", "#2d004b"],
+    11: ["#7f3b08", "#b35806", "#e08214", "#fdb863", "#fee0b6", "#f7f7f7", "#d8daeb", "#b2abd2", "#8073ac", "#542788", "#2d004b"]
   },
   BrBG: {
     3: ["#d8b365", "#f5f5f5", "#5ab4ac"],
@@ -181,7 +181,7 @@ export const COLOR_PALETTES = {
     8: ["#8c510a", "#bf812d", "#dfc27d", "#f6e8c3", "#c7eae5", "#80cdc1", "#35978f", "#01665e"],
     9: ["#8c510a", "#bf812d", "#dfc27d", "#f6e8c3", "#f5f5f5", "#c7eae5", "#80cdc1", "#35978f", "#01665e"],
     10: ["#543005", "#8c510a", "#bf812d", "#dfc27d", "#f6e8c3", "#c7eae5", "#80cdc1", "#35978f", "#01665e", "#003c30"],
-    11: ["#543005", "#8c510a", "#bf812d", "#dfc27d", "#f6e8c3", "#f5f5f5", "#c7eae5", "#80cdc1", "#35978f", "#01665e", "#003c30"],
+    11: ["#543005", "#8c510a", "#bf812d", "#dfc27d", "#f6e8c3", "#f5f5f5", "#c7eae5", "#80cdc1", "#35978f", "#01665e", "#003c30"]
   },
   PRGn: {
     3: ["#af8dc3", "#f7f7f7", "#7fbf7b"],
@@ -192,7 +192,7 @@ export const COLOR_PALETTES = {
     8: ["#762a83", "#9970ab", "#c2a5cf", "#e7d4e8", "#d9f0d3", "#a6dba0", "#5aae61", "#1b7837"],
     9: ["#762a83", "#9970ab", "#c2a5cf", "#e7d4e8", "#f7f7f7", "#d9f0d3", "#a6dba0", "#5aae61", "#1b7837"],
     10: ["#40004b", "#762a83", "#9970ab", "#c2a5cf", "#e7d4e8", "#d9f0d3", "#a6dba0", "#5aae61", "#1b7837", "#00441b"],
-    11: ["#40004b", "#762a83", "#9970ab", "#c2a5cf", "#e7d4e8", "#f7f7f7", "#d9f0d3", "#a6dba0", "#5aae61", "#1b7837", "#00441b"],
+    11: ["#40004b", "#762a83", "#9970ab", "#c2a5cf", "#e7d4e8", "#f7f7f7", "#d9f0d3", "#a6dba0", "#5aae61", "#1b7837", "#00441b"]
   },
   PiYG: {
     3: ["#e9a3c9", "#f7f7f7", "#a1d76a"],
@@ -203,7 +203,7 @@ export const COLOR_PALETTES = {
     8: ["#c51b7d", "#de77ae", "#f1b6da", "#fde0ef", "#e6f5d0", "#b8e186", "#7fbc41", "#4d9221"],
     9: ["#c51b7d", "#de77ae", "#f1b6da", "#fde0ef", "#f7f7f7", "#e6f5d0", "#b8e186", "#7fbc41", "#4d9221"],
     10: ["#8e0152", "#c51b7d", "#de77ae", "#f1b6da", "#fde0ef", "#e6f5d0", "#b8e186", "#7fbc41", "#4d9221", "#276419"],
-    11: ["#8e0152", "#c51b7d", "#de77ae", "#f1b6da", "#fde0ef", "#f7f7f7", "#e6f5d0", "#b8e186", "#7fbc41", "#4d9221", "#276419"],
+    11: ["#8e0152", "#c51b7d", "#de77ae", "#f1b6da", "#fde0ef", "#f7f7f7", "#e6f5d0", "#b8e186", "#7fbc41", "#4d9221", "#276419"]
   },
   RdBu: {
     3: ["#ef8a62", "#f7f7f7", "#67a9cf"],
@@ -214,7 +214,7 @@ export const COLOR_PALETTES = {
     8: ["#b2182b", "#d6604d", "#f4a582", "#fddbc7", "#d1e5f0", "#92c5de", "#4393c3", "#2166ac"],
     9: ["#b2182b", "#d6604d", "#f4a582", "#fddbc7", "#f7f7f7", "#d1e5f0", "#92c5de", "#4393c3", "#2166ac"],
     10: ["#67001f", "#b2182b", "#d6604d", "#f4a582", "#fddbc7", "#d1e5f0", "#92c5de", "#4393c3", "#2166ac", "#053061"],
-    11: ["#67001f", "#b2182b", "#d6604d", "#f4a582", "#fddbc7", "#f7f7f7", "#d1e5f0", "#92c5de", "#4393c3", "#2166ac", "#053061"],
+    11: ["#67001f", "#b2182b", "#d6604d", "#f4a582", "#fddbc7", "#f7f7f7", "#d1e5f0", "#92c5de", "#4393c3", "#2166ac", "#053061"]
   },
   RdGy: {
     3: ["#ef8a62", "#ffffff", "#999999"],
@@ -225,7 +225,7 @@ export const COLOR_PALETTES = {
     8: ["#b2182b", "#d6604d", "#f4a582", "#fddbc7", "#e0e0e0", "#bababa", "#878787", "#4d4d4d"],
     9: ["#b2182b", "#d6604d", "#f4a582", "#fddbc7", "#ffffff", "#e0e0e0", "#bababa", "#878787", "#4d4d4d"],
     10: ["#67001f", "#b2182b", "#d6604d", "#f4a582", "#fddbc7", "#e0e0e0", "#bababa", "#878787", "#4d4d4d", "#1a1a1a"],
-    11: ["#67001f", "#b2182b", "#d6604d", "#f4a582", "#fddbc7", "#ffffff", "#e0e0e0", "#bababa", "#878787", "#4d4d4d", "#1a1a1a"],
+    11: ["#67001f", "#b2182b", "#d6604d", "#f4a582", "#fddbc7", "#ffffff", "#e0e0e0", "#bababa", "#878787", "#4d4d4d", "#1a1a1a"]
   },
   RdYlBu: {
     3: ["#fc8d59", "#ffffbf", "#91bfdb"],
@@ -236,7 +236,7 @@ export const COLOR_PALETTES = {
     8: ["#d73027", "#f46d43", "#fdae61", "#fee090", "#e0f3f8", "#abd9e9", "#74add1", "#4575b4"],
     9: ["#d73027", "#f46d43", "#fdae61", "#fee090", "#ffffbf", "#e0f3f8", "#abd9e9", "#74add1", "#4575b4"],
     10: ["#a50026", "#d73027", "#f46d43", "#fdae61", "#fee090", "#e0f3f8", "#abd9e9", "#74add1", "#4575b4", "#313695"],
-    11: ["#a50026", "#d73027", "#f46d43", "#fdae61", "#fee090", "#ffffbf", "#e0f3f8", "#abd9e9", "#74add1", "#4575b4", "#313695"],
+    11: ["#a50026", "#d73027", "#f46d43", "#fdae61", "#fee090", "#ffffbf", "#e0f3f8", "#abd9e9", "#74add1", "#4575b4", "#313695"]
   },
   Spectral: {
     3: ["#fc8d59", "#ffffbf", "#99d594"],
@@ -247,7 +247,7 @@ export const COLOR_PALETTES = {
     8: ["#d53e4f", "#f46d43", "#fdae61", "#fee08b", "#e6f598", "#abdda4", "#66c2a5", "#3288bd"],
     9: ["#d53e4f", "#f46d43", "#fdae61", "#fee08b", "#ffffbf", "#e6f598", "#abdda4", "#66c2a5", "#3288bd"],
     10: ["#9e0142", "#d53e4f", "#f46d43", "#fdae61", "#fee08b", "#e6f598", "#abdda4", "#66c2a5", "#3288bd", "#5e4fa2"],
-    11: ["#9e0142", "#d53e4f", "#f46d43", "#fdae61", "#fee08b", "#ffffbf", "#e6f598", "#abdda4", "#66c2a5", "#3288bd", "#5e4fa2"],
+    11: ["#9e0142", "#d53e4f", "#f46d43", "#fdae61", "#fee08b", "#ffffbf", "#e6f598", "#abdda4", "#66c2a5", "#3288bd", "#5e4fa2"]
   },
   RdYlGn: {
     3: ["#fc8d59", "#ffffbf", "#91cf60"],
@@ -258,7 +258,7 @@ export const COLOR_PALETTES = {
     8: ["#d73027", "#f46d43", "#fdae61", "#fee08b", "#d9ef8b", "#a6d96a", "#66bd63", "#1a9850"],
     9: ["#d73027", "#f46d43", "#fdae61", "#fee08b", "#ffffbf", "#d9ef8b", "#a6d96a", "#66bd63", "#1a9850"],
     10: ["#a50026", "#d73027", "#f46d43", "#fdae61", "#fee08b", "#d9ef8b", "#a6d96a", "#66bd63", "#1a9850", "#006837"],
-    11: ["#a50026", "#d73027", "#f46d43", "#fdae61", "#fee08b", "#ffffbf", "#d9ef8b", "#a6d96a", "#66bd63", "#1a9850", "#006837"],
+    11: ["#a50026", "#d73027", "#f46d43", "#fdae61", "#fee08b", "#ffffbf", "#d9ef8b", "#a6d96a", "#66bd63", "#1a9850", "#006837"]
   },
   Accent: {
     3: ["#7fc97f", "#beaed4", "#fdc086"],
@@ -266,7 +266,7 @@ export const COLOR_PALETTES = {
     5: ["#7fc97f", "#beaed4", "#fdc086", "#ffff99", "#386cb0"],
     6: ["#7fc97f", "#beaed4", "#fdc086", "#ffff99", "#386cb0", "#f0027f"],
     7: ["#7fc97f", "#beaed4", "#fdc086", "#ffff99", "#386cb0", "#f0027f", "#bf5b17"],
-    8: ["#7fc97f", "#beaed4", "#fdc086", "#ffff99", "#386cb0", "#f0027f", "#bf5b17", "#666666"],
+    8: ["#7fc97f", "#beaed4", "#fdc086", "#ffff99", "#386cb0", "#f0027f", "#bf5b17", "#666666"]
   },
   Dark2: {
     3: ["#1b9e77", "#d95f02", "#7570b3"],
@@ -274,7 +274,7 @@ export const COLOR_PALETTES = {
     5: ["#1b9e77", "#d95f02", "#7570b3", "#e7298a", "#66a61e"],
     6: ["#1b9e77", "#d95f02", "#7570b3", "#e7298a", "#66a61e", "#e6ab02"],
     7: ["#1b9e77", "#d95f02", "#7570b3", "#e7298a", "#66a61e", "#e6ab02", "#a6761d"],
-    8: ["#1b9e77", "#d95f02", "#7570b3", "#e7298a", "#66a61e", "#e6ab02", "#a6761d", "#666666"],
+    8: ["#1b9e77", "#d95f02", "#7570b3", "#e7298a", "#66a61e", "#e6ab02", "#a6761d", "#666666"]
   },
   Paired: {
     3: ["#a6cee3", "#1f78b4", "#b2df8a"],
@@ -286,7 +286,7 @@ export const COLOR_PALETTES = {
     9: ["#a6cee3", "#1f78b4", "#b2df8a", "#33a02c", "#fb9a99", "#e31a1c", "#fdbf6f", "#ff7f00", "#cab2d6"],
     10: ["#a6cee3", "#1f78b4", "#b2df8a", "#33a02c", "#fb9a99", "#e31a1c", "#fdbf6f", "#ff7f00", "#cab2d6", "#6a3d9a"],
     11: ["#a6cee3", "#1f78b4", "#b2df8a", "#33a02c", "#fb9a99", "#e31a1c", "#fdbf6f", "#ff7f00", "#cab2d6", "#6a3d9a", "#ffff99"],
-    12: ["#a6cee3", "#1f78b4", "#b2df8a", "#33a02c", "#fb9a99", "#e31a1c", "#fdbf6f", "#ff7f00", "#cab2d6", "#6a3d9a", "#ffff99", "#b15928"],
+    12: ["#a6cee3", "#1f78b4", "#b2df8a", "#33a02c", "#fb9a99", "#e31a1c", "#fdbf6f", "#ff7f00", "#cab2d6", "#6a3d9a", "#ffff99", "#b15928"]
   },
   Pastel1: {
     3: ["#fbb4ae", "#b3cde3", "#ccebc5"],
@@ -295,7 +295,7 @@ export const COLOR_PALETTES = {
     6: ["#fbb4ae", "#b3cde3", "#ccebc5", "#decbe4", "#fed9a6", "#ffffcc"],
     7: ["#fbb4ae", "#b3cde3", "#ccebc5", "#decbe4", "#fed9a6", "#ffffcc", "#e5d8bd"],
     8: ["#fbb4ae", "#b3cde3", "#ccebc5", "#decbe4", "#fed9a6", "#ffffcc", "#e5d8bd", "#fddaec"],
-    9: ["#fbb4ae", "#b3cde3", "#ccebc5", "#decbe4", "#fed9a6", "#ffffcc", "#e5d8bd", "#fddaec", "#f2f2f2"],
+    9: ["#fbb4ae", "#b3cde3", "#ccebc5", "#decbe4", "#fed9a6", "#ffffcc", "#e5d8bd", "#fddaec", "#f2f2f2"]
   },
   Pastel2: {
     3: ["#b3e2cd", "#fdcdac", "#cbd5e8"],
@@ -303,7 +303,7 @@ export const COLOR_PALETTES = {
     5: ["#b3e2cd", "#fdcdac", "#cbd5e8", "#f4cae4", "#e6f5c9"],
     6: ["#b3e2cd", "#fdcdac", "#cbd5e8", "#f4cae4", "#e6f5c9", "#fff2ae"],
     7: ["#b3e2cd", "#fdcdac", "#cbd5e8", "#f4cae4", "#e6f5c9", "#fff2ae", "#f1e2cc"],
-    8: ["#b3e2cd", "#fdcdac", "#cbd5e8", "#f4cae4", "#e6f5c9", "#fff2ae", "#f1e2cc", "#cccccc"],
+    8: ["#b3e2cd", "#fdcdac", "#cbd5e8", "#f4cae4", "#e6f5c9", "#fff2ae", "#f1e2cc", "#cccccc"]
   },
   Set1: {
     3: ["#e41a1c", "#377eb8", "#4daf4a"],
@@ -312,7 +312,7 @@ export const COLOR_PALETTES = {
     6: ["#e41a1c", "#377eb8", "#4daf4a", "#984ea3", "#ff7f00", "#ffff33"],
     7: ["#e41a1c", "#377eb8", "#4daf4a", "#984ea3", "#ff7f00", "#ffff33", "#a65628"],
     8: ["#e41a1c", "#377eb8", "#4daf4a", "#984ea3", "#ff7f00", "#ffff33", "#a65628", "#f781bf"],
-    9: ["#e41a1c", "#377eb8", "#4daf4a", "#984ea3", "#ff7f00", "#ffff33", "#a65628", "#f781bf", "#999999"],
+    9: ["#e41a1c", "#377eb8", "#4daf4a", "#984ea3", "#ff7f00", "#ffff33", "#a65628", "#f781bf", "#999999"]
   },
   Set2: {
     3: ["#66c2a5", "#fc8d62", "#8da0cb"],
@@ -320,7 +320,7 @@ export const COLOR_PALETTES = {
     5: ["#66c2a5", "#fc8d62", "#8da0cb", "#e78ac3", "#a6d854"],
     6: ["#66c2a5", "#fc8d62", "#8da0cb", "#e78ac3", "#a6d854", "#ffd92f"],
     7: ["#66c2a5", "#fc8d62", "#8da0cb", "#e78ac3", "#a6d854", "#ffd92f", "#e5c494"],
-    8: ["#66c2a5", "#fc8d62", "#8da0cb", "#e78ac3", "#a6d854", "#ffd92f", "#e5c494", "#b3b3b3"],
+    8: ["#66c2a5", "#fc8d62", "#8da0cb", "#e78ac3", "#a6d854", "#ffd92f", "#e5c494", "#b3b3b3"]
   },
   Set3: {
     3: ["#8dd3c7", "#ffffb3", "#bebada"],
@@ -332,7 +332,7 @@ export const COLOR_PALETTES = {
     9: ["#8dd3c7", "#ffffb3", "#bebada", "#fb8072", "#80b1d3", "#fdb462", "#b3de69", "#fccde5", "#d9d9d9"],
     10: ["#8dd3c7", "#ffffb3", "#bebada", "#fb8072", "#80b1d3", "#fdb462", "#b3de69", "#fccde5", "#d9d9d9", "#bc80bd"],
     11: ["#8dd3c7", "#ffffb3", "#bebada", "#fb8072", "#80b1d3", "#fdb462", "#b3de69", "#fccde5", "#d9d9d9", "#bc80bd", "#ccebc5"],
-    12: ["#8dd3c7", "#ffffb3", "#bebada", "#fb8072", "#80b1d3", "#fdb462", "#b3de69", "#fccde5", "#d9d9d9", "#bc80bd", "#ccebc5", "#ffed6f"],
+    12: ["#8dd3c7", "#ffffb3", "#bebada", "#fb8072", "#80b1d3", "#fdb462", "#b3de69", "#fccde5", "#d9d9d9", "#bc80bd", "#ccebc5", "#ffed6f"]
   },
   YlOrBr_reverse: {
     3: ["#d95f0e", "#fec44f", "#fff7bc"],
@@ -341,7 +341,7 @@ export const COLOR_PALETTES = {
     6: ["#993404", "#d95f0e", "#fe9929", "#fec44f", "#fee391", "#ffffd4"],
     7: ["#8c2d04", "#cc4c02", "#ec7014", "#fe9929", "#fec44f", "#fee391", "#ffffd4"],
     8: ["#8c2d04", "#cc4c02", "#ec7014", "#fe9929", "#fec44f", "#fee391", "#fff7bc", "#ffffe5"],
-    9: ["#662506", "#993404", "#cc4c02", "#ec7014", "#fe9929", "#fec44f", "#fee391", "#fff7bc", "#ffffe5"],
+    9: ["#662506", "#993404", "#cc4c02", "#ec7014", "#fe9929", "#fec44f", "#fee391", "#fff7bc", "#ffffe5"]
   },
   Reds_reverse: {
     3: ["#de2d26", "#fc9272", "#fee0d2"],
@@ -350,7 +350,7 @@ export const COLOR_PALETTES = {
     6: ["#a50f15", "#de2d26", "#fb6a4a", "#fc9272", "#fcbba1", "#fee5d9"],
     7: ["#99000d", "#cb181d", "#ef3b2c", "#fb6a4a", "#fc9272", "#fcbba1", "#fee5d9"],
     8: ["#99000d", "#cb181d", "#ef3b2c", "#fb6a4a", "#fc9272", "#fcbba1", "#fee0d2", "#fff5f0"],
-    9: ["#67000d", "#a50f15", "#cb181d", "#ef3b2c", "#fb6a4a", "#fc9272", "#fcbba1", "#fee0d2", "#fff5f0"],
+    9: ["#67000d", "#a50f15", "#cb181d", "#ef3b2c", "#fb6a4a", "#fc9272", "#fcbba1", "#fee0d2", "#fff5f0"]
   },
   YlGn_reverse: {
     3: ["#31a354", "#addd8e", "#f7fcb9"],
@@ -359,7 +359,7 @@ export const COLOR_PALETTES = {
     6: ["#006837", "#31a354", "#78c679", "#addd8e", "#d9f0a3", "#ffffcc"],
     7: ["#005a32", "#238443", "#41ab5d", "#78c679", "#addd8e", "#d9f0a3", "#ffffcc"],
     8: ["#005a32", "#238443", "#41ab5d", "#78c679", "#addd8e", "#d9f0a3", "#f7fcb9", "#ffffe5"],
-    9: ["#004529", "#006837", "#238443", "#41ab5d", "#78c679", "#addd8e", "#d9f0a3", "#f7fcb9", "#ffffe5"],
+    9: ["#004529", "#006837", "#238443", "#41ab5d", "#78c679", "#addd8e", "#d9f0a3", "#f7fcb9", "#ffffe5"]
   },
   Greens_reverse: {
     3: ["#31a354", "#a1d99b", "#e5f5e0"],
@@ -368,7 +368,7 @@ export const COLOR_PALETTES = {
     6: ["#006d2c", "#31a354", "#74c476", "#a1d99b", "#c7e9c0", "#edf8e9"],
     7: ["#005a32", "#238b45", "#41ab5d", "#74c476", "#a1d99b", "#c7e9c0", "#edf8e9"],
     8: ["#005a32", "#238b45", "#41ab5d", "#74c476", "#a1d99b", "#c7e9c0", "#e5f5e0", "#f7fcf5"],
-    9: ["#00441b", "#006d2c", "#238b45", "#41ab5d", "#74c476", "#a1d99b", "#c7e9c0", "#e5f5e0", "#f7fcf5"],
+    9: ["#00441b", "#006d2c", "#238b45", "#41ab5d", "#74c476", "#a1d99b", "#c7e9c0", "#e5f5e0", "#f7fcf5"]
   },
   Blues_reverse: {
     3: ["#3182bd", "#9ecae1", "#deebf7"],
@@ -377,7 +377,7 @@ export const COLOR_PALETTES = {
     6: ["#08519c", "#3182bd", "#6baed6", "#9ecae1", "#c6dbef", "#eff3ff"],
     7: ["#084594", "#2171b5", "#4292c6", "#6baed6", "#9ecae1", "#c6dbef", "#eff3ff"],
     8: ["#084594", "#2171b5", "#4292c6", "#6baed6", "#9ecae1", "#c6dbef", "#deebf7", "#f7fbff"],
-    9: ["#08306b", "#08519c", "#2171b5", "#4292c6", "#6baed6", "#9ecae1", "#c6dbef", "#deebf7", "#f7fbff"],
+    9: ["#08306b", "#08519c", "#2171b5", "#4292c6", "#6baed6", "#9ecae1", "#c6dbef", "#deebf7", "#f7fbff"]
   },
   BuPu_reverse: {
     3: ["#8856a7", "#9ebcda", "#e0ecf4"],
@@ -386,7 +386,7 @@ export const COLOR_PALETTES = {
     6: ["#810f7c", "#8856a7", "#8c96c6", "#9ebcda", "#bfd3e6", "#edf8fb"],
     7: ["#6e016b", "#88419d", "#8c6bb1", "#8c96c6", "#9ebcda", "#bfd3e6", "#edf8fb"],
     8: ["#6e016b", "#88419d", "#8c6bb1", "#8c96c6", "#9ebcda", "#bfd3e6", "#e0ecf4", "#f7fcfd"],
-    9: ["#4d004b", "#810f7c", "#88419d", "#8c6bb1", "#8c96c6", "#9ebcda", "#bfd3e6", "#e0ecf4", "#f7fcfd"],
+    9: ["#4d004b", "#810f7c", "#88419d", "#8c6bb1", "#8c96c6", "#9ebcda", "#bfd3e6", "#e0ecf4", "#f7fcfd"]
   },
   RdPu_reverse: {
     3: ["#c51b8a", "#fa9fb5", "#fde0dd"],
@@ -395,7 +395,7 @@ export const COLOR_PALETTES = {
     6: ["#7a0177", "#c51b8a", "#f768a1", "#fa9fb5", "#fcc5c0", "#feebe2"],
     7: ["#7a0177", "#ae017e", "#dd3497", "#f768a1", "#fa9fb5", "#fcc5c0", "#feebe2"],
     8: ["#7a0177", "#ae017e", "#dd3497", "#f768a1", "#fa9fb5", "#fcc5c0", "#fde0dd", "#fff7f3"],
-    9: ["#49006a", "#7a0177", "#ae017e", "#dd3497", "#f768a1", "#fa9fb5", "#fcc5c0", "#fde0dd", "#fff7f3"],
+    9: ["#49006a", "#7a0177", "#ae017e", "#dd3497", "#f768a1", "#fa9fb5", "#fcc5c0", "#fde0dd", "#fff7f3"]
   },
   PuRd_reverse: {
     3: ["#dd1c77", "#c994c7", "#e7e1ef"],
@@ -404,7 +404,7 @@ export const COLOR_PALETTES = {
     6: ["#980043", "#dd1c77", "#df65b0", "#c994c7", "#d4b9da", "#f1eef6"],
     7: ["#91003f", "#ce1256", "#e7298a", "#df65b0", "#c994c7", "#d4b9da", "#f1eef6"],
     8: ["#91003f", "#ce1256", "#e7298a", "#df65b0", "#c994c7", "#d4b9da", "#e7e1ef", "#f7f4f9"],
-    9: ["#67001f", "#980043", "#ce1256", "#e7298a", "#df65b0", "#c994c7", "#d4b9da", "#e7e1ef", "#f7f4f9"],
+    9: ["#67001f", "#980043", "#ce1256", "#e7298a", "#df65b0", "#c994c7", "#d4b9da", "#e7e1ef", "#f7f4f9"]
   },
   Greys_reverse: {
     3: ["#636363", "#bdbdbd", "#f0f0f0"],
@@ -413,21 +413,8 @@ export const COLOR_PALETTES = {
     6: ["#252525", "#636363", "#969696", "#bdbdbd", "#d9d9d9", "#f7f7f7"],
     7: ["#252525", "#525252", "#737373", "#969696", "#bdbdbd", "#d9d9d9", "#f7f7f7"],
     8: ["#252525", "#525252", "#737373", "#969696", "#bdbdbd", "#d9d9d9", "#f0f0f0", "#ffffff"],
-    9: ["#000000", "#252525", "#525252", "#737373", "#969696", "#bdbdbd", "#d9d9d9", "#f0f0f0", "#ffffff"],
-  },
+    9: ["#000000", "#252525", "#525252", "#737373", "#969696", "#bdbdbd", "#d9d9d9", "#f0f0f0", "#ffffff"]
+  }
 };
 // Qualitative colors From ColorBrewer (reordered 12-class)
-export const qualitativeColors = [
-  "#1f78b4",
-  "#ff7f00",
-  "#33a02c",
-  "#a6cee3",
-  "#b2df8a",
-  "#fb9a99",
-  "#fdbf6f",
-  "#cab2d6",
-  "#ffff99",
-  "#b15928",
-  "#6a3d9a",
-  "#e31a1c",
-];
+export const qualitativeColors = ["#1f78b4", "#ff7f00", "#33a02c", "#a6cee3", "#b2df8a", "#fb9a99", "#fdbf6f", "#cab2d6", "#ffff99", "#b15928", "#6a3d9a", "#e31a1c"];

package/build/es/components/Map/components/ThematicLayerConfiguration/components/ColorScaleSelect/index.js

@@ -0,0 +1,53 @@
+import React, { Fragment, useRef, useState } from "react";
+import { Popover } from "@dhis2/ui";
+import cx from "classnames";
+import ColorScale from "./components/ColorScale";
+import styles from "./styles/ColorScaleSelect.module.css";
+import { colorScales, defaultColorScale, defaultColorScaleName, getColorPalette, getColorScale } from "./utils/colors";
+const ColorScaleSelect = _ref => {
+  var _getColorScale;
+  let {
+    colorClass,
+    count,
+    width,
+    onChange,
+    className
+  } = _ref;
+  const [isOpen, setIsOpen] = useState(false);
+  const anchorRef = useRef(null);
+  const palette = getColorPalette(colorClass, count);
+  const bins = palette.split(",").length;
+  const scale = (_getColorScale = getColorScale(palette)) !== null && _getColorScale !== void 0 ? _getColorScale : defaultColorScale;
+  const onColorScaleSelect = scale => {
+    onChange(scale);
+    setIsOpen(false);
+  };
+  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
+    ref: anchorRef,
+    className: cx(styles.colorScale, className)
+  }, /*#__PURE__*/React.createElement(ColorScale, {
+    bins: bins,
+    scale: scale !== null && scale !== void 0 ? scale : defaultColorScaleName,
+    onClick: () => setIsOpen(true),
+    width: width || 260
+  })), isOpen && /*#__PURE__*/React.createElement(Popover, {
+    reference: anchorRef,
+    arrow: false,
+    placement: "right",
+    onClickOutside: () => setIsOpen(false)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles.popover,
+    style: {
+      width: width + 24 || 260,
+      height: "100%",
+      overflow: "auto"
+    }
+  }, colorScales.map((scale, index) => /*#__PURE__*/React.createElement(ColorScale, {
+    key: index,
+    scale: scale,
+    bins: bins,
+    onClick: onColorScaleSelect,
+    width: width || 260
+  })))));
+};
+export default ColorScaleSelect;

package/build/es/components/Map/components/ThematicLayerConfiguration/components/ColorScaleSelect/styles/ColorScale.module.css

@@ -0,0 +1,15 @@
+.colorScale {
+    margin: 0;
+    padding-left: 0;
+    height: 36px;
+    cursor: pointer;
+    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.12);
+    display: inline-block;
+    white-space: nowrap;
+}
+
+.item {
+    margin-left: 0;
+    display: inline-block;
+    height: 100%;
+}

package/build/es/components/Map/components/ThematicLayerConfiguration/components/ColorScaleSelect/styles/ColorScaleSelect.module.css

@@ -0,0 +1,12 @@
+.colorScale {
+    display: inline-block;
+    margin-top: 4px;
+    overflow: visible;
+    white-space: nowrap;
+}
+
+.popover {
+    padding: 4px 8px;
+    overflow-y: auto;
+    max-height: 50vh;
+}

package/build/es/components/Map/components/ThematicLayerConfiguration/components/ColorScaleSelect/utils/colors.js

@@ -0,0 +1,56 @@
+import { hcl } from "d3-color";
+import { isString } from "lodash";
+import { COLOR_PALETTES } from "../constants/colors";
+const colorbrewer = COLOR_PALETTES;
+
+// Returns a color brewer scale for a number of classes
+export const getColorPalette = (scale, classes) => {
+  return colorbrewer[scale][classes].join(",");
+};
+
+// Returns color scale name for a palette
+export const getColorScale = palette => {
+  const classes = palette.split(",").length;
+  return colorScales.find(name => {
+    var _colorbrewer$name, _colorbrewer$name$cla;
+    return ((_colorbrewer$name = colorbrewer[name]) === null || _colorbrewer$name === void 0 ? void 0 : (_colorbrewer$name$cla = _colorbrewer$name[classes]) === null || _colorbrewer$name$cla === void 0 ? void 0 : _colorbrewer$name$cla.join(",")) === palette;
+  });
+};
+export const defaultColorScaleName = "YlOrBr";
+export const defaultClasses = 5;
+export const defaultColorScale = getColorPalette(defaultColorScaleName, defaultClasses);
+
+// Correct colors not adhering to the css standard (add missing #)
+export const cssColor = color => {
+  if (!isString(color)) {
+    return color;
+  } else if (color === "##normal") {
+    // ##normal is used in old map favorites
+    return null; // Will apply default color
+  }
+
+  return (/(^[0-9A-F]{6}$)|(^[0-9A-F]{3}$)/i.test(color) ? "#" : "") + color;
+};
+
+// Returns an unique color (first from an array, then random but still unique)
+export const getUniqueColor = defaultColors => {
+  const colors = [...defaultColors];
+  function randomColor() {
+    const color = "#000000".replace(/0/g, () => (~~(Math.random() * 16)).toString(16));
+
+    // Recursive until color is unique
+    if (colors.includes(color)) {
+      return randomColor();
+    }
+    colors.push(color);
+    return color;
+  }
+  return index => colors[index] || randomColor();
+};
+
+// Returns true if a color is dark
+export const isDarkColor = color => hcl(color).l < 70;
+
+// Returns constrasting color
+export const getContrastColor = color => isDarkColor(color) ? "#fff" : "#000";
+export const colorScales = ["YlOrBr", "Reds", "YlGn", "Greens", "Blues", "BuPu", "RdPu", "PuRd", "Greys", "YlOrBr_reverse", "Reds_reverse", "YlGn_reverse", "Greens_reverse", "Blues_reverse", "BuPu_reverse", "RdPu_reverse", "PuRd_reverse", "Greys_reverse", "PuOr", "BrBG", "PRGn", "PiYG", "RdBu", "RdGy", "RdYlBu", "Spectral", "RdYlGn", "Paired", "Pastel1", "Set1", "Set3"];

package/build/es/components/Map/components/ThematicLayerConfiguration/components/CustomLegend/index.js

@@ -0,0 +1,64 @@
+import { Controller, useWatch } from "react-hook-form";
+import { Field, SingleSelectField, SingleSelectOption } from "@dhis2/ui";
+import { defaultClasses, defaultColorScaleName } from "../../../../utils/colors";
+import i18n from "@dhis2/d2-i18n";
+import ColorScaleSelect from "../ColorScaleSelect";
+import React from "react";
+export function CustomLegend() {
+  const scale = useWatch({
+    name: "dataItem.legendConfig.scale"
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    className: "row gap-16 space-between"
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      width: "30%"
+    }
+  }, /*#__PURE__*/React.createElement(Controller, {
+    name: "dataItem.legendConfig.scale",
+    render: _ref => {
+      var _fieldState$error, _field$value$toString, _field$value;
+      let {
+        field,
+        fieldState
+      } = _ref;
+      return /*#__PURE__*/React.createElement(SingleSelectField, {
+        validationText: (_fieldState$error = fieldState.error) === null || _fieldState$error === void 0 ? void 0 : _fieldState$error.message,
+        error: Boolean(fieldState.error),
+        selected: (_field$value$toString = (_field$value = field.value) === null || _field$value === void 0 ? void 0 : _field$value.toString()) !== null && _field$value$toString !== void 0 ? _field$value$toString : defaultClasses.toString(),
+        label: i18n.t("Classes"),
+        onChange: _ref2 => {
+          let {
+            selected
+          } = _ref2;
+          return field.onChange(parseInt(selected));
+        },
+        name: "scale"
+      }, [3, 4, 5, 6, 7, 8, 9].map(value => /*#__PURE__*/React.createElement(SingleSelectOption, {
+        key: `${value}-classes-option`,
+        label: `${value}`,
+        value: value === null || value === void 0 ? void 0 : value.toString()
+      })));
+    }
+  })), /*#__PURE__*/React.createElement("div", {
+    style: {
+      width: "70%"
+    }
+  }, /*#__PURE__*/React.createElement(Controller, {
+    name: "dataItem.legendConfig.colorClass",
+    render: _ref3 => {
+      var _field$value2;
+      let {
+        field
+      } = _ref3;
+      return /*#__PURE__*/React.createElement(Field, {
+        label: i18n.t("Colors")
+      }, /*#__PURE__*/React.createElement(ColorScaleSelect, {
+        count: scale !== null && scale !== void 0 ? scale : defaultClasses,
+        colorClass: (_field$value2 = field.value) !== null && _field$value2 !== void 0 ? _field$value2 : defaultColorScaleName,
+        width: 300,
+        onChange: field.onChange
+      }));
+    }
+  })));
+}