diff --git a/cypress/elements/chart.js b/cypress/elements/chart.js
index 02983059ff..b319a509f0 100644
--- a/cypress/elements/chart.js
+++ b/cypress/elements/chart.js
@@ -115,3 +115,12 @@ export const clickChartItem = (index) =>
 
 export const expectChartItemsToHaveLength = (length) =>
     cy.get(highchartsChartItemEl).children().should('have.length', length)
+
+export const expectSVTitleToHaveColor = (color) =>
+    cy.getBySel(visualizationTitleEl).invoke('attr', 'fill').should('eq', color)
+
+export const expectSVSubtitleToHaveColor = (color) =>
+    cy
+        .getBySel(visualizationSubtitleEl)
+        .invoke('attr', 'fill')
+        .should('eq', color)
diff --git a/cypress/elements/common.js b/cypress/elements/common.js
index 7f90032ffc..7b245a202f 100644
--- a/cypress/elements/common.js
+++ b/cypress/elements/common.js
@@ -10,7 +10,7 @@ import { clickMenuBarUpdateButton } from './menuBar.js'
 const loadingEl = 'dhis2-uicore-circularloader'
 
 export const expectAppToNotBeLoading = () =>
-    cy.getBySel(loadingEl).should('not.exist')
+    cy.getBySel(loadingEl, { timeout: 15000 }).should('not.exist')
 
 export const clickCheckbox = (target) =>
     cy.getBySel(target).click().find('[type="checkbox"]').should('be.checked')
diff --git a/cypress/elements/optionsModal/fontStyles.js b/cypress/elements/optionsModal/fontStyles.js
index 82d04e2cd3..73fcd20e03 100644
--- a/cypress/elements/optionsModal/fontStyles.js
+++ b/cypress/elements/optionsModal/fontStyles.js
@@ -6,6 +6,7 @@ const getFontSizeSelectEl = (prefix) => `${prefix}-text-style-font-size-select`
 const getFontSizeOptionEl = (prefix) => `${prefix}-text-style-font-size-option`
 const getBoldButtonEl = (prefix) => `${prefix}-text-style-bold-toggle`
 const getItalicButtonEl = (prefix) => `${prefix}-text-style-italic-toggle`
+const getColorButtonEl = (prefix) => `${prefix}-text-style-text-color-picker`
 
 export const changeTextAlignOption = (prefix, optionName) => {
     cy.getBySel(getTextAlignSelectEl(prefix)).click()
@@ -25,10 +26,11 @@ export const clickBoldButton = (prefix) =>
 export const clickItalicButton = (prefix) =>
     cy.getBySel(getItalicButtonEl(prefix)).click()
 
-/*FIXME: Find a way to test the color picker
-    export const changeTitleColorOption = color => 
-        cy.getBySel('option-chart-title-text-style-text-color-picker')
-            .invoke('val', color)
-            .trigger('change')
-            .blur()
-*/
+export const changeColor = (prefix, color) => {
+    cy.getBySelLike(getColorButtonEl(prefix))
+        .find('input[type=color]')
+        .invoke('val', color)
+        .trigger('input', { force: true }) // use force as the input has style "pointer-events: none"
+        .invoke('attr', 'value')
+        .should('eq', color)
+}
diff --git a/cypress/elements/optionsModal/index.js b/cypress/elements/optionsModal/index.js
index c7d806432a..8405186eb1 100644
--- a/cypress/elements/optionsModal/index.js
+++ b/cypress/elements/optionsModal/index.js
@@ -33,6 +33,7 @@ export {
     changeFontSizeOption,
     clickBoldButton,
     clickItalicButton,
+    changeColor,
 } from './fontStyles.js'
 
 export {
@@ -71,13 +72,16 @@ export {
     expectLegendDisplayStrategyToBeByDataItem,
     expectLegendDisplayStrategyToBeFixed,
     changeDisplayStrategyToFixed,
+    changeDisplayStrategyToByDataItem,
     changeFixedLegendSet,
     expectFixedLegendSetToBe,
     changeDisplayStyleToText,
+    changeDisplayStyleToFill,
     expectLegendDisplayStyleToBeText,
     expectLegendDisplayStyleToBeFill,
-    expectSingleValueToNotBeColor,
-    expectSingleValueToBeColor,
+    expectSingleValueToHaveTextColor,
+    expectSingleValueToNotHaveBackgroundColor,
+    expectSingleValueToHaveBackgroundColor,
     toggleLegendKeyOption,
     expectLegendKeyOptionToBeEnabled,
     expectLegendKeyOptionToBeDisabled,
diff --git a/cypress/elements/optionsModal/legend.js b/cypress/elements/optionsModal/legend.js
index b878154486..cd5da6734e 100644
--- a/cypress/elements/optionsModal/legend.js
+++ b/cypress/elements/optionsModal/legend.js
@@ -3,7 +3,8 @@ const legendKeyOptionEl = 'option-legend-key'
 const legendKeyEl = 'visualization-legend-key'
 const legendKeyContainerEl = 'legend-key-container'
 const legendKeyItemEl = 'legend-key-item'
-const singleValueOutputEl = 'visualization-primary-value'
+const singleValueTextEl = 'visualization-primary-value'
+const singleValueOutputEl = 'visualization-container'
 const legendDisplayStrategyByDataItemEl = 'legend-display-strategy-BY_DATA_ITEM'
 const legendDisplayStrategyFixedEl = 'legend-display-strategy-FIXED'
 const legendDisplayStyleOptionTextEl = 'legend-display-style-option-TEXT'
@@ -23,12 +24,24 @@ export const changeDisplayStrategyToFixed = () =>
         .contains('Select a single legend for the entire visualization')
         .click()
 
+export const changeDisplayStrategyToByDataItem = () =>
+    cy
+        .getBySel(optionsModalContentEl)
+        .contains('Use pre-defined legend per data item')
+        .click()
+
 export const changeDisplayStyleToText = () =>
     cy
         .getBySel(optionsModalContentEl)
         .contains('Legend changes text color')
         .click()
 
+export const changeDisplayStyleToFill = () =>
+    cy
+        .getBySel(optionsModalContentEl)
+        .contains('Legend changes background color')
+        .click()
+
 export const expectLegendToBeEnabled = () =>
     cy.getBySel(optionsModalContentEl).should('contain', 'Legend type')
 
@@ -64,14 +77,17 @@ export const changeFixedLegendSet = (legendSetName) => {
 export const expectFixedLegendSetToBe = (legendSetName) =>
     cy.getBySel(fixedLegendSetSelectEl).should('contain', legendSetName)
 
-export const expectSingleValueToNotBeColor = (color) =>
+export const expectSingleValueToHaveTextColor = (color) =>
+    cy.getBySel(singleValueTextEl).invoke('attr', 'fill').should('eq', color)
+
+export const expectSingleValueToNotHaveBackgroundColor = () =>
+    cy.getBySel(singleValueOutputEl).should('not.have.attr', 'style')
+
+export const expectSingleValueToHaveBackgroundColor = (color) =>
     cy
         .getBySel(singleValueOutputEl)
-        .invoke('attr', 'fill')
-        .should('not.eq', color)
-
-export const expectSingleValueToBeColor = (color) =>
-    cy.getBySel(singleValueOutputEl).invoke('attr', 'fill').should('eq', color)
+        .invoke('attr', 'style')
+        .should('contain', `background-color: ${color}`)
 
 export const toggleLegendKeyOption = () =>
     cy.getBySel(optionsModalContentEl).contains('Show legend key').click()
diff --git a/cypress/integration/options/fontStyles.cy.js b/cypress/integration/options/fontStyles.cy.js
index 551a655b02..e3054d0392 100644
--- a/cypress/integration/options/fontStyles.cy.js
+++ b/cypress/integration/options/fontStyles.cy.js
@@ -30,6 +30,7 @@ import {
     setAxisTitleText,
     setAxisTitleTextModeTo,
     switchAxesTabTo,
+    changeColor,
 } from '../../elements/optionsModal/index.js'
 import { goToStartPage } from '../../elements/startScreen.js'
 import {
@@ -78,26 +79,30 @@ const randomizeItalicOption = () => {
     return { input: useItalic, output: useItalic ? 'italic' : 'normal' }
 }
 
-const setFontStyleOptions = ({ fontSize, textAlign, bold, italic, prefix }) => {
+const setFontStyleOptions = ({
+    fontSize,
+    textAlign,
+    bold,
+    italic,
+    color,
+    prefix,
+}) => {
     if (fontSize) {
-        it(`changes the font size to ${fontSize}`, () => {
-            changeFontSizeOption(prefix, fontSize)
-        })
+        it(`changes the font size to ${fontSize}`, () =>
+            changeFontSizeOption(prefix, fontSize))
     }
     if (textAlign) {
-        it(`changes the text align to ${textAlign}`, () => {
-            changeTextAlignOption(prefix, textAlign)
-        })
+        it(`changes the text align to ${textAlign}`, () =>
+            changeTextAlignOption(prefix, textAlign))
     }
     if (bold) {
-        it('changes font to bold', () => {
-            clickBoldButton(prefix)
-        })
+        it('changes font to bold', () => clickBoldButton(prefix))
     }
     if (italic) {
-        it('changes font to italic', () => {
-            clickItalicButton(prefix)
-        })
+        it('changes font to italic', () => clickItalicButton(prefix))
+    }
+    if (color) {
+        it(`changes color to ${color}`, () => changeColor(prefix, color))
     }
 }
 
@@ -116,6 +121,7 @@ describe('Options - Font styles', () => {
             : { input: 'Right', output: 'right' }
         const TEST_BOLD_OPTION = randomizeBoldOption()
         const TEST_ITALIC_OPTION = randomizeItalicOption()
+        const TEST_COLOR = '#fafa00'
         const prefix = TITLE_PREFIX
 
         it('has default value', () => {
@@ -131,12 +137,13 @@ describe('Options - Font styles', () => {
             textAlign: TEST_TEXT_ALIGN_OPTION.input,
             bold: TEST_BOLD_OPTION.input,
             italic: TEST_ITALIC_OPTION.input,
+            color: TEST_COLOR,
             prefix,
         })
         it('clicks the modal update button', () => {
             clickOptionsModalUpdateButton()
         })
-        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}`, () => {
+        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}, color ${TEST_COLOR}`, () => {
             expectChartTitleToBeVisible()
             expectWindowConfigTitleToBeValue({
                 ...CONFIG_DEFAULT_TITLE,
@@ -146,6 +153,7 @@ describe('Options - Font styles', () => {
                     fontSize: TEST_FONT_SIZE_OPTION.output,
                     fontWeight: TEST_BOLD_OPTION.output,
                     fontStyle: TEST_ITALIC_OPTION.output,
+                    color: TEST_COLOR,
                 },
             })
         })
@@ -157,6 +165,7 @@ describe('Options - Font styles', () => {
             : { input: 'Right', output: 'right' }
         const TEST_BOLD_OPTION = randomizeBoldOption()
         const TEST_ITALIC_OPTION = randomizeItalicOption()
+        const TEST_COLOR = '#fa00fa'
         const prefix = SUBTITLE_PREFIX
         const TEST_SUBTITLE_TEXT = 'S'
 
@@ -176,12 +185,13 @@ describe('Options - Font styles', () => {
             textAlign: TEST_TEXT_ALIGN_OPTION.input,
             bold: TEST_BOLD_OPTION.input,
             italic: TEST_ITALIC_OPTION.input,
+            color: TEST_COLOR,
             prefix,
         })
         it('clicks the modal update button', () => {
             clickOptionsModalUpdateButton()
         })
-        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}`, () => {
+        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}, color ${TEST_COLOR}`, () => {
             expectChartSubtitleToBeVisible()
             expectWindowConfigSubtitleToBeValue({
                 ...CONFIG_DEFAULT_SUBTITLE,
@@ -192,6 +202,7 @@ describe('Options - Font styles', () => {
                     fontSize: TEST_FONT_SIZE_OPTION.output,
                     fontWeight: TEST_BOLD_OPTION.output,
                     fontStyle: TEST_ITALIC_OPTION.output,
+                    color: TEST_COLOR,
                 },
             })
         })
@@ -203,6 +214,7 @@ describe('Options - Font styles', () => {
             : { input: 'Right', output: 'right', x: -10 }
         const TEST_BOLD_OPTION = randomizeBoldOption()
         const TEST_ITALIC_OPTION = randomizeItalicOption()
+        const TEST_COLOR = '#00fafa'
         const TEST_LABEL = 'TL'
         const TEST_VALUE = generateRandomNumber(10, 100)
         const prefix = TARGET_LINE_PREFIX
@@ -221,12 +233,13 @@ describe('Options - Font styles', () => {
             textAlign: TEST_TEXT_ALIGN_OPTION.input,
             bold: TEST_BOLD_OPTION.input,
             italic: TEST_ITALIC_OPTION.input,
+            color: TEST_COLOR,
             prefix,
         })
         it('clicks the modal update button', () => {
             clickOptionsModalUpdateButton()
         })
-        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}`, () => {
+        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}, color ${TEST_COLOR}`, () => {
             expectVisualizationToBeVisible(VIS_TYPE_COLUMN)
             expectWindowConfigAxisPlotLinesToBeValue({
                 axisType: 'yAxis',
@@ -235,6 +248,7 @@ describe('Options - Font styles', () => {
                 value: {
                     ...CONFIG_DEFAULT_TARGET_LINE,
                     value: TEST_VALUE,
+                    color: TEST_COLOR,
                     label: {
                         ...CONFIG_DEFAULT_TARGET_LINE.label,
                         x: TEST_TEXT_ALIGN_OPTION.x,
@@ -245,6 +259,7 @@ describe('Options - Font styles', () => {
                             fontSize: TEST_FONT_SIZE_OPTION.output,
                             fontWeight: TEST_BOLD_OPTION.output,
                             fontStyle: TEST_ITALIC_OPTION.output,
+                            color: TEST_COLOR,
                         },
                     },
                 },
@@ -258,6 +273,7 @@ describe('Options - Font styles', () => {
             : { input: 'Right', output: 'right', x: -10 }
         const TEST_BOLD_OPTION = randomizeBoldOption()
         const TEST_ITALIC_OPTION = randomizeItalicOption()
+        const TEST_COLOR = '#99fa99'
         const TEST_LABEL = 'BL'
         const TEST_VALUE = generateRandomNumber(10, 100)
         const prefix = BASE_LINE_PREFIX
@@ -276,12 +292,13 @@ describe('Options - Font styles', () => {
             textAlign: TEST_TEXT_ALIGN_OPTION.input,
             bold: TEST_BOLD_OPTION.input,
             italic: TEST_ITALIC_OPTION.input,
+            color: TEST_COLOR,
             prefix,
         })
         it('clicks the modal update button', () => {
             clickOptionsModalUpdateButton()
         })
-        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}`, () => {
+        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}, color ${TEST_COLOR}`, () => {
             expectVisualizationToBeVisible(VIS_TYPE_COLUMN)
             expectWindowConfigAxisPlotLinesToBeValue({
                 axisType: 'yAxis',
@@ -290,6 +307,7 @@ describe('Options - Font styles', () => {
                 value: {
                     ...CONFIG_DEFAULT_BASE_LINE,
                     value: TEST_VALUE,
+                    color: TEST_COLOR,
                     label: {
                         ...CONFIG_DEFAULT_BASE_LINE.label,
                         x: TEST_TEXT_ALIGN_OPTION.x,
@@ -300,6 +318,7 @@ describe('Options - Font styles', () => {
                             fontSize: TEST_FONT_SIZE_OPTION.output,
                             fontWeight: TEST_BOLD_OPTION.output,
                             fontStyle: TEST_ITALIC_OPTION.output,
+                            color: TEST_COLOR,
                         },
                     },
                 },
@@ -313,6 +332,7 @@ describe('Options - Font styles', () => {
             : { input: 'Right', output: 'right' }
         const TEST_BOLD_OPTION = randomizeBoldOption()
         const TEST_ITALIC_OPTION = randomizeItalicOption()
+        const TEST_COLOR = '#9090fa'
         const prefix = SERIES_KEY_PREFIX
 
         it('opens Options -> Style', () => {
@@ -324,12 +344,13 @@ describe('Options - Font styles', () => {
             textAlign: TEST_TEXT_ALIGN_OPTION.input,
             bold: TEST_BOLD_OPTION.input,
             italic: TEST_ITALIC_OPTION.input,
+            color: TEST_COLOR,
             prefix,
         })
         it('clicks the modal update button', () => {
             clickOptionsModalUpdateButton()
         })
-        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}`, () => {
+        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}, color ${TEST_COLOR}`, () => {
             expectVisualizationToBeVisible(VIS_TYPE_COLUMN)
             expectWindowConfigLegendToBeValue({
                 ...CONFIG_DEFAULT_LEGEND,
@@ -339,6 +360,7 @@ describe('Options - Font styles', () => {
                     fontSize: TEST_FONT_SIZE_OPTION.output,
                     fontWeight: TEST_BOLD_OPTION.output,
                     fontStyle: TEST_ITALIC_OPTION.output,
+                    color: TEST_COLOR,
                 },
             })
         })
@@ -347,6 +369,7 @@ describe('Options - Font styles', () => {
         const TEST_FONT_SIZE_OPTION = { input: 'Regular', output: '13px' }
         const TEST_BOLD_OPTION = randomizeBoldOption()
         const TEST_ITALIC_OPTION = randomizeItalicOption()
+        const TEST_COLOR = '#0909fa'
         const prefix = VERTICAL_AXIS_LABELS_PREFIX
 
         it('opens Options -> Axes', () => {
@@ -357,12 +380,13 @@ describe('Options - Font styles', () => {
             fontSize: TEST_FONT_SIZE_OPTION.input,
             bold: TEST_BOLD_OPTION.input,
             italic: TEST_ITALIC_OPTION.input,
+            color: TEST_COLOR,
             prefix,
         })
         it('clicks the modal update button', () => {
             clickOptionsModalUpdateButton()
         })
-        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}`, () => {
+        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}, color ${TEST_COLOR}`, () => {
             expectVisualizationToBeVisible(VIS_TYPE_COLUMN)
             expectWindowConfigAxisLabelsToBeValue('yAxis', 0, {
                 ...CONFIG_DEFAULT_AXIS_LABELS,
@@ -371,6 +395,7 @@ describe('Options - Font styles', () => {
                     fontSize: TEST_FONT_SIZE_OPTION.output,
                     fontWeight: TEST_BOLD_OPTION.output,
                     fontStyle: TEST_ITALIC_OPTION.output,
+                    color: TEST_COLOR,
                 },
             })
         })
@@ -379,6 +404,7 @@ describe('Options - Font styles', () => {
         const TEST_FONT_SIZE_OPTION = { input: 'Large', output: '18px' }
         const TEST_BOLD_OPTION = randomizeBoldOption()
         const TEST_ITALIC_OPTION = randomizeItalicOption()
+        const TEST_COLOR = '#fa0909'
         const prefix = HORIZONTAL_AXIS_LABELS_PREFIX
 
         it('opens Options -> Axes', () => {
@@ -390,12 +416,13 @@ describe('Options - Font styles', () => {
             fontSize: TEST_FONT_SIZE_OPTION.input,
             bold: TEST_BOLD_OPTION.input,
             italic: TEST_ITALIC_OPTION.input,
+            color: TEST_COLOR,
             prefix,
         })
         it('clicks the modal update button', () => {
             clickOptionsModalUpdateButton()
         })
-        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}`, () => {
+        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}, color ${TEST_COLOR}`, () => {
             expectVisualizationToBeVisible(VIS_TYPE_COLUMN)
             expectWindowConfigAxisLabelsToBeValue('xAxis', 0, {
                 ...CONFIG_DEFAULT_AXIS_LABELS,
@@ -404,6 +431,7 @@ describe('Options - Font styles', () => {
                     fontSize: TEST_FONT_SIZE_OPTION.output,
                     fontWeight: TEST_BOLD_OPTION.output,
                     fontStyle: TEST_ITALIC_OPTION.output,
+                    color: TEST_COLOR,
                 },
             })
         })
@@ -415,6 +443,7 @@ describe('Options - Font styles', () => {
             : { input: 'End', output: 'high' }
         const TEST_BOLD_OPTION = randomizeBoldOption()
         const TEST_ITALIC_OPTION = randomizeItalicOption()
+        const TEST_COLOR = '#0f9a09'
         const TEST_TITLE = 'HT'
         const TEST_AXIS = 'DOMAIN_0'
         const prefix = HORIZONTAL_AXIS_TITLE_PREFIX
@@ -433,13 +462,14 @@ describe('Options - Font styles', () => {
             textAlign: TEST_TEXT_ALIGN_OPTION.input,
             bold: TEST_BOLD_OPTION.input,
             italic: TEST_ITALIC_OPTION.input,
+            color: TEST_COLOR,
             prefix,
         })
         it('clicks the modal update button', () => {
             clickOptionsModalUpdateButton()
         })
 
-        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}`, () => {
+        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}, color ${TEST_COLOR}`, () => {
             expectVisualizationToBeVisible(VIS_TYPE_COLUMN)
             expectWindowConfigAxisTitleToBeValue('xAxis', 0, {
                 ...CONFIG_DEFAULT_HORIZONTAL_AXIS_TITLE,
@@ -450,6 +480,7 @@ describe('Options - Font styles', () => {
                     fontSize: TEST_FONT_SIZE_OPTION.output,
                     fontWeight: TEST_BOLD_OPTION.output,
                     fontStyle: TEST_ITALIC_OPTION.output,
+                    color: TEST_COLOR,
                 },
             })
         })
@@ -461,6 +492,7 @@ describe('Options - Font styles', () => {
             : { input: 'End', output: 'high' }
         const TEST_BOLD_OPTION = randomizeBoldOption()
         const TEST_ITALIC_OPTION = randomizeItalicOption()
+        const TEST_COLOR = '#a090f9'
         const TEST_TITLE = 'VT'
         const TEST_AXIS = 'RANGE_0'
         const prefix = VERTICAL_AXIS_TITLE_PREFIX
@@ -478,12 +510,13 @@ describe('Options - Font styles', () => {
             textAlign: TEST_TEXT_ALIGN_OPTION.input,
             bold: TEST_BOLD_OPTION.input,
             italic: TEST_ITALIC_OPTION.input,
+            color: TEST_COLOR,
             prefix,
         })
         it('clicks the modal update button', () => {
             clickOptionsModalUpdateButton()
         })
-        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}`, () => {
+        it(`config has font size "${TEST_FONT_SIZE_OPTION.output}", text align ${TEST_TEXT_ALIGN_OPTION.output}, bold ${TEST_BOLD_OPTION.input}, italic ${TEST_ITALIC_OPTION.input}, color ${TEST_COLOR}`, () => {
             expectVisualizationToBeVisible(VIS_TYPE_COLUMN)
             expectWindowConfigAxisTitleToBeValue('yAxis', 0, {
                 ...CONFIG_DEFAULT_VERTICAL_AXIS_TITLE,
@@ -494,6 +527,7 @@ describe('Options - Font styles', () => {
                     fontSize: TEST_FONT_SIZE_OPTION.output,
                     fontWeight: TEST_BOLD_OPTION.output,
                     fontStyle: TEST_ITALIC_OPTION.output,
+                    color: TEST_COLOR,
                 },
             })
         })
@@ -503,5 +537,4 @@ describe('Options - Font styles', () => {
 /* TODO:    Add tests for all axes based options for Scatter
             Add tests for regression lines and vertical axis labels for Gauge
             Add tests for axes based options for a vertical type (e.g. Bar)
-            Test the color picker
 */
diff --git a/cypress/integration/options/legend.cy.js b/cypress/integration/options/legend.cy.js
index de5d847c67..022ea9e717 100644
--- a/cypress/integration/options/legend.cy.js
+++ b/cypress/integration/options/legend.cy.js
@@ -9,10 +9,13 @@ import {
     visTypeDisplayNames,
     DIMENSION_ID_PERIOD,
     AXIS_ID_COLUMNS,
+    VIS_TYPE_AREA,
 } from '@dhis2/analytics'
 import {
     expectChartTitleToBeVisible,
     expectSeriesKeyToHaveSeriesKeyItems,
+    expectSVSubtitleToHaveColor,
+    expectSVTitleToHaveColor,
     expectVisualizationToBeVisible,
 } from '../../elements/chart.js'
 import {
@@ -44,8 +47,7 @@ import {
     expectLegendDisplayStyleToBeFill,
     expectLegendDisplayStyleToBeText,
     expectLegendToBeEnabled,
-    expectSingleValueToBeColor,
-    expectSingleValueToNotBeColor,
+    expectSingleValueToHaveTextColor,
     OPTIONS_TAB_LEGEND,
     toggleLegendKeyOption,
     expectLegendKeyOptionToBeEnabled,
@@ -57,6 +59,12 @@ import {
     OPTIONS_TAB_SERIES,
     setItemToType,
     clickOptionsModalHideButton,
+    expectSingleValueToHaveBackgroundColor,
+    expectSingleValueToNotHaveBackgroundColor,
+    changeDisplayStyleToFill,
+    changeColor,
+    OPTIONS_TAB_STYLE,
+    changeDisplayStrategyToByDataItem,
 } from '../../elements/optionsModal/index.js'
 import { goToStartPage } from '../../elements/startScreen.js'
 import { changeVisType } from '../../elements/visualizationTypeSelector.js'
@@ -151,6 +159,16 @@ describe('Options - Legend', () => {
     describe('Applying a legend: Single value', () => {
         const TEST_ITEM = TEST_ITEMS[0]
         const EXPECTED_STANDARD_TEXT_COLOR = '#212934'
+        const EXPECTED_CONTRAST_TEXT_COLOR = '#ffffff'
+        const EXPECTED_BACKGROUND_COLOR_1 = '#FFFFB2'
+        const EXPECTED_TEXT_COLOR_1 = '#FFFFB2'
+        const EXPECTED_BACKGROUND_COLOR_2 = '#B3402B'
+        const EXPECTED_TEXT_COLOR_2 = '#B3402B'
+        const EXPECTED_CUSTOM_TITLE_COLOR = '#ff7700'
+        const EXPECTED_CUSTOM_SUBTITLE_COLOR = '#ffaa00'
+        const TEST_LEGEND_SET_WITH_CONTRAST = 'Age 15y interval'
+        const EXPECTED_STANDARD_TITLE_COLOR = '#212934'
+        const EXPECTED_STANDARD_SUBTITLE_COLOR = '#4a5768'
         it('navigates to the start page and adds data items', () => {
             goToStartPage()
             changeVisType(visTypeDisplayNames[VIS_TYPE_SINGLE_VALUE])
@@ -158,7 +176,8 @@ describe('Options - Legend', () => {
             selectIndicators([TEST_ITEM.name])
             clickDimensionModalUpdateButton()
             expectVisualizationToBeVisible(VIS_TYPE_SINGLE_VALUE)
-            expectSingleValueToBeColor(EXPECTED_STANDARD_TEXT_COLOR)
+            expectSingleValueToHaveTextColor(EXPECTED_STANDARD_TEXT_COLOR)
+            expectSingleValueToNotHaveBackgroundColor()
         })
         it('enables legend', () => {
             clickMenuBarOptionsButton()
@@ -166,11 +185,133 @@ describe('Options - Legend', () => {
             toggleLegend()
             expectLegendToBeEnabled()
             expectLegendDisplayStrategyToBeByDataItem()
+            expectLegendDisplayStyleToBeFill()
             clickOptionsModalUpdateButton()
             expectVisualizationToBeVisible(VIS_TYPE_SINGLE_VALUE)
         })
-        it('legend is applied', () => {
-            expectSingleValueToNotBeColor(EXPECTED_STANDARD_TEXT_COLOR)
+        // Legend on background, no contrast, no custom title colors
+        it('background color legend is applied', () => {
+            expectSingleValueToHaveTextColor(EXPECTED_STANDARD_TEXT_COLOR)
+            expectSingleValueToHaveBackgroundColor(EXPECTED_BACKGROUND_COLOR_1)
+            expectSVTitleToHaveColor(EXPECTED_STANDARD_TITLE_COLOR)
+            expectSVSubtitleToHaveColor(EXPECTED_STANDARD_SUBTITLE_COLOR)
+        })
+        it('changes legend display style to text color', () => {
+            clickMenuBarOptionsButton()
+            clickOptionsTab(OPTIONS_TAB_LEGEND)
+            expectLegendDisplayStrategyToBeByDataItem()
+            expectLegendDisplayStyleToBeFill()
+            changeDisplayStyleToText()
+            expectLegendDisplayStyleToBeText()
+            clickOptionsModalUpdateButton()
+            expectVisualizationToBeVisible(VIS_TYPE_SINGLE_VALUE)
+        })
+        // Legend on text, no contrast, no custom title colors
+        it('text color legend is applied', () => {
+            expectSingleValueToHaveTextColor(EXPECTED_TEXT_COLOR_1)
+            expectSingleValueToNotHaveBackgroundColor()
+            expectSVTitleToHaveColor(EXPECTED_STANDARD_TITLE_COLOR)
+            expectSVSubtitleToHaveColor(EXPECTED_STANDARD_SUBTITLE_COLOR)
+        })
+        it(`changes legend display strategy to fixed (${TEST_LEGEND_SET_WITH_CONTRAST})`, () => {
+            clickMenuBarOptionsButton()
+            clickOptionsTab(OPTIONS_TAB_LEGEND)
+            expectLegendDisplayStyleToBeText()
+            expectLegendDisplayStrategyToBeByDataItem()
+            changeDisplayStrategyToFixed()
+            expectLegendDisplayStrategyToBeFixed()
+            changeFixedLegendSet(TEST_LEGEND_SET_WITH_CONTRAST)
+            clickOptionsModalUpdateButton()
+            expectVisualizationToBeVisible(VIS_TYPE_SINGLE_VALUE)
+        })
+        // Legend on text, with contrast (N/A), no custom title colors
+        it('text color legend is applied', () => {
+            expectSingleValueToHaveTextColor(EXPECTED_TEXT_COLOR_2)
+            expectSingleValueToNotHaveBackgroundColor()
+            expectSVTitleToHaveColor(EXPECTED_STANDARD_TITLE_COLOR)
+            expectSVSubtitleToHaveColor(EXPECTED_STANDARD_SUBTITLE_COLOR)
+        })
+        it('changes legend display style to background color', () => {
+            clickMenuBarOptionsButton()
+            clickOptionsTab(OPTIONS_TAB_LEGEND)
+            expectLegendDisplayStrategyToBeFixed()
+            expectLegendDisplayStyleToBeText()
+            changeDisplayStyleToFill()
+            expectLegendDisplayStyleToBeFill()
+            clickOptionsModalUpdateButton()
+            expectVisualizationToBeVisible(VIS_TYPE_SINGLE_VALUE)
+        })
+        // Legend on background, with contrast, no custom title colors
+        it('background color legend and contrast text color is applied', () => {
+            expectSingleValueToHaveTextColor(EXPECTED_CONTRAST_TEXT_COLOR)
+            expectSingleValueToHaveBackgroundColor(EXPECTED_BACKGROUND_COLOR_2)
+            expectSVTitleToHaveColor(EXPECTED_CONTRAST_TEXT_COLOR)
+            expectSVSubtitleToHaveColor(EXPECTED_CONTRAST_TEXT_COLOR)
+        })
+        it(`changes title and subtitle colors`, () => {
+            clickMenuBarOptionsButton()
+            clickOptionsTab(OPTIONS_TAB_STYLE)
+            changeColor('option-chart-title', EXPECTED_CUSTOM_TITLE_COLOR)
+            changeColor('option-chart-subtitle', EXPECTED_CUSTOM_SUBTITLE_COLOR)
+            clickOptionsModalUpdateButton()
+        })
+        // Legend on background, with contrast, with custom title colors
+        it('background color legend, contrast text color and custom title colors are applied', () => {
+            expectSingleValueToHaveTextColor(EXPECTED_CONTRAST_TEXT_COLOR)
+            expectSingleValueToHaveBackgroundColor(EXPECTED_BACKGROUND_COLOR_2)
+            expectSVTitleToHaveColor(EXPECTED_CUSTOM_TITLE_COLOR)
+            expectSVSubtitleToHaveColor(EXPECTED_CUSTOM_SUBTITLE_COLOR)
+        })
+        it('changes legend display style to text color', () => {
+            clickMenuBarOptionsButton()
+            clickOptionsTab(OPTIONS_TAB_LEGEND)
+            expectLegendDisplayStrategyToBeFixed()
+            expectLegendDisplayStyleToBeFill()
+            changeDisplayStyleToText()
+            expectLegendDisplayStyleToBeText()
+            clickOptionsModalUpdateButton()
+            expectVisualizationToBeVisible(VIS_TYPE_SINGLE_VALUE)
+        })
+        // Legend on text, with contrast, with custom title colors
+        it('text color legend and custom title colors are applied', () => {
+            expectSingleValueToHaveTextColor(EXPECTED_TEXT_COLOR_2)
+            expectSingleValueToNotHaveBackgroundColor()
+            expectSVTitleToHaveColor(EXPECTED_CUSTOM_TITLE_COLOR)
+            expectSVSubtitleToHaveColor(EXPECTED_CUSTOM_SUBTITLE_COLOR)
+        })
+        it(`changes legend display strategy to by data item`, () => {
+            clickMenuBarOptionsButton()
+            clickOptionsTab(OPTIONS_TAB_LEGEND)
+            expectLegendDisplayStyleToBeText()
+            expectLegendDisplayStrategyToBeFixed()
+            changeDisplayStrategyToByDataItem()
+            expectLegendDisplayStrategyToBeByDataItem()
+            clickOptionsModalUpdateButton()
+            expectVisualizationToBeVisible(VIS_TYPE_SINGLE_VALUE)
+        })
+        // Legend on text, no contrast, with custom title colors
+        it('text color legend and custom title colors are applied', () => {
+            expectSingleValueToHaveTextColor(EXPECTED_TEXT_COLOR_1)
+            expectSingleValueToNotHaveBackgroundColor()
+            expectSVTitleToHaveColor(EXPECTED_CUSTOM_TITLE_COLOR)
+            expectSVSubtitleToHaveColor(EXPECTED_CUSTOM_SUBTITLE_COLOR)
+        })
+        it('changes legend display style to background color', () => {
+            clickMenuBarOptionsButton()
+            clickOptionsTab(OPTIONS_TAB_LEGEND)
+            changeDisplayStrategyToByDataItem()
+            expectLegendDisplayStyleToBeText()
+            changeDisplayStyleToFill()
+            expectLegendDisplayStyleToBeFill()
+            clickOptionsModalUpdateButton()
+            expectVisualizationToBeVisible(VIS_TYPE_SINGLE_VALUE)
+        })
+        // Legend on background, no contrast, with custom title colors
+        it('background color legend and custom title colors are applied', () => {
+            expectSingleValueToHaveTextColor(EXPECTED_STANDARD_TEXT_COLOR)
+            expectSingleValueToHaveBackgroundColor(EXPECTED_BACKGROUND_COLOR_1)
+            expectSVTitleToHaveColor(EXPECTED_CUSTOM_TITLE_COLOR)
+            expectSVSubtitleToHaveColor(EXPECTED_CUSTOM_SUBTITLE_COLOR)
         })
         it('legend key is hidden', () => {
             expectLegendKeyToBeHidden()
@@ -264,6 +405,70 @@ describe('Options - Legend', () => {
             expectLegedKeyItemAmountToBe(1)
         })
     })
+    describe('Applying a legend: Stacked column', () => {
+        it('navigates to the start page and adds data items', () => {
+            goToStartPage()
+            changeVisType(visTypeDisplayNames[VIS_TYPE_STACKED_COLUMN])
+            openDimension(DIMENSION_ID_DATA)
+            selectIndicators(TEST_ITEMS.map((item) => item.name))
+            clickDimensionModalUpdateButton()
+            expectVisualizationToBeVisible(VIS_TYPE_STACKED_COLUMN)
+        })
+        it('enables legend', () => {
+            clickMenuBarOptionsButton()
+            clickOptionsTab(OPTIONS_TAB_LEGEND)
+            toggleLegend()
+            expectLegendToBeEnabled()
+            expectLegendDisplayStrategyToBeByDataItem()
+            clickOptionsModalUpdateButton()
+            expectChartTitleToBeVisible()
+        })
+        it('legend by data item is applied', () => {
+            TEST_ITEMS.forEach((item) =>
+                expectWindowConfigSeriesItemToHaveLegendSet(
+                    item.name,
+                    item.legendSet
+                )
+            )
+        })
+        it(`changes legend display strategy to fixed (${TEST_LEGEND_SET})`, () => {
+            clickMenuBarOptionsButton()
+            clickOptionsTab(OPTIONS_TAB_LEGEND)
+            expectLegendDisplayStrategyToBeByDataItem()
+            changeDisplayStrategyToFixed()
+            expectLegendDisplayStrategyToBeFixed()
+            changeFixedLegendSet(TEST_LEGEND_SET)
+            clickOptionsModalUpdateButton()
+            expectChartTitleToBeVisible()
+        })
+        it('fixed legend is applied', () => {
+            TEST_ITEMS.forEach((item) =>
+                expectWindowConfigSeriesItemToHaveLegendSet(
+                    item.name,
+                    TEST_LEGEND_SET
+                )
+            )
+        })
+        it('legend key is hidden', () => {
+            expectLegendKeyToBeHidden()
+        })
+        it('verifies that options are persisted', () => {
+            clickMenuBarOptionsButton()
+            clickOptionsTab(OPTIONS_TAB_LEGEND)
+            expectLegendDisplayStrategyToBeFixed()
+            expectFixedLegendSetToBe(TEST_LEGEND_SET)
+        })
+        it('enables legend key option', () => {
+            toggleLegendKeyOption()
+            expectLegendKeyOptionToBeEnabled()
+            clickOptionsModalUpdateButton()
+            expectVisualizationToBeVisible()
+        })
+        it('legend key is shown with 1 item', () => {
+            expectLegendKeyToBeVisible()
+            expectLegedKeyItemAmountToBe(1)
+        })
+    })
     describe('Applying a legend: Pivot table', () => {
         const TEST_ITEM = TEST_ITEMS[0]
         const EXPECTED_STANDARD_TEXT_COLOR = 'color: rgb(33, 41, 52)'
@@ -393,14 +598,19 @@ describe('Options - Legend', () => {
             expectLegendDisplayStrategyToBeFixed()
         })
     })
-    describe('Transferring a legend: Column -> Single value', () => {
-        const EXPECTED_STANDARD_TEXT_COLOR = '#212934'
+    describe('Transferring a legend: Pivot table -> Single value', () => {
+        const TEST_ITEM = TEST_ITEMS[0]
+        const EXPECTED_FIXED_COLOR = '#c7e9c0'
+        const valueCellEl = 'visualization-value-cell'
+        const EXPECTED_SV_STANDARD_TEXT_COLOR = '#212934'
+        const EXPECTED_PT_STANDARD_TEXT_COLOR = 'color: rgb(33, 41, 52)'
         it('navigates to the start page and adds data items', () => {
             goToStartPage()
+            changeVisType(visTypeDisplayNames[VIS_TYPE_PIVOT_TABLE])
             openDimension(DIMENSION_ID_DATA)
-            selectIndicators(TEST_ITEMS.map((item) => item.name))
+            selectIndicators([TEST_ITEM.name])
             clickDimensionModalUpdateButton()
-            expectVisualizationToBeVisible(VIS_TYPE_COLUMN)
+            expectVisualizationToBeVisible(VIS_TYPE_PIVOT_TABLE)
         })
         it('enables legend', () => {
             clickMenuBarOptionsButton()
@@ -408,16 +618,20 @@ describe('Options - Legend', () => {
             toggleLegend()
             expectLegendToBeEnabled()
             expectLegendDisplayStrategyToBeByDataItem()
+            expectLegendDisplayStyleToBeFill()
+            changeDisplayStrategyToFixed()
+            expectLegendDisplayStrategyToBeFixed()
+            changeFixedLegendSet(TEST_LEGEND_SET)
             clickOptionsModalUpdateButton()
-            expectChartTitleToBeVisible()
+            expectVisualizationToBeVisible(VIS_TYPE_PIVOT_TABLE)
         })
-        it('legend is applied to Column', () => {
-            TEST_ITEMS.forEach((item) =>
-                expectWindowConfigSeriesItemToHaveLegendSet(
-                    item.name,
-                    item.legendSet
-                )
-            )
+        it(`background color fixed legend (${TEST_LEGEND_SET}) is applied`, () => {
+            cy.getBySel(valueCellEl).each(($el) => {
+                cy.wrap($el)
+                    .invoke('attr', 'style')
+                    .should('contain', 'background-color')
+                    .and('contain', EXPECTED_PT_STANDARD_TEXT_COLOR)
+            })
         })
         it('changes vis type to Single value', () => {
             changeVisType(visTypeDisplayNames[VIS_TYPE_SINGLE_VALUE])
@@ -425,12 +639,14 @@ describe('Options - Legend', () => {
             expectVisualizationToBeVisible(VIS_TYPE_SINGLE_VALUE)
         })
         it('legend is applied to Single value', () => {
-            expectSingleValueToNotBeColor(EXPECTED_STANDARD_TEXT_COLOR)
+            expectSingleValueToHaveTextColor(EXPECTED_SV_STANDARD_TEXT_COLOR)
+            expectSingleValueToHaveBackgroundColor(EXPECTED_FIXED_COLOR)
         })
         it('verifies that options are persisted', () => {
             clickMenuBarOptionsButton()
             clickOptionsTab(OPTIONS_TAB_LEGEND)
-            expectLegendDisplayStrategyToBeByDataItem()
+            expectLegendDisplayStyleToBeFill()
+            expectLegendDisplayStrategyToBeFixed()
         })
     })
     describe('Transferring the legend key: Column -> Pivot table -> Gauge -> Single value', () => {
@@ -525,7 +741,7 @@ describe('Options - Legend', () => {
             expectLegendKeyToBeHidden()
         })
     })
-    describe('Preventing options bleed: Column -> Stacked column', () => {
+    describe('Preventing options bleed: Column -> Area', () => {
         it('navigates to the start page and adds data items', () => {
             goToStartPage()
             openDimension(DIMENSION_ID_DATA)
@@ -550,12 +766,12 @@ describe('Options - Legend', () => {
                 )
             )
         })
-        it('changes vis type to Stacked column', () => {
-            changeVisType(visTypeDisplayNames[VIS_TYPE_STACKED_COLUMN])
+        it('changes vis type to Area', () => {
+            changeVisType(visTypeDisplayNames[VIS_TYPE_AREA])
             clickMenuBarUpdateButton()
-            expectVisualizationToBeVisible(VIS_TYPE_STACKED_COLUMN)
+            expectVisualizationToBeVisible(VIS_TYPE_AREA)
         })
-        it('legend is not applied to Stacked column', () => {
+        it('legend is not applied to Area', () => {
             TEST_ITEMS.forEach((item) =>
                 expectWindowConfigSeriesItemToNotHaveLegendSet(item.name)
             )
diff --git a/packages/app/package.json b/packages/app/package.json
index 7b4e4f470a..b79ea04375 100644
--- a/packages/app/package.json
+++ b/packages/app/package.json
@@ -13,8 +13,8 @@
         "redux-mock-store": "^1.5.4"
     },
     "dependencies": {
-        "@dhis2/analytics": "^24.2.7",
-        "@dhis2/app-runtime": "^3.4.4",
+        "@dhis2/analytics": "^24.9.3",
+        "@dhis2/app-runtime": "^3.9.0",
         "@dhis2/app-runtime-adapter-d2": "^1.1.0",
         "@dhis2/app-service-datastore": "^1.0.0-beta.3",
         "@dhis2/d2-i18n": "^1.1.0",
diff --git a/packages/app/src/components/VisualizationOptions/Options/TextStyle.js b/packages/app/src/components/VisualizationOptions/Options/TextStyle.js
index 0913683923..af815fee0b 100644
--- a/packages/app/src/components/VisualizationOptions/Options/TextStyle.js
+++ b/packages/app/src/components/VisualizationOptions/Options/TextStyle.js
@@ -107,7 +107,7 @@ const TextStyle = ({
                         <input
                             type="color"
                             value={fontStyle[FONT_STYLE_OPTION_TEXT_COLOR]}
-                            onChange={(e) => onChangeColor(e.target.value)}
+                            onInput={(e) => onChangeColor(e.target.value)}
                             className={styles.textColorInput}
                             disabled={disabled}
                         />
diff --git a/packages/app/src/modules/options/singleValueConfig.js b/packages/app/src/modules/options/singleValueConfig.js
index 1fa58eb1ba..09c305a7fc 100644
--- a/packages/app/src/modules/options/singleValueConfig.js
+++ b/packages/app/src/modules/options/singleValueConfig.js
@@ -17,7 +17,7 @@ export default () => [
         }),
         getAdvancedSection(),
     ]),
-    getLegendTab({ hideStyleOptions: true }),
+    getLegendTab(),
     getSeriesTab(),
     getStyleTab([
         getTitlesSection(),
diff --git a/packages/plugin/package.json b/packages/plugin/package.json
index fec729f08c..647821148d 100644
--- a/packages/plugin/package.json
+++ b/packages/plugin/package.json
@@ -14,8 +14,8 @@
         "access": "public"
     },
     "dependencies": {
-        "@dhis2/analytics": "^24.2.7",
-        "@dhis2/app-runtime": "^3.4.4",
+        "@dhis2/analytics": "^24.9.3",
+        "@dhis2/app-runtime": "^3.9.0",
         "@dhis2/d2-i18n": "^1.1.0",
         "@dhis2/ui": "^8.4.11",
         "lodash-es": "^4.17.21",
diff --git a/yarn.lock b/yarn.lock
index 80a0fde8e9..65b8c07b92 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -33,7 +33,12 @@
   dependencies:
     "@babel/highlight" "^7.18.6"
 
-"@babel/compat-data@^7.17.7", "@babel/compat-data@^7.18.8":
+"@babel/compat-data@^7.17.7":
+  version "7.21.0"
+  resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.21.0.tgz#c241dc454e5b5917e40d37e525e2f4530c399298"
+  integrity sha512-gMuZsmsgxk/ENC3O/fRw5QY8A9/uxQbbCEypnLIiYYc/qVJtEV7ouxC3EllIIwNzMqAQee5tanFabWsUOutS7g==
+
+"@babel/compat-data@^7.18.8":
   version "7.18.13"
   resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.18.13.tgz#6aff7b350a1e8c3e40b029e46cbe78e24a913483"
   integrity sha512-5yUzC5LqyTFp2HLmDoxGQelcdYgSpP9xsnMWBphAscOdFrHSAVbLNzWiy32sVNDqJRDiJK6klfDnAgu6PAGSHw==
@@ -160,6 +165,11 @@
   resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.18.9.tgz#0c0cee9b35d2ca190478756865bb3528422f51be"
   integrity sha512-3r/aACDJ3fhQ/EVgFy0hpj8oHyHpQc+LPtJoY9SzTThAsStm4Ptegq92vqKoE3vD706ZVFWITnMnxucw+S9Ipg==
 
+"@babel/helper-environment-visitor@^7.22.20":
+  version "7.22.20"
+  resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.20.tgz#96159db61d34a29dba454c959f5ae4a649ba9167"
+  integrity sha512-zfedSIzFhat/gFhWfHtgWvlec0nqB9YEIVrpuwjruLlXfUSnA8cJB0miHKwqDnQ7d32aKo2xt88/xZptwxbfhA==
+
 "@babel/helper-explode-assignable-expression@^7.18.6":
   version "7.18.6"
   resolved "https://registry.yarnpkg.com/@babel/helper-explode-assignable-expression/-/helper-explode-assignable-expression-7.18.6.tgz#41f8228ef0a6f1a036b8dfdfec7ce94f9a6bc096"
@@ -196,6 +206,13 @@
   dependencies:
     "@babel/types" "^7.18.6"
 
+"@babel/helper-module-imports@^7.22.15":
+  version "7.22.15"
+  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.22.15.tgz#16146307acdc40cc00c3b2c647713076464bdbf0"
+  integrity sha512-0pYVBnDKZO2fnSPCrgM/6WMc7eS20Fbok+0r88fp+YtWVLZrp4CkafFGIp+W0VKw4a22sgebPT99y+FDNMdP4w==
+  dependencies:
+    "@babel/types" "^7.22.15"
+
 "@babel/helper-module-transforms@^7.18.6", "@babel/helper-module-transforms@^7.18.9":
   version "7.18.9"
   resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.18.9.tgz#5a1079c005135ed627442df31a42887e80fcb712"
@@ -210,6 +227,17 @@
     "@babel/traverse" "^7.18.9"
     "@babel/types" "^7.18.9"
 
+"@babel/helper-module-transforms@^7.21.2":
+  version "7.23.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.23.0.tgz#3ec246457f6c842c0aee62a01f60739906f7047e"
+  integrity sha512-WhDWw1tdrlT0gMgUJSlX0IQvoO1eN279zrAUbVB+KpV2c3Tylz8+GnKOLllCS6Z/iZQEyVYxhZVUdPTqs2YYPw==
+  dependencies:
+    "@babel/helper-environment-visitor" "^7.22.20"
+    "@babel/helper-module-imports" "^7.22.15"
+    "@babel/helper-simple-access" "^7.22.5"
+    "@babel/helper-split-export-declaration" "^7.22.6"
+    "@babel/helper-validator-identifier" "^7.22.20"
+
 "@babel/helper-optimise-call-expression@^7.18.6":
   version "7.18.6"
   resolved "https://registry.yarnpkg.com/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.18.6.tgz#9369aa943ee7da47edab2cb4e838acf09d290ffe"
@@ -222,6 +250,11 @@
   resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.18.9.tgz#4b8aea3b069d8cb8a72cdfe28ddf5ceca695ef2f"
   integrity sha512-aBXPT3bmtLryXaoJLyYPXPlSD4p1ld9aYeR+sJNOZjJJGiOpb+fKfh3NkcCu7J54nUJwCERPBExCCpyCOHnu/w==
 
+"@babel/helper-plugin-utils@^7.20.2":
+  version "7.22.5"
+  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.22.5.tgz#dd7ee3735e8a313b9f7b05a773d892e88e6d7295"
+  integrity sha512-uLls06UVKgFG9QD4OeFYLEGteMIAa5kpTPcFL28yuCIIzsf6ZyKZMllKVOCZFhiZ5ptnwX4mtKdWCBE/uT4amg==
+
 "@babel/helper-remap-async-to-generator@^7.18.6", "@babel/helper-remap-async-to-generator@^7.18.9":
   version "7.18.9"
   resolved "https://registry.yarnpkg.com/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.18.9.tgz#997458a0e3357080e54e1d79ec347f8a8cd28519"
@@ -250,6 +283,13 @@
   dependencies:
     "@babel/types" "^7.18.6"
 
+"@babel/helper-simple-access@^7.20.2", "@babel/helper-simple-access@^7.22.5":
+  version "7.22.5"
+  resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.22.5.tgz#4938357dc7d782b80ed6dbb03a0fba3d22b1d5de"
+  integrity sha512-n0H99E/K+Bika3++WNL17POvo4rKWZ7lZEp1Q+fStVbUi8nxPQEBOlTmCOxW/0JsS56SKKQ+ojAe2pHKJHN35w==
+  dependencies:
+    "@babel/types" "^7.22.5"
+
 "@babel/helper-skip-transparent-expression-wrappers@^7.18.9":
   version "7.18.9"
   resolved "https://registry.yarnpkg.com/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.18.9.tgz#778d87b3a758d90b471e7b9918f34a9a02eb5818"
@@ -264,16 +304,33 @@
   dependencies:
     "@babel/types" "^7.18.6"
 
+"@babel/helper-split-export-declaration@^7.22.6":
+  version "7.22.6"
+  resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.22.6.tgz#322c61b7310c0997fe4c323955667f18fcefb91c"
+  integrity sha512-AsUnxuLhRYsisFiaJwvp1QF+I3KjD5FOxut14q/GzovUe6orHLesW2C7d754kRm53h5gqrz6sFl6sxc4BVtE/g==
+  dependencies:
+    "@babel/types" "^7.22.5"
+
 "@babel/helper-string-parser@^7.18.10":
   version "7.18.10"
   resolved "https://registry.yarnpkg.com/@babel/helper-string-parser/-/helper-string-parser-7.18.10.tgz#181f22d28ebe1b3857fa575f5c290b1aaf659b56"
   integrity sha512-XtIfWmeNY3i4t7t4D2t02q50HvqHybPqW2ki1kosnvWCwuCMeo81Jf0gwr85jy/neUdg5XDdeFE/80DXiO+njw==
 
+"@babel/helper-string-parser@^7.22.5":
+  version "7.22.5"
+  resolved "https://registry.yarnpkg.com/@babel/helper-string-parser/-/helper-string-parser-7.22.5.tgz#533f36457a25814cf1df6488523ad547d784a99f"
+  integrity sha512-mM4COjgZox8U+JcXQwPijIZLElkgEpO5rsERVDJTc2qfCDfERyob6k5WegS14SX18IIjv+XD+GrqNumY5JRCDw==
+
 "@babel/helper-validator-identifier@^7.14.9", "@babel/helper-validator-identifier@^7.18.6":
   version "7.18.6"
   resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.18.6.tgz#9c97e30d31b2b8c72a1d08984f2ca9b574d7a076"
   integrity sha512-MmetCkz9ej86nJQV+sFCxoGGrUbU3q02kgLciwkrt9QqEB7cP39oKEY0PakknEO0Gu20SskMRi+AYZ3b1TpN9g==
 
+"@babel/helper-validator-identifier@^7.22.20":
+  version "7.22.20"
+  resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.20.tgz#c4ae002c61d2879e724581d96665583dbc1dc0e0"
+  integrity sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==
+
 "@babel/helper-validator-option@^7.18.6":
   version "7.18.6"
   resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.18.6.tgz#bf0d2b5a509b1f336099e4ff36e1a63aa5db4db8"
@@ -307,7 +364,12 @@
     chalk "^2.0.0"
     js-tokens "^4.0.0"
 
-"@babel/parser@^7.1.0", "@babel/parser@^7.1.6", "@babel/parser@^7.14.7", "@babel/parser@^7.18.10", "@babel/parser@^7.18.13", "@babel/parser@^7.4.3", "@babel/parser@^7.4.5", "@babel/parser@^7.7.0":
+"@babel/parser@^7.1.0", "@babel/parser@^7.1.6", "@babel/parser@^7.14.7", "@babel/parser@^7.18.13", "@babel/parser@^7.4.3", "@babel/parser@^7.7.0":
+  version "7.21.3"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.21.3.tgz#1d285d67a19162ff9daa358d4cb41d50c06220b3"
+  integrity sha512-lobG0d7aOfQRXh8AyklEAgZGvA4FShxo6xQbUrrT/cNBPUdIDojlokwJsQyCC/eKia7ifqM0yP+2DRZ4WKw2RQ==
+
+"@babel/parser@^7.18.10", "@babel/parser@^7.4.5":
   version "7.18.13"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.18.13.tgz#5b2dd21cae4a2c5145f1fbd8ca103f9313d3b7e4"
   integrity sha512-dgXcIfMuQ0kgzLB2b9tRZs7TTFFaGM2AbtA4fJgUUYukzGH4jwsS7hzQHEGs67jdehpm22vkgKwvbU+aEflgwg==
@@ -766,7 +828,16 @@
     "@babel/helper-plugin-utils" "^7.18.6"
     babel-plugin-dynamic-import-node "^2.3.3"
 
-"@babel/plugin-transform-modules-commonjs@^7.1.0", "@babel/plugin-transform-modules-commonjs@^7.18.6", "@babel/plugin-transform-modules-commonjs@^7.4.4":
+"@babel/plugin-transform-modules-commonjs@^7.1.0":
+  version "7.21.2"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.21.2.tgz#6ff5070e71e3192ef2b7e39820a06fb78e3058e7"
+  integrity sha512-Cln+Yy04Gxua7iPdj6nOV96smLGjpElir5YwzF0LBPKoPlLDNJePNlrGGaybAJkd0zKRnOVXOgizSqPYMNYkzA==
+  dependencies:
+    "@babel/helper-module-transforms" "^7.21.2"
+    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/helper-simple-access" "^7.20.2"
+
+"@babel/plugin-transform-modules-commonjs@^7.18.6", "@babel/plugin-transform-modules-commonjs@^7.4.4":
   version "7.18.6"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.18.6.tgz#afd243afba166cca69892e24a8fd8c9f2ca87883"
   integrity sha512-Qfv2ZOWikpvmedXQJDSbxNqy7Xr/j2Y8/KfijM0iJyKkBTmWuvCA1yeH1yDM7NJhBW/2aXxeucLj6i80/LAJ/Q==
@@ -1181,12 +1252,12 @@
     source-map-support "^0.5.16"
 
 "@babel/runtime-corejs2@^7.4.2":
-  version "7.17.8"
-  resolved "https://registry.yarnpkg.com/@babel/runtime-corejs2/-/runtime-corejs2-7.17.8.tgz#c026a0801d400080bee9b805fb45031da5bab2ea"
-  integrity sha512-KWN7KTjojEVk+hhT7EtvWtSBTueqnPiCT2xPoDFF+ept2Sx9UKnLY7hGsnrNsdx7jvMUQnHoDS6AHCys7i15LA==
+  version "7.23.2"
+  resolved "https://registry.yarnpkg.com/@babel/runtime-corejs2/-/runtime-corejs2-7.23.2.tgz#a482c6e233fb2efa6456ce299da1b440b87260ed"
+  integrity sha512-lTwRWGcAUBANnxD0A4c5/wKQ0eLhgdAy9kdY2rzTmmliumBQ8u8awykMnaQAnZR3PC47jLRjGoj+hozZqy9Bww==
   dependencies:
-    core-js "^2.6.5"
-    regenerator-runtime "^0.13.4"
+    core-js "^2.6.12"
+    regenerator-runtime "^0.14.0"
 
 "@babel/runtime-corejs3@^7.10.2":
   version "7.12.5"
@@ -1203,7 +1274,14 @@
   dependencies:
     regenerator-runtime "^0.12.0"
 
-"@babel/runtime@^7.1.2", "@babel/runtime@^7.10.0", "@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.1", "@babel/runtime@^7.12.5", "@babel/runtime@^7.15.4", "@babel/runtime@^7.16.3", "@babel/runtime@^7.18.9", "@babel/runtime@^7.3.1", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.2", "@babel/runtime@^7.7.2", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2":
+"@babel/runtime@^7.1.2", "@babel/runtime@^7.15.4", "@babel/runtime@^7.9.2":
+  version "7.23.2"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.23.2.tgz#062b0ac103261d68a966c4c7baf2ae3e62ec3885"
+  integrity sha512-mM8eg4yl5D6i3lu2QKPuPH4FArvJ8KhTofbE7jwMUv9KX5mBvwPAqnV3MlyBNqdp9RyRKP6Yck8TrfYrPvX3bg==
+  dependencies:
+    regenerator-runtime "^0.14.0"
+
+"@babel/runtime@^7.10.0", "@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.1", "@babel/runtime@^7.12.5", "@babel/runtime@^7.16.3", "@babel/runtime@^7.18.9", "@babel/runtime@^7.3.1", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.2", "@babel/runtime@^7.7.2", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.4":
   version "7.18.9"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.18.9.tgz#b4fcfce55db3d2e5e080d2490f608a3b9f407f4a"
   integrity sha512-lkqXDcvlFT5rvEjiu6+QYO+1GXrEHRo2LOtS7E4GtX5ESIZOgepqsZBVIj6Pv+a6zqsya9VCgiK1KAK4BvJDAw==
@@ -1252,6 +1330,15 @@
     "@babel/helper-validator-identifier" "^7.18.6"
     to-fast-properties "^2.0.0"
 
+"@babel/types@^7.22.15", "@babel/types@^7.22.5":
+  version "7.23.0"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.23.0.tgz#8c1f020c9df0e737e4e247c0619f58c68458aaeb"
+  integrity sha512-0oIyUfKoI3mSqMvsxBdclDwxXKXAUA8v/apZbc+iSyARYou1o8ZGDxbUYyLFoW2arqS2jDGqJuZvv1d/io1axg==
+  dependencies:
+    "@babel/helper-string-parser" "^7.22.5"
+    "@babel/helper-validator-identifier" "^7.22.20"
+    to-fast-properties "^2.0.0"
+
 "@bcoe/v8-coverage@^0.2.3":
   version "0.2.3"
   resolved "https://registry.yarnpkg.com/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz#75a2e8b51cb758a7553d6804a5932d7aace75c39"
@@ -2142,12 +2229,13 @@
     classnames "^2.3.1"
     prop-types "^15.7.2"
 
-"@dhis2/analytics@^24.2.7":
-  version "24.2.7"
-  resolved "https://registry.yarnpkg.com/@dhis2/analytics/-/analytics-24.2.7.tgz#c2e7796d909bf8e36552138a5cd6e3d414b8d09d"
-  integrity sha512-orEO14qzdTacQZdUVTOHlbZsdsGm3Q2Wjk3ELPBnsPIKq2c+9J4ve34wwc7wBcvVJP/BlW5LEs97G7DdjqurFA==
+"@dhis2/analytics@^24.9.3":
+  version "24.10.1"
+  resolved "https://registry.yarnpkg.com/@dhis2/analytics/-/analytics-24.10.1.tgz#ad595451b724044448c22a413875f0d36df20e8d"
+  integrity sha512-HhKDYzTnk8Uh11523JIjx0lhgIRgcWihCkTlT3qHoaDOhAQdQcadd5i/byjhXpeXrrtqfL0x2gn0Scy3siA2Cg==
   dependencies:
     "@dhis2/d2-ui-rich-text" "^7.4.0"
+    "@dhis2/multi-calendar-dates" "1.0.0"
     classnames "^2.3.1"
     d2-utilizr "^0.2.16"
     d3-color "^1.2.3"
@@ -2172,30 +2260,30 @@
   dependencies:
     prop-types "^15.7.2"
 
-"@dhis2/app-runtime@^3.2.3", "@dhis2/app-runtime@^3.4.4":
-  version "3.4.4"
-  resolved "https://registry.yarnpkg.com/@dhis2/app-runtime/-/app-runtime-3.4.4.tgz#87202b82babe6e4b3f29f784e02a3b295960359c"
-  integrity sha512-GTj0H6TLVcw6zo0Vf9aDuPJbsjFfbNWN/SSC9/GF2a0foXdKVSCoc4H5+gW/RhBgYvaSZYwQBA6L+qBaQj7c0Q==
+"@dhis2/app-runtime@^3.2.3", "@dhis2/app-runtime@^3.9.0":
+  version "3.9.4"
+  resolved "https://registry.yarnpkg.com/@dhis2/app-runtime/-/app-runtime-3.9.4.tgz#88243dbb9a4a805be744a61cffd13a4c3d2d031d"
+  integrity sha512-CBwMXer5/Kcxf6MgfwPgpEaUSXbDXzwItCkH3i0nsjmkD0KIaEOZ6Y1pQL+/5RYnziZ5glYCFWsCKn0eCJrdJg==
   dependencies:
-    "@dhis2/app-service-alerts" "3.4.4"
-    "@dhis2/app-service-config" "3.4.4"
-    "@dhis2/app-service-data" "3.4.4"
-    "@dhis2/app-service-offline" "3.4.4"
+    "@dhis2/app-service-alerts" "3.9.4"
+    "@dhis2/app-service-config" "3.9.4"
+    "@dhis2/app-service-data" "3.9.4"
+    "@dhis2/app-service-offline" "3.9.4"
 
-"@dhis2/app-service-alerts@3.4.4":
-  version "3.4.4"
-  resolved "https://registry.yarnpkg.com/@dhis2/app-service-alerts/-/app-service-alerts-3.4.4.tgz#ccd8848f416e976a01ea11bbbd6e1ae873136777"
-  integrity sha512-o2DHlZIHxJQ4XwJ9uIr0UpMTi3ZK0W6u+FkSnPGwrvF+MCFsxA0+pjN7PfBo4acCQHPBwTZzcyq0WYiEAJM7OA==
+"@dhis2/app-service-alerts@3.9.4":
+  version "3.9.4"
+  resolved "https://registry.yarnpkg.com/@dhis2/app-service-alerts/-/app-service-alerts-3.9.4.tgz#5aed2b191bb98bbf5eb14babb495b70f28b69aff"
+  integrity sha512-Oq2PZMcYyB+uXNwmifclv8oVobuKLTfN9ia7Gwa5G63c7Zjl4HldOxrM3TGDnsGYWfuGxtm8LNuzKfFX91HWmg==
 
-"@dhis2/app-service-config@3.4.4":
-  version "3.4.4"
-  resolved "https://registry.yarnpkg.com/@dhis2/app-service-config/-/app-service-config-3.4.4.tgz#b5773138183bf339055957bdd1d24b54fecc404e"
-  integrity sha512-QCUfptfmwh3Xs16rr7DDTgMBuQIcJpt2CZEc6XROPYMgBBvN3sncA9Rzb7Jf+xblZwUWi0xuZ7PKs49FFS+5kQ==
+"@dhis2/app-service-config@3.9.4":
+  version "3.9.4"
+  resolved "https://registry.yarnpkg.com/@dhis2/app-service-config/-/app-service-config-3.9.4.tgz#4cab3a4ba090e53235f01c6a6913467171052d89"
+  integrity sha512-hiJr33zNWjUWJDx8l7tFMDfzX11euE+t6+ph2x9LnQ9KHDXFhh3GZhyQnX+8IATtlS4Fx9fjz2scQhGsg2dt0g==
 
-"@dhis2/app-service-data@3.4.4":
-  version "3.4.4"
-  resolved "https://registry.yarnpkg.com/@dhis2/app-service-data/-/app-service-data-3.4.4.tgz#028236463b82f998ff7bd44e811153f6c1408507"
-  integrity sha512-mJyaSRikY5noXHdpSm3pTPM/ga+6Jp7XgG62J0mSXsVbwYSOJSLQqcponXsTNwaX3IuQHLir83dXe06YjZq70Q==
+"@dhis2/app-service-data@3.9.4":
+  version "3.9.4"
+  resolved "https://registry.yarnpkg.com/@dhis2/app-service-data/-/app-service-data-3.9.4.tgz#03cd4cc40a316670d5ae328488cc8ef2a8a9b377"
+  integrity sha512-3AFwBkR1H8M6b+T5N3vcRsx9iiJm5LjltXYkbA9fmxcjJ02VoHa2B3a529pp8w9qSp7mpAF4Kmr3gZPvFpBRDA==
   dependencies:
     react-query "^3.13.11"
 
@@ -2212,10 +2300,10 @@
     "@dhis2/app-service-data" "^2.1.1"
     uuid "^8.1.0"
 
-"@dhis2/app-service-offline@3.4.4":
-  version "3.4.4"
-  resolved "https://registry.yarnpkg.com/@dhis2/app-service-offline/-/app-service-offline-3.4.4.tgz#49d460b22c8eb8357aeef05aee8ed6f8a5c3a953"
-  integrity sha512-wBlaMh7rdlr9RQ02q5vADtk9ixFtfI5ywXmxCPiXPBRftahMqwUpGpD88KPIUpoSPRI0V2LYGv0XQm33+gmKnw==
+"@dhis2/app-service-offline@3.9.4":
+  version "3.9.4"
+  resolved "https://registry.yarnpkg.com/@dhis2/app-service-offline/-/app-service-offline-3.9.4.tgz#ba4f3a916ca9a4c714fdedac51c66daa4f2c6bd7"
+  integrity sha512-vtv9V3Za/ukujPpqBRGkKZTloM2Cu29J+zHziyrTKC+hVsw8p3d4dHgXvpOGLcjq3ePAvEX4aEZK9+VCHnNFRQ==
   dependencies:
     lodash "^4.17.21"
 
@@ -2360,14 +2448,22 @@
     moment "^2.24.0"
 
 "@dhis2/d2-ui-rich-text@^7.4.0":
-  version "7.4.0"
-  resolved "https://registry.yarnpkg.com/@dhis2/d2-ui-rich-text/-/d2-ui-rich-text-7.4.0.tgz#e1fb6eff7309ea80a6af3bee2a247c9f93ea721d"
-  integrity sha512-q8woPPyYHiqQfNtujuCQH8eq7zRcN0140XqrKHw1DXF/fnqmrcVDTNZkPSaWMuUsdPhcgTHcnuEySP0MRAXv6g==
+  version "7.4.3"
+  resolved "https://registry.yarnpkg.com/@dhis2/d2-ui-rich-text/-/d2-ui-rich-text-7.4.3.tgz#a42c8e231bcc05186dd432dac86b33aed4ddc10d"
+  integrity sha512-60k/6CO2I8f4t3jU1nAic7uWONME1rckM8RcLnelhwUG20EZWq45OnDDdSfHgOWTwVDtxFnG3wspInkG/530KA==
   dependencies:
     babel-runtime "^6.26.0"
     markdown-it "^8.4.2"
     prop-types "^15.6.2"
 
+"@dhis2/multi-calendar-dates@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@dhis2/multi-calendar-dates/-/multi-calendar-dates-1.0.0.tgz#bf7f49aecdffa9781837a5d60d56a094b74ab4df"
+  integrity sha512-IB9a+feuS6yE4lpZj/eZ9uBmpYI7Hxitl2Op0JjoRL4tP+p6uw4ns9cjoSdUeIU9sOAxVZV7oQqSyIw+9P6YjQ==
+  dependencies:
+    "@js-temporal/polyfill" "^0.4.2"
+    classnames "^2.3.2"
+
 "@dhis2/prop-types@^3.1.2":
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/@dhis2/prop-types/-/prop-types-3.1.2.tgz#65b8ad2da8cd2f72bc8b951049a6c9d1b97af3e9"
@@ -2919,6 +3015,14 @@
     "@jridgewell/resolve-uri" "^3.0.3"
     "@jridgewell/sourcemap-codec" "^1.4.10"
 
+"@js-temporal/polyfill@^0.4.2":
+  version "0.4.4"
+  resolved "https://registry.yarnpkg.com/@js-temporal/polyfill/-/polyfill-0.4.4.tgz#4c26b4a1a68c19155808363f520204712cfc2558"
+  integrity sha512-2X6bvghJ/JAoZO52lbgyAPFj8uCflhTo2g7nkFzEQdXd/D8rEeD4HtmTEpmtGCva260fcd66YNXBOYdnmHqSOg==
+  dependencies:
+    jsbi "^4.3.0"
+    tslib "^2.4.1"
+
 "@juggle/resize-observer@^3.3.1":
   version "3.3.1"
   resolved "https://registry.yarnpkg.com/@juggle/resize-observer/-/resize-observer-3.3.1.tgz#b50a781709c81e10701004214340f25475a171a0"
@@ -5068,7 +5172,17 @@ browserify@^16.1.0:
     vm-browserify "^1.0.0"
     xtend "^4.0.0"
 
-browserslist@^4.0.0, browserslist@^4.14.5, browserslist@^4.16.6, browserslist@^4.18.1, browserslist@^4.20.2, browserslist@^4.20.3, browserslist@^4.21.3, browserslist@^4.6.0:
+browserslist@^4.0.0, browserslist@^4.14.5, browserslist@^4.16.6, browserslist@^4.18.1, browserslist@^4.20.3, browserslist@^4.21.3:
+  version "4.21.5"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.5.tgz#75c5dae60063ee641f977e00edd3cfb2fb7af6a7"
+  integrity sha512-tUkiguQGW7S3IhB7N+c2MV/HZPSCPAAiYBZXLsBhFB/PCy6ZKKsZrmBayHV9fdGV/ARIfJ14NkxKzRDjvp7L6w==
+  dependencies:
+    caniuse-lite "^1.0.30001449"
+    electron-to-chromium "^1.4.284"
+    node-releases "^2.0.8"
+    update-browserslist-db "^1.0.10"
+
+browserslist@^4.20.2, browserslist@^4.6.0:
   version "4.21.3"
   resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.3.tgz#5df277694eb3c48bc5c4b05af3e8b7e09c5a6d1a"
   integrity sha512-898rgRXLAyRkM1GryrrBHGkqA5hlpkV5MhtZwg9QXeiyLUYs2k00Un05aX5l2/yJIOObYKOpS2JNo8nJDE7fWQ==
@@ -5249,10 +5363,15 @@ caniuse-api@^3.0.0:
     lodash.memoize "^4.1.2"
     lodash.uniq "^4.5.0"
 
-caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001370, caniuse-lite@^1.0.30001373:
-  version "1.0.30001383"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001383.tgz#aecf317ccd940690725ae3ae4f28293c5fb8050e"
-  integrity sha512-swMpEoTp5vDoGBZsYZX7L7nXHe6dsHxi9o6/LKf/f0LukVtnrxly5GVb/fWdCDTqi/yw6Km6tiJ0pmBacm0gbg==
+caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001373, caniuse-lite@^1.0.30001449:
+  version "1.0.30001473"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001473.tgz#3859898b3cab65fc8905bb923df36ad35058153c"
+  integrity sha512-ewDad7+D2vlyy+E4UJuVfiBsU69IL+8oVmTuZnH5Q6CIUbxNfI50uVpRHbUPDD6SUaN2o0Lh4DhTrvLG/Tn1yg==
+
+caniuse-lite@^1.0.30001370:
+  version "1.0.30001547"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001547.tgz#d4f92efc488aab3c7f92c738d3977c2a3180472b"
+  integrity sha512-W7CrtIModMAxobGhz8iXmDfuJiiKg1WADMO/9x7/CLNin5cpSbuBjooyoIUVB5eyCc36QuTVlkVa1iB2S5+/eA==
 
 capture-exit@^2.0.0:
   version "2.0.0"
@@ -5445,10 +5564,10 @@ class-utils@^0.3.5:
     isobject "^3.0.0"
     static-extend "^0.1.1"
 
-classnames@^2.2.6, classnames@^2.3.1:
-  version "2.3.1"
-  resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e"
-  integrity sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA==
+classnames@^2.2.6, classnames@^2.3.1, classnames@^2.3.2:
+  version "2.3.2"
+  resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.3.2.tgz#351d813bf0137fcc6a76a16b88208d2560a0d924"
+  integrity sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==
 
 clean-css@^5.2.2:
   version "5.3.1"
@@ -5731,9 +5850,9 @@ compare-func@^2.0.0:
     dot-prop "^5.1.0"
 
 complex.js@^2.0.15:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/complex.js/-/complex.js-2.1.0.tgz#211258e271345213c6f004c0ea90a34eb1e0c753"
-  integrity sha512-RdcrDz7YynXp/YXGwXIZ4MtmxXXniT5WmLFRX93cuXUX+0geWAqB8l1BoLXF+3BkzviVzHlpw27P9ow7MvlcmA==
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/complex.js/-/complex.js-2.1.1.tgz#0675dac8e464ec431fb2ab7d30f41d889fb25c31"
+  integrity sha512-8njCHOTtFFLtegk6zQo0kkVX1rngygb/KQI6z1qZxlFI3scluC+LVTCFbrkWjBv4vvLlbQ9t88IPMC6k95VTTg==
 
 component-emitter@^1.2.1:
   version "1.3.0"
@@ -5936,7 +6055,7 @@ core-js-pure@^3.0.0, core-js-pure@^3.8.1:
   resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.25.0.tgz#f8d1f176ff29abbfeb610110de891d5ae5a361d4"
   integrity sha512-IeHpLwk3uoci37yoI2Laty59+YqH9x5uR65/yiA0ARAJrTrN4YU0rmauLWfvqOuk77SlNJXj2rM6oT/dBD87+A==
 
-core-js@^2.4.0, core-js@^2.6.5:
+core-js@^2.4.0, core-js@^2.6.12:
   version "2.6.12"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.12.tgz#d9333dfa7b065e347cc5682219d6f690859cc2ec"
   integrity sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==
@@ -6559,11 +6678,16 @@ decamelize@^1.1.0, decamelize@^1.2.0:
   resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-1.2.0.tgz#f6534d15148269b20352e7bee26f501f9a191290"
   integrity sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=
 
-decimal.js@^10.2.1, decimal.js@^10.3.1:
+decimal.js@^10.2.1:
   version "10.3.1"
   resolved "https://registry.yarnpkg.com/decimal.js/-/decimal.js-10.3.1.tgz#d8c3a444a9c6774ba60ca6ad7261c3a94fd5e783"
   integrity sha512-V0pfhfr8suzyPGOx3nmq4aHqabehUZn6Ch9kyFpV79TGDTWFmHqUqXdabR7QHqxzrYolF4+tVmJhUG4OURg5dQ==
 
+decimal.js@^10.3.1:
+  version "10.4.3"
+  resolved "https://registry.yarnpkg.com/decimal.js/-/decimal.js-10.4.3.tgz#1044092884d245d1b7f65725fa4ad4c6f781cc23"
+  integrity sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==
+
 decode-uri-component@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/decode-uri-component/-/decode-uri-component-0.2.0.tgz#eb3913333458775cb84cd1a1fae062106bb87545"
@@ -7013,9 +7137,14 @@ ejs@^3.0.2, ejs@^3.1.6:
     jake "^10.8.5"
 
 electron-to-chromium@^1.4.202:
-  version "1.4.230"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.230.tgz#666909fdf5765acb1348b69752ee9955dc1664b7"
-  integrity sha512-3pwjAK0qHSDN9+YAF4fJknsSruP7mpjdWzUSruIJD/JCH77pEh0SorEyb3xVaKkfwk2tzjOt2D8scJ0KAdfXLA==
+  version "1.4.553"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.553.tgz#56fd65afddbd713c52f0e95d0223b3368f520865"
+  integrity sha512-HiRdtyKS2+VhiXvjhMvvxiMC33FJJqTA5EB2YHgFZW6v7HkK4Q9Ahv2V7O2ZPgAjw+MyCJVMQvigj13H8t+wvA==
+
+electron-to-chromium@^1.4.284:
+  version "1.4.345"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.345.tgz#c90b7183b39245cddf0e990337469063bfced6f0"
+  integrity sha512-znGhOQK2TUYLICgS25uaM0a7pHy66rSxbre7l762vg9AUoCcJK+Bu+HCPWpjL/U/kK8/Hf+6E0szAUJSyVYb3Q==
 
 elegant-spinner@^1.0.1:
   version "1.0.1"
@@ -8214,7 +8343,12 @@ forwarded@0.2.0:
   resolved "https://registry.yarnpkg.com/forwarded/-/forwarded-0.2.0.tgz#2269936428aad4c15c7ebe9779a84bf0b2a81811"
   integrity sha512-buRG0fpBtRHSTCOASe6hD258tEubFoRLb4ZNA6NxMVHNw2gOcwHo9wyablzMzOA5z9xA9L1KNjk/Nt6MT9aYow==
 
-fraction.js@^4.1.1, fraction.js@^4.2.0:
+fraction.js@^4.1.1:
+  version "4.3.6"
+  resolved "https://registry.yarnpkg.com/fraction.js/-/fraction.js-4.3.6.tgz#e9e3acec6c9a28cf7bc36cbe35eea4ceb2c5c92d"
+  integrity sha512-n2aZ9tNfYDwaHhvFTkhFErqOMIb8uyzSQ+vGJBjZyanAKZVbGUQ1sngfk9FdkBw7G26O7AgNjLcecLffD1c7eg==
+
+fraction.js@^4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/fraction.js/-/fraction.js-4.2.0.tgz#448e5109a313a3527f5a3ab2119ec4cf0e0e2950"
   integrity sha512-MhLuK+2gUcnZe8ZHlaaINnQLl0xRIGRfcGk2yl8xoQAfHrSsL3rYu6FCmBdkdbhc9EPlwyGHewaRsvwRMJtAlA==
@@ -9745,7 +9879,7 @@ jake@^10.8.5:
 javascript-natural-sort@^0.7.1:
   version "0.7.1"
   resolved "https://registry.yarnpkg.com/javascript-natural-sort/-/javascript-natural-sort-0.7.1.tgz#f9e2303d4507f6d74355a73664d1440fb5a0ef59"
-  integrity sha1-+eIwPUUH9tdDVac2ZNFED7Wg71k=
+  integrity sha512-nO6jcEfZWQXDhOiBtG2KvKyEptz7RVbpGP4vTD2hLBdmNQSsCiicO2Ioinv6UI4y9ukqnBpy+XZ9H6uLNgJTlw==
 
 jest-changed-files@^27.5.1:
   version "27.5.1"
@@ -10368,6 +10502,11 @@ js-yaml@^4.1.0:
   dependencies:
     argparse "^2.0.1"
 
+jsbi@^4.3.0:
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/jsbi/-/jsbi-4.3.0.tgz#b54ee074fb6fcbc00619559305c8f7e912b04741"
+  integrity sha512-SnZNcinB4RIcnEyZqFPdGPVgrg2AcnykiBy0sHVJQKHYeaLUvi3Exj+iaPpLnFVkDPZIV4U0yvgC9/R4uEAZ9g==
+
 jsbn@~0.1.0:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513"
@@ -10922,7 +11061,7 @@ lodash.isarray@^3.0.0:
 lodash.isboolean@^3.0.3:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/lodash.isboolean/-/lodash.isboolean-3.0.3.tgz#6c2e171db2a257cd96802fd43b01b20d5f5870f6"
-  integrity sha1-bC4XHbKiV82WgC/UOwGyDV9YcPY=
+  integrity sha512-Bz5mupy2SVbPHURB98VAcw+aHh4vRV5IPNhILUCsOzRmsTmSQ17jIuqopAentWoehktxGd9e/hbIXq980/1QJg==
 
 lodash.isequal@^3.0:
   version "3.0.4"
@@ -10945,17 +11084,17 @@ lodash.isfunction@^3.0.8:
 lodash.ismap@^4.3.0:
   version "4.4.2"
   resolved "https://registry.yarnpkg.com/lodash.ismap/-/lodash.ismap-4.4.2.tgz#836bf06dee57fd3d2aa357bf6946e61d1e77e279"
-  integrity sha1-g2vwbe5X/T0qo1e/aUbmHR534nk=
+  integrity sha512-djSMwsQ2aRroLLC+xNzJXIFkEkM28FYzNykbBPZpcgdsNV9vx+BIwuMUoSBSf+1f7wB+pym/nlAWCOeI+L8ysw==
 
 lodash.isnumber@^3.0.3:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/lodash.isnumber/-/lodash.isnumber-3.0.3.tgz#3ce76810c5928d03352301ac287317f11c0b1ffc"
-  integrity sha1-POdoEMWSjQM1IwGsKHMX8RwLH/w=
+  integrity sha512-QYqzpfwO3/CWf3XP+Z+tkQsfaLL/EnUlXWVkIk5FUPc4sBdTehEqZONuyRt2P67PXAk+NXmTBcc97zw9t1FQrw==
 
 lodash.isobject@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/lodash.isobject/-/lodash.isobject-3.0.2.tgz#3c8fb8d5b5bf4bf90ae06e14f2a530a4ed935e1d"
-  integrity sha1-PI+41bW/S/kK4G4U8qUwpO2TXh0=
+  integrity sha512-3/Qptq2vr7WeJbB4KHUSKlq8Pl7ASXi3UG6CMbBm8WRtXi8+GHm7mKaU3urfpSEzWe2wCIChs6/sdocUsTKJiA==
 
 lodash.isplainobject@^4.0.6:
   version "4.0.6"
@@ -10965,12 +11104,12 @@ lodash.isplainobject@^4.0.6:
 lodash.isset@^4.3.0:
   version "4.4.2"
   resolved "https://registry.yarnpkg.com/lodash.isset/-/lodash.isset-4.4.2.tgz#d5eecc56b7a97ab588509e4795b3541b1cdb67bb"
-  integrity sha1-1e7MVreperWIUJ5HlbNUGxzbZ7s=
+  integrity sha512-3+m3GgoE5hTnRfbgCvOjGVHp2YAm/+MKpAS2JkaL9b5BISNRT+VkGngS7r3nAAschsx4fdLnWsM4wcDyvu0UCA==
 
 lodash.isstring@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/lodash.isstring/-/lodash.isstring-4.0.1.tgz#d527dfb5456eca7cc9bb95d5daeaf88ba54a5451"
-  integrity sha1-1SfftUVuynzJu5XV2ur4i6VKVFE=
+  integrity sha512-0wJxfxH1wgO3GrbuP+dTTk7op+6L41QCXbGINEmD+ny/G/eCqGzxyCsh7159S+mgDDcoarnBw6PC1PS5+wUGgw==
 
 lodash.istypedarray@^3.0.0:
   version "3.0.6"
@@ -11245,7 +11384,7 @@ mdn-data@2.0.4:
 mdurl@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/mdurl/-/mdurl-1.0.1.tgz#fe85b2ec75a59037f2adfec100fd6c601761152e"
-  integrity sha1-/oWy7HWlkDfyrf7BAP1sYBdhFS4=
+  integrity sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g==
 
 media-typer@0.3.0:
   version "0.3.0"
@@ -11644,9 +11783,14 @@ node-int64@^0.4.0:
   integrity sha1-h6kGXNs1XTGC2PlM4RGIuCXGijs=
 
 node-releases@^2.0.6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.6.tgz#8a7088c63a55e493845683ebf3c828d8c51c5503"
-  integrity sha512-PiVXnNuFm5+iYkLBNeq5211hvO38y63T0i2KKh2KnUs3RpzJ+JtODFjkD8yjLwnDkTYF1eKXheUwdssR+NRZdg==
+  version "2.0.13"
+  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.13.tgz#d5ed1627c23e3461e819b02e57b75e4899b1c81d"
+  integrity sha512-uYr7J37ae/ORWdZeQ1xxMJe3NtdmqMC/JZK+geofDrkLUApKRHPd18/TxtBOJ4A0/+uUIliorNrfYV6s1b02eQ==
+
+node-releases@^2.0.8:
+  version "2.0.10"
+  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.10.tgz#c311ebae3b6a148c89b1813fd7c4d3c024ef537f"
+  integrity sha512-5GFldHPXVG/YZmFzJvKK2zDSzPKhEp0+ZR5SVaoSag9fsL5YgHbUHDfnG5494ISANDcK4KwPXAx2xqVEydmd7w==
 
 normalize-package-data@^2.3.2, normalize-package-data@^2.3.4, normalize-package-data@^2.5.0:
   version "2.5.0"
@@ -13568,13 +13712,20 @@ redux-thunk@^2.2.0:
   resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.3.0.tgz#51c2c19a185ed5187aaa9a2d08b666d0d6467622"
   integrity sha512-km6dclyFnmcvxhAcrQV2AkZmPQjzPDjgVlQtR0EQjxZPyJ0BnMf3in1ryuR8A2qU0HldVRfxYXbFSKlI3N7Slw==
 
-redux@^4.0.0, redux@^4.0.1, redux@^4.0.4, redux@^4.0.5:
+redux@^4.0.0, redux@^4.0.4, redux@^4.0.5:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/redux/-/redux-4.1.2.tgz#140f35426d99bb4729af760afcf79eaaac407104"
   integrity sha512-SH8PglcebESbd/shgf6mii6EIoRM0zrQyjcuQ+ojmfxjTtE0z9Y8pa62iA/OJ58qjP6j27uyW4kUF4jl/jd6sw==
   dependencies:
     "@babel/runtime" "^7.9.2"
 
+redux@^4.0.1:
+  version "4.2.1"
+  resolved "https://registry.yarnpkg.com/redux/-/redux-4.2.1.tgz#c08f4306826c49b5e9dc901dee0452ea8fce6197"
+  integrity sha512-LAUYz4lc+Do8/g7aeRa8JkyDErK6ekstQaqWQrNRW//MY1TvCEpMtpTWvlQ+FPbWCx+Xixu/6SHt5N0HR+SB4w==
+  dependencies:
+    "@babel/runtime" "^7.9.2"
+
 reflect.ownkeys@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/reflect.ownkeys/-/reflect.ownkeys-0.2.0.tgz#749aceec7f3fdf8b63f927a04809e90c5c0b3460"
@@ -13602,11 +13753,21 @@ regenerator-runtime@^0.12.0:
   resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz#fa1a71544764c036f8c49b13a08b2594c9f8a0de"
   integrity sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg==
 
-regenerator-runtime@^0.13.4, regenerator-runtime@^0.13.9:
+regenerator-runtime@^0.13.4:
+  version "0.13.11"
+  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz#f6dca3e7ceec20590d07ada785636a90cdca17f9"
+  integrity sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==
+
+regenerator-runtime@^0.13.9:
   version "0.13.9"
   resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz#8925742a98ffd90814988d7566ad30ca3b263b52"
   integrity sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==
 
+regenerator-runtime@^0.14.0:
+  version "0.14.0"
+  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz#5e19d68eb12d486f797e15a3c6a918f7cec5eb45"
+  integrity sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==
+
 regenerator-transform@^0.15.0:
   version "0.15.0"
   resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.15.0.tgz#cbd9ead5d77fae1a48d957cf889ad0586adb6537"
@@ -14591,7 +14752,7 @@ split2@^2.0.0:
 sprintf-js@~1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c"
-  integrity sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=
+  integrity sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==
 
 sshpk@^1.7.0:
   version "1.16.1"
@@ -15324,9 +15485,9 @@ tiny-emitter@^2.1.0:
   integrity sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q==
 
 tiny-invariant@^1.0.4, tiny-invariant@^1.0.6:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/tiny-invariant/-/tiny-invariant-1.2.0.tgz#a1141f86b672a9148c72e978a19a73b9b94a15a9"
-  integrity sha512-1Uhn/aqw5C6RI4KejVeTg6mIS7IqxnLJ8Mv2tV5rTc0qWobay7pDUz6Wi392Cnc8ak1H0F2cjoRzb2/AW4+Fvg==
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/tiny-invariant/-/tiny-invariant-1.3.1.tgz#8560808c916ef02ecfd55e66090df23a4b7aa642"
+  integrity sha512-AD5ih2NlSssTCwsMznbvwMZpJ1cbhkGd2uueNxzv2jDlEeZdU04JQfRnggJQ8DrcVBGjAsCKwFBbDlVNtEMlzw==
 
 title-case@^2.1.1:
   version "2.1.1"
@@ -15507,10 +15668,10 @@ tslib@^1.8.1, tslib@^1.9.0:
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.13.0.tgz#c881e13cc7015894ed914862d276436fa9a47043"
   integrity sha512-i/6DQjL8Xf3be4K/E6Wgpekn5Qasl1usyw++dAA35Ue5orEn65VIxOA+YvNNl9HV3qv70T7CNwjODHZrLwvd1Q==
 
-tslib@^2.0.1, tslib@^2.0.3:
-  version "2.4.0"
-  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.4.0.tgz#7cecaa7f073ce680a05847aa77be941098f36dc3"
-  integrity sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==
+tslib@^2.0.1, tslib@^2.0.3, tslib@^2.4.1:
+  version "2.6.2"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.2.tgz#703ac29425e7b37cd6fd456e92404d46d1f3e4ae"
+  integrity sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==
 
 tsutils@^3.21.0:
   version "3.21.0"
@@ -15774,10 +15935,18 @@ upath@^1.1.1, upath@^1.2.0:
   resolved "https://registry.yarnpkg.com/upath/-/upath-1.2.0.tgz#8f66dbcd55a883acdae4408af8b035a5044c1894"
   integrity sha512-aZwGpamFO61g3OlfT7OQCHqhGnW43ieH9WZeP7QxN/G/jS4jfqUkZxoryvJgVPEcrl5NL/ggHsSmLMHuH64Lhg==
 
+update-browserslist-db@^1.0.10:
+  version "1.0.10"
+  resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.10.tgz#0f54b876545726f17d00cd9a2561e6dade943ff3"
+  integrity sha512-OztqDenkfFkbSG+tRxBeAnCVPckDBcvibKd35yDONx6OU8N7sqgwc7rCbkJ/WcYtVRZ4ba68d6byhC21GFh7sQ==
+  dependencies:
+    escalade "^3.1.1"
+    picocolors "^1.0.0"
+
 update-browserslist-db@^1.0.5:
-  version "1.0.5"
-  resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.5.tgz#be06a5eedd62f107b7c19eb5bcefb194411abf38"
-  integrity sha512-dteFFpCyvuDdr9S/ff1ISkKt/9YZxKjI9WlRR99c180GaztJtRa/fn18FdxGVKVsnPY7/a/FDN68mcvUmP4U7Q==
+  version "1.0.13"
+  resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz#3c5e4f5c083661bd38ef64b6328c26ed6c8248c4"
+  integrity sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==
   dependencies:
     escalade "^3.1.1"
     picocolors "^1.0.0"