Update colors of the tick

mustafasaifee42 · mustafasaifee42 · commit 3f530ff110d2 · 2025-02-03T20:02:18.000+02:00
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@undp-data/undp-visualization-library",
-  "version": "1.0.33",
+  "version": "1.0.34",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
   "browser": "./dist/index.umd.js",
@@ -88,7 +88,7 @@
     "math-expression-evaluator": "^2.0.6",
     "papaparse": "^5.4.1",
     "pmtiles": "^3.0.6",
-    "rc-slider": "^11.1.5",
+    "rc-slider": "^11.1.8",
     "react-csv": "^2.2.2",
     "react-draggable": "^4.4.6",
     "react-select": "^5.8.0",
diff --git a/src/Components/ColorPalette/index.tsx b/src/Components/ColorPalette/index.tsx
@@ -11,6 +11,7 @@ export const UNDPColorModule = {
       'gray-300': '#EDEFF0',
       'gray-400': '#D4D6D8',
       'gray-500': '#A9B1B7',
+      'gray-550': '#879099',
       'gray-600': '#55606E',
       'gray-700': '#232E3D',
       black: '#000000',
@@ -367,6 +368,7 @@ export const UNDPColorModule = {
       'gray-300': '#57606D',
       'gray-400': '#78808A',
       'gray-500': '#AAB1B6',
+      'gray-550': '#AAB1B6',
       'gray-600': '#D4D6D8',
       'gray-700': '#EAEBEC',
       black: '#FFFFFF',
diff --git a/src/Components/Dashboard/GraphEl.tsx b/src/Components/Dashboard/GraphEl.tsx
@@ -2838,7 +2838,7 @@ function GraphEl(props: Props) {
           ariaLabel: settings?.ariaLabel,
           cardTemplate: settings?.cardTemplate,
           cardBackgroundColor: settings?.cardBackgroundColor,
-          cardFilters: settings?.cardFilters,
+          cardFilters: settings?.cardFilters || [],
           cardSortingOptions: settings?.cardSortingOptions,
           cardSearchColumns: settings?.cardSearchColumns,
           cardMinWidth: settings?.cardMinWidth,
diff --git a/src/Components/Graphs/BarGraph/HorizontalBarGraph/AnimatedBarChart/Graph.tsx b/src/Components/Graphs/BarGraph/HorizontalBarGraph/AnimatedBarChart/Graph.tsx
@@ -222,7 +222,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/BarGraph/HorizontalBarGraph/AnimatedGroupedBarGraph/Graph.tsx b/src/Components/Graphs/BarGraph/HorizontalBarGraph/AnimatedGroupedBarGraph/Graph.tsx
@@ -206,7 +206,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/BarGraph/HorizontalBarGraph/AnimatedStackedBarChart/Graph.tsx b/src/Components/Graphs/BarGraph/HorizontalBarGraph/AnimatedStackedBarChart/Graph.tsx
@@ -214,7 +214,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/BarGraph/HorizontalBarGraph/GroupedBarGraph/Graph.tsx b/src/Components/Graphs/BarGraph/HorizontalBarGraph/GroupedBarGraph/Graph.tsx
@@ -178,7 +178,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/BarGraph/HorizontalBarGraph/SimpleBarGraph/Graph.tsx b/src/Components/Graphs/BarGraph/HorizontalBarGraph/SimpleBarGraph/Graph.tsx
@@ -184,7 +184,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/BarGraph/HorizontalBarGraph/StackedBarGraph/Graph.tsx b/src/Components/Graphs/BarGraph/HorizontalBarGraph/StackedBarGraph/Graph.tsx
@@ -163,7 +163,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/BarGraph/VerticalBarGraph/AnimatedBarChart/Graph.tsx b/src/Components/Graphs/BarGraph/VerticalBarGraph/AnimatedBarChart/Graph.tsx
@@ -257,7 +257,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/BarGraph/VerticalBarGraph/AnimatedGroupedBarGraph/Graph.tsx b/src/Components/Graphs/BarGraph/VerticalBarGraph/AnimatedGroupedBarGraph/Graph.tsx
@@ -213,20 +213,23 @@ export function Graph(props: Props) {
                     y2={y(d)}
                     x1={0 - leftMargin}
                     x2={graphWidth + margin.right}
-                    stroke='#A9B1B7'
+                    style={{
+                      stroke:
+                        UNDPColorModule[mode || 'light'].grays['gray-500'],
+                    }}
                     strokeWidth={1}
                     strokeDasharray='4,8'
                     opacity={d === 0 ? 0 : 1}
                   />
                   <text
                     x={0 - leftMargin + 2}
                     y={y(d)}
-                    fill='#A9B1B7'
                     textAnchor='start'
                     fontSize={12}
                     dy={-3}
                     opacity={d === 0 ? 0 : 1}
                     style={{
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                       fontFamily: rtl
                         ? language === 'he'
                           ? 'Noto Sans Hebrew, sans-serif'
diff --git a/src/Components/Graphs/BarGraph/VerticalBarGraph/AnimatedStackedBarChart/Graph.tsx b/src/Components/Graphs/BarGraph/VerticalBarGraph/AnimatedStackedBarChart/Graph.tsx
@@ -239,7 +239,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/BarGraph/VerticalBarGraph/GroupedBarGraph/Graph.tsx b/src/Components/Graphs/BarGraph/VerticalBarGraph/GroupedBarGraph/Graph.tsx
@@ -185,20 +185,23 @@ export function Graph(props: Props) {
                     y2={y(d)}
                     x1={0 - leftMargin}
                     x2={graphWidth + margin.right}
-                    stroke='#A9B1B7'
+                    style={{
+                      stroke:
+                        UNDPColorModule[mode || 'light'].grays['gray-500'],
+                    }}
                     strokeWidth={1}
                     strokeDasharray='4,8'
                     opacity={d === 0 ? 0 : 1}
                   />
                   <text
                     x={0 - leftMargin + 2}
                     y={y(d)}
-                    fill='#A9B1B7'
                     textAnchor='start'
                     fontSize={12}
                     dy={-3}
                     opacity={d === 0 ? 0 : 1}
                     style={{
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                       fontFamily: rtl
                         ? language === 'he'
                           ? 'Noto Sans Hebrew, sans-serif'
diff --git a/src/Components/Graphs/BarGraph/VerticalBarGraph/SimpleBarGraph/Graph.tsx b/src/Components/Graphs/BarGraph/VerticalBarGraph/SimpleBarGraph/Graph.tsx
@@ -212,7 +212,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/BarGraph/VerticalBarGraph/StackedBarGraph/Graph.tsx b/src/Components/Graphs/BarGraph/VerticalBarGraph/StackedBarGraph/Graph.tsx
@@ -188,7 +188,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/BeeSwarmChart/HorizontalBeeSwarmChart/Graph.tsx b/src/Components/Graphs/BeeSwarmChart/HorizontalBeeSwarmChart/Graph.tsx
@@ -203,7 +203,7 @@ export function Graph(props: Props) {
                   x={x(xMinValue < 0 ? 0 : xMinValue)}
                   y={-12.5}
                   style={{
-                    fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                    fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     fontFamily: rtl
                       ? language === 'he'
                         ? 'Noto Sans Hebrew, sans-serif'
diff --git a/src/Components/Graphs/BeeSwarmChart/VerticalBeeSwarmChart/Graph.tsx b/src/Components/Graphs/BeeSwarmChart/VerticalBeeSwarmChart/Graph.tsx
@@ -226,7 +226,7 @@ export function Graph(props: Props) {
                       x2={graphWidth + margin.right}
                       style={{
                         stroke:
-                          UNDPColorModule[mode || 'light'].grays['gray-500'],
+                          UNDPColorModule[mode || 'light'].grays['gray-550'],
                       }}
                       strokeWidth={1}
                       strokeDasharray='4,8'
diff --git a/src/Components/Graphs/DumbbellChart/HorizontalDumbbellChart/AnimatedDumbbellChart/Graph.tsx b/src/Components/Graphs/DumbbellChart/HorizontalDumbbellChart/AnimatedDumbbellChart/Graph.tsx
@@ -247,7 +247,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/DumbbellChart/HorizontalDumbbellChart/SimpleDumbbellChart/Graph.tsx b/src/Components/Graphs/DumbbellChart/HorizontalDumbbellChart/SimpleDumbbellChart/Graph.tsx
@@ -185,7 +185,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/DumbbellChart/VerticalDumbbellChart/AnimatedDumbbellChart/Graph.tsx b/src/Components/Graphs/DumbbellChart/VerticalDumbbellChart/AnimatedDumbbellChart/Graph.tsx
@@ -270,7 +270,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/DumbbellChart/VerticalDumbbellChart/SimpleDumbbellChart/Graph.tsx b/src/Components/Graphs/DumbbellChart/VerticalDumbbellChart/SimpleDumbbellChart/Graph.tsx
@@ -212,7 +212,7 @@ export function Graph(props: Props) {
                           ? 'Noto Sans Hebrew, sans-serif'
                           : 'Noto Sans Arabic, sans-serif'
                         : 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                     }}
                   >
                     {numberFormattingFunction(d, prefix, suffix)}
diff --git a/src/Components/Graphs/LineCharts/DifferenceLineChart/Graph.tsx b/src/Components/Graphs/LineCharts/DifferenceLineChart/Graph.tsx
@@ -476,7 +476,7 @@ export function Graph(props: Props) {
               x1={-15}
               x2={graphWidth + 15}
               style={{
-                stroke: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                stroke: UNDPColorModule[mode || 'light'].grays['gray-550'],
               }}
               strokeWidth={1}
             />
diff --git a/src/Components/Graphs/LineCharts/LineChartWithConfidenceInterval/Graph.tsx b/src/Components/Graphs/LineCharts/LineChartWithConfidenceInterval/Graph.tsx
@@ -390,7 +390,7 @@ export function Graph(props: Props) {
                     x={-25}
                     y={y(d)}
                     style={{
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                       fontFamily: rtl
                         ? language === 'he'
                           ? 'Noto Sans Hebrew, sans-serif'
diff --git a/src/Components/Graphs/LineCharts/MultiLineChart/Graph.tsx b/src/Components/Graphs/LineCharts/MultiLineChart/Graph.tsx
@@ -344,7 +344,7 @@ export function Graph(props: Props) {
                     x={-25}
                     y={y(d)}
                     style={{
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                       fontFamily: rtl
                         ? language === 'he'
                           ? 'Noto Sans Hebrew, sans-serif'
diff --git a/src/Components/Graphs/StackedAreaChart/Graph.tsx b/src/Components/Graphs/StackedAreaChart/Graph.tsx
@@ -264,7 +264,7 @@ export function Graph(props: Props) {
                     x={0}
                     y={y(d)}
                     style={{
-                      fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                      fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                       fontFamily: rtl
                         ? language === 'he'
                           ? 'Noto Sans Hebrew, sans-serif'
diff --git a/src/Components/Graphs/StatCard/StatCardFromData.tsx b/src/Components/Graphs/StatCard/StatCardFromData.tsx
@@ -187,7 +187,7 @@ export function StatCardFromData(props: Props) {
                     textShadow: 'none',
                     fontWeight: 'normal',
                     WebkitTextStroke: `0px ${UNDPColorModule[mode].grays.black}`,
-                    color: UNDPColorModule[mode].grays['gray-500'],
+                    color: UNDPColorModule[mode].grays['gray-550'],
                     marginTop: '0',
                     marginBottom: '1rem',
                     fontFamily: rtl
diff --git a/src/Components/Graphs/StatCard/index.tsx b/src/Components/Graphs/StatCard/index.tsx
@@ -148,7 +148,7 @@ export function BasicStatCard(props: Props) {
                     textShadow: 'none',
                     fontWeight: 'normal',
                     WebkitTextStroke: `0px ${UNDPColorModule[mode].grays.black}`,
-                    color: UNDPColorModule[mode].grays['gray-500'],
+                    color: UNDPColorModule[mode].grays['gray-550'],
                     marginTop: '0',
                     marginBottom: '1rem',
                     fontFamily: rtl
diff --git a/src/Components/Graphs/StripChart/HorizontalStripChart/Graph.tsx b/src/Components/Graphs/StripChart/HorizontalStripChart/Graph.tsx
@@ -267,7 +267,7 @@ export function Graph(props: Props) {
                 x={0}
                 y={graphHeight / 2 + radius + 14}
                 style={{
-                  fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                  fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                   fontFamily: rtl
                     ? language === 'he'
                       ? 'Noto Sans Hebrew, sans-serif'
diff --git a/src/Components/Graphs/StripChart/VerticalStripChart/Graph.tsx b/src/Components/Graphs/StripChart/VerticalStripChart/Graph.tsx
@@ -267,7 +267,7 @@ export function Graph(props: Props) {
                 y={0}
                 x={graphWidth / 2 + radius + 5}
                 style={{
-                  fill: UNDPColorModule[mode || 'light'].grays['gray-500'],
+                  fill: UNDPColorModule[mode || 'light'].grays['gray-550'],
                   fontFamily: rtl
                     ? language === 'he'
                       ? 'Noto Sans Hebrew, sans-serif'

Original file line number	Diff line number	Diff line change
`@@ -222,7 +222,7 @@ export function Graph(props: Props) {`
`222`	`222`	`? 'Noto Sans Hebrew, sans-serif'`
`223`	`223`	`: 'Noto Sans Arabic, sans-serif'`
`224`	`224`	`: 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',`
`225`		`- fill: UNDPColorModule[mode \|\| 'light'].grays['gray-500'],`
	`225`	`+ fill: UNDPColorModule[mode \|\| 'light'].grays['gray-550'],`
`226`	`226`	`}}`
`227`	`227`	`>`
`228`	`228`	`{numberFormattingFunction(d, prefix, suffix)}`
Original file line number	Diff line number	Diff line change
`@@ -206,7 +206,7 @@ export function Graph(props: Props) {`
`206`	`206`	`? 'Noto Sans Hebrew, sans-serif'`
`207`	`207`	`: 'Noto Sans Arabic, sans-serif'`
`208`	`208`	`: 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',`
`209`		`- fill: UNDPColorModule[mode \|\| 'light'].grays['gray-500'],`
	`209`	`+ fill: UNDPColorModule[mode \|\| 'light'].grays['gray-550'],`
`210`	`210`	`}}`
`211`	`211`	`>`
`212`	`212`	`{numberFormattingFunction(d, prefix, suffix)}`
Original file line number	Diff line number	Diff line change
`@@ -214,7 +214,7 @@ export function Graph(props: Props) {`
`214`	`214`	`? 'Noto Sans Hebrew, sans-serif'`
`215`	`215`	`: 'Noto Sans Arabic, sans-serif'`
`216`	`216`	`: 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',`
`217`		`- fill: UNDPColorModule[mode \|\| 'light'].grays['gray-500'],`
	`217`	`+ fill: UNDPColorModule[mode \|\| 'light'].grays['gray-550'],`
`218`	`218`	`}}`
`219`	`219`	`>`
`220`	`220`	`{numberFormattingFunction(d, prefix, suffix)}`
Original file line number	Diff line number	Diff line change
`@@ -178,7 +178,7 @@ export function Graph(props: Props) {`
`178`	`178`	`? 'Noto Sans Hebrew, sans-serif'`
`179`	`179`	`: 'Noto Sans Arabic, sans-serif'`
`180`	`180`	`: 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',`
`181`		`- fill: UNDPColorModule[mode \|\| 'light'].grays['gray-500'],`
	`181`	`+ fill: UNDPColorModule[mode \|\| 'light'].grays['gray-550'],`
`182`	`182`	`}}`
`183`	`183`	`>`
`184`	`184`	`{numberFormattingFunction(d, prefix, suffix)}`
Original file line number	Diff line number	Diff line change
`@@ -184,7 +184,7 @@ export function Graph(props: Props) {`
`184`	`184`	`? 'Noto Sans Hebrew, sans-serif'`
`185`	`185`	`: 'Noto Sans Arabic, sans-serif'`
`186`	`186`	`: 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',`
`187`		`- fill: UNDPColorModule[mode \|\| 'light'].grays['gray-500'],`
	`187`	`+ fill: UNDPColorModule[mode \|\| 'light'].grays['gray-550'],`
`188`	`188`	`}}`
`189`	`189`	`>`
`190`	`190`	`{numberFormattingFunction(d, prefix, suffix)}`
Original file line number	Diff line number	Diff line change
`@@ -163,7 +163,7 @@ export function Graph(props: Props) {`
`163`	`163`	`? 'Noto Sans Hebrew, sans-serif'`
`164`	`164`	`: 'Noto Sans Arabic, sans-serif'`
`165`	`165`	`: 'ProximaNova, proxima-nova, Helvetica Neue, Roboto, sans-serif',`
`166`		`- fill: UNDPColorModule[mode \|\| 'light'].grays['gray-500'],`
	`166`	`+ fill: UNDPColorModule[mode \|\| 'light'].grays['gray-550'],`
`167`	`167`	`}}`
`168`	`168`	`>`
`169`	`169`	`{numberFormattingFunction(d, prefix, suffix)}`