@cdc/core 4.25.8 → 4.25.10

package/helpers/configDataHelpers.ts

@@ -0,0 +1,128 @@
+/**
+ * Helper functions for stripping and restoring data arrays from config objects
+ * to improve performance during cloning operations.
+ */
+
+/**
+ * Strips data arrays from config to improve cloning performance
+ */
+export const stripDataFromConfig = (config: any): { strippedConfig: any; extractedData: any } => {
+  const extractedData: any = {}
+  const strippedConfig = { ...config }
+
+  // Extract root-level data arrays
+  if (strippedConfig.data) {
+    extractedData.data = strippedConfig.data
+    delete strippedConfig.data
+  }
+  if (strippedConfig.formattedData) {
+    extractedData.formattedData = strippedConfig.formattedData
+    delete strippedConfig.formattedData
+  }
+  if (strippedConfig.originalFormattedData) {
+    extractedData.originalFormattedData = strippedConfig.originalFormattedData
+    delete strippedConfig.originalFormattedData
+  }
+  if (strippedConfig.datasets) {
+    extractedData.datasets = strippedConfig.datasets
+    delete strippedConfig.datasets
+  }
+
+  // Handle dashboard visualizations
+  if (strippedConfig.visualizations) {
+    extractedData.visualizations = {}
+    Object.keys(strippedConfig.visualizations).forEach(vizKey => {
+      const viz = strippedConfig.visualizations[vizKey]
+      const vizData: any = {}
+
+      if (!viz.type) return
+
+      if (viz.data) {
+        vizData.data = viz.data
+        delete strippedConfig.visualizations[vizKey].data
+      }
+      if (viz.formattedData) {
+        vizData.formattedData = viz.formattedData
+        delete strippedConfig.visualizations[vizKey].formattedData
+      }
+      if (viz.originalFormattedData) {
+        vizData.originalFormattedData = viz.originalFormattedData
+        delete strippedConfig.visualizations[vizKey].originalFormattedData
+      }
+      if (viz.datasets) {
+        vizData.datasets = viz.datasets
+        delete strippedConfig.visualizations[vizKey].datasets
+      }
+
+      if (Object.keys(vizData).length > 0) {
+        extractedData.visualizations[vizKey] = vizData
+      }
+    })
+  }
+
+  // Handle multiDashboards
+  if (strippedConfig.multiDashboards) {
+    extractedData.multiDashboards = []
+    strippedConfig.multiDashboards.forEach((dashboard, index) => {
+      const { strippedConfig: strippedDashboard, extractedData: dashboardData } = stripDataFromConfig(dashboard)
+      strippedConfig.multiDashboards[index] = strippedDashboard
+      extractedData.multiDashboards[index] = dashboardData
+    })
+  }
+
+  return { strippedConfig, extractedData }
+}
+
+/**
+ * Restores data arrays back to config after updates are complete
+ */
+export const restoreDataToConfig = (config: any, extractedData: any): any => {
+  const restoredConfig = { ...config }
+
+  // Restore root-level data arrays
+  if (extractedData.data) {
+    restoredConfig.data = extractedData.data
+  }
+  if (extractedData.formattedData) {
+    restoredConfig.formattedData = extractedData.formattedData
+  }
+  if (extractedData.originalFormattedData) {
+    restoredConfig.originalFormattedData = extractedData.originalFormattedData
+  }
+  if (extractedData.datasets) {
+    restoredConfig.datasets = extractedData.datasets
+  }
+
+  // Restore dashboard visualizations data
+  if (extractedData.visualizations && restoredConfig.visualizations) {
+    Object.keys(extractedData.visualizations).forEach(vizKey => {
+      const vizData = extractedData.visualizations[vizKey]
+      if (vizData.data) {
+        restoredConfig.visualizations[vizKey].data = vizData.data
+      }
+      if (vizData.formattedData) {
+        restoredConfig.visualizations[vizKey].formattedData = vizData.formattedData
+      }
+      if (vizData.originalFormattedData) {
+        restoredConfig.visualizations[vizKey].originalFormattedData = vizData.originalFormattedData
+      }
+      if (vizData.datasets) {
+        restoredConfig.visualizations[vizKey].datasets = vizData.datasets
+      }
+    })
+  }
+
+  // Restore multiDashboards data
+  if (extractedData.multiDashboards && restoredConfig.multiDashboards) {
+    extractedData.multiDashboards.forEach((dashboardData, index) => {
+      if (dashboardData && Object.keys(dashboardData).length > 0) {
+        restoredConfig.multiDashboards[index] = restoreDataToConfig(
+          restoredConfig.multiDashboards[index],
+          dashboardData
+        )
+      }
+    })
+  }
+
+  return restoredConfig
+}

package/helpers/configHelpers.ts

@@ -0,0 +1,27 @@
+import cloneConfig from './cloneConfig'
+
+/* editConfigKeys
+ * Add edit or update config keys
+ * keyUpdates: { path: string[], value: any }[]
+ * path is the array of keys needed to reach the value to be updated
+ * value is the new value to be set
+ * if the key does not exist, it will be created
+ */
+export function editConfigKeys<T = any>(config: T, keyUpdates: { path: string[]; value: any }[]): T {
+  const configDeepCopy = cloneConfig(config)
+
+  const newConfig = keyUpdates.reduce((acc, { path, value }) => {
+    const pathCopy = [...path]
+    const lastKey = pathCopy.pop()
+    const target = pathCopy.reduce((target, key) => {
+      if (!target[key]) {
+        target[key] = {}
+      }
+      return target[key]
+    }, acc)
+    target[lastKey] = value
+    return acc
+  }, configDeepCopy)
+
+  return newConfig
+}

package/helpers/constants.ts

@@ -1,6 +1,9 @@
 export const APP_FONT_SIZE = 18
-
 export const COOL_GRAY_90 = getComputedStyle(document.documentElement).getPropertyValue('--cool-gray-90').trim()
 export const APP_FONT_COLOR = COOL_GRAY_90
-
+export const FALLBACK_COLOR_PALETTE_V1 = 'qualitative-bold'
+export const FALLBACK_COLOR_PALETTE_V2 = 'sequential_blue'
 export const EDITOR_WIDTH = 350
+
+// Palette migration behavior flag
+export const USE_V2_MIGRATION = true // Set to true to enable v2 migration and conversion modal

package/helpers/coveUpdateWorker.ts

@@ -17,9 +17,15 @@ import update_4_25_4 from './ver/4.25.4'
 import update_4_25_6 from './ver/4.25.6'
 import update_4_25_7 from './ver/4.25.7'
 import update_4_25_8 from './ver/4.25.8'
+import update_4_25_9 from './ver/4.25.9'
+import update_4_25_10 from './ver/4.25.10'
+
+import { stripDataFromConfig, restoreDataToConfig } from './configDataHelpers'
 
 export const coveUpdateWorker = (config, multiDashboardVersion?) => {
-  let genConfig = config
+  // Strip data from config for performance
+  const { strippedConfig, extractedData } = stripDataFromConfig(config)
+  let genConfig = strippedConfig
 
   if (multiDashboardVersion) genConfig.version = multiDashboardVersion
 
@@ -36,7 +42,9 @@ export const coveUpdateWorker = (config, multiDashboardVersion?) => {
     ['4.25.4', update_4_25_4],
     ['4.25.6', update_4_25_6],
     ['4.25.7', update_4_25_7],
-    ['4.25.8', update_4_25_8]
+    ['4.25.8', update_4_25_8],
+    ['4.25.9', update_4_25_9],
+    ['4.25.10', update_4_25_10]
   ]
 
   versions.forEach(([version, updateFunction, alwaysRun]: [string, UpdateFunction, boolean?]) => {
@@ -54,7 +62,9 @@ export const coveUpdateWorker = (config, multiDashboardVersion?) => {
 
   // config version is stored at the root level of the config.
   if (multiDashboardVersion) delete genConfig.version
-  return genConfig
+
+  // Restore data arrays after all updates are complete
+  return restoreDataToConfig(genConfig, extractedData)
 }
 
 export default coveUpdateWorker

package/helpers/filterColorPalettes.ts

@@ -0,0 +1,152 @@
+import { getColorPaletteVersion } from './getColorPaletteVersion'
+import { chartColorPalettes, twoColorPalette } from '../data/colorPalettes'
+
+export interface FilterColorPalettesOptions {
+  config: any
+  isReversed?: boolean
+  colorPalettes?: any
+  visualizationType?: string
+  useV2Migration?: boolean
+}
+
+export interface FilteredPalettes {
+  sequential: string[]
+  nonSequential: string[]
+  accessibleColors: string[]
+  twoColorPalettes?: string[]
+}
+
+/**
+ * Universal color palette filtering function that works across all visualization types
+ * Combines chart and map palette filtering logic with backwards compatibility
+ */
+export const filterColorPalettes = ({
+  config,
+  isReversed,
+  colorPalettes,
+  visualizationType,
+  useV2Migration
+}: FilterColorPalettesOptions): FilteredPalettes => {
+  // Use provided colorPalettes or fall back to chart palettes
+  const palettes = colorPalettes || chartColorPalettes
+  const version = getColorPaletteVersion(config, useV2Migration)
+  const versionKey = `v${version}`
+  const currentPalettes = palettes[versionKey] || palettes.v2
+
+  // Handle two-color palettes for specific chart types
+  if (visualizationType === 'Paired Bar' || visualizationType === 'Deviation Bar') {
+    const twoColorPalettes = filterTwoColorPalettes(version, isReversed)
+    return {
+      sequential: [],
+      nonSequential: [],
+      accessibleColors: [],
+      twoColorPalettes
+    }
+  }
+
+  // Handle regular palette filtering
+  const isReversedFromConfig = isReversed !== undefined
+    ? isReversed
+    : config.general?.palette?.isReversed
+
+  return filterRegularPalettes(currentPalettes, version, isReversedFromConfig)
+}
+
+/**
+ * Filter two-color palettes (for Paired Bar and Deviation Bar charts)
+ */
+function filterTwoColorPalettes(version: number, isReversed?: boolean): string[] {
+  // Use the version to get the correct two-color palettes
+  const versionKey = `v${version}`
+  const versionedTwoColorPalettes = twoColorPalette[versionKey] || twoColorPalette.v2
+  
+  return Object.keys(versionedTwoColorPalettes).filter(name =>
+    isReversed ? name.endsWith('reverse') : !name.endsWith('reverse')
+  )
+}
+
+/**
+ * Filter regular palettes (sequential, non-sequential, accessible)
+ */
+function filterRegularPalettes(palettes: any, version: number, isReversed?: boolean): FilteredPalettes {
+  const sequential: string[] = []
+  const nonSequential: string[] = []
+  const accessibleColors: string[] = []
+
+  for (const paletteName in palettes) {
+    const isPaletteReversed = paletteName.endsWith('reverse')
+    const matchesReversed = (!isReversed && !isPaletteReversed) || (isReversed && isPaletteReversed)
+
+    if (version === 1) {
+      filterV1Palette(paletteName, matchesReversed, sequential, nonSequential, accessibleColors)
+    } else {
+      filterV2Palette(paletteName, matchesReversed, sequential, nonSequential, accessibleColors)
+    }
+  }
+
+  return { sequential, nonSequential, accessibleColors }
+}
+
+/**
+ * Filter V1 palettes using original chart logic
+ */
+function filterV1Palette(
+  paletteName: string,
+  matchesReversed: boolean,
+  sequential: string[],
+  nonSequential: string[],
+  accessibleColors: string[]
+): void {
+  if (!matchesReversed) return
+
+  if (paletteName.startsWith('sequential')) {
+    sequential.push(paletteName)
+  } else if (paletteName.startsWith('qualitative') && !paletteName.startsWith('colorblindsafe')) {
+    nonSequential.push(paletteName)
+  } else if (paletteName.startsWith('colorblindsafe') || paletteName.includes('colorblindsafe')) {
+    accessibleColors.push(paletteName)
+  }
+}
+
+/**
+ * Filter V2 palettes using updated logic for new palette structure
+ */
+function filterV2Palette(
+  paletteName: string,
+  matchesReversed: boolean,
+  sequential: string[],
+  nonSequential: string[],
+  accessibleColors: string[]
+): void {
+  if (!matchesReversed) return
+
+  if (paletteName.startsWith('sequential')) {
+    sequential.push(paletteName)
+  } else if (paletteName.startsWith('divergent')) {
+    nonSequential.push(paletteName)
+  } else if (paletteName.includes('colorblindsafe') || paletteName.startsWith('qualitative-standard')) {
+    accessibleColors.push(paletteName)
+  } else if (paletteName.startsWith('qualitative') && !paletteName.includes('colorblindsafe')) {
+    // V2 qualitative palettes go to accessible colors if they're standard
+    if (paletteName.includes('standard')) {
+      accessibleColors.push(paletteName)
+    }
+  }
+}
+
+/**
+ * Legacy function for backwards compatibility with chart package
+ */
+export const filterChartColorPalettes = (config: any) => {
+  const version = getColorPaletteVersion(config)
+
+  if (version === 1) {
+    return chartColorPalettes.v1
+  }
+
+  if (version === 2) {
+    return chartColorPalettes.v2
+  }
+
+  return chartColorPalettes.v2
+}

package/helpers/generateColorsArray.ts

@@ -0,0 +1,13 @@
+import chroma from 'chroma-js'
+
+/**
+ * Generate an array of colors based on a given color [color, hoverColor, darkColor]
+ * @param {string} color - The base color to generate the array from (defaults to black)
+ * @param {boolean} special - A flag to determine if the hover color should be brighter or saturated
+ * @returns {string[]} - An array of colors [baseColor, hoverColor, darkerColor]
+ */
+export const generateColorsArray = (color: string = '#000000', special: boolean = false): string[] => {
+  const colorObj = chroma(color)
+  const hoverColor = special ? colorObj.brighten(0.5).hex() : colorObj.saturate(1.3).hex()
+  return [color, hoverColor, colorObj.darken(0.3).hex()]
+}

package/helpers/getColorPaletteVersion.ts

@@ -0,0 +1,33 @@
+import { USE_V2_MIGRATION } from './constants'
+
+/**
+ * Gets the color palette version from a visualization config
+ * @param config - The visualization config object
+ * @param useV2Migration - If provided, overrides the global flag
+ * @returns The major version number
+ */
+export const getColorPaletteVersion = (config: any, useV2Migration?: boolean): number => {
+  // Use passed parameter or fall back to global flag
+  const shouldUseV2 = useV2Migration !== undefined ? useV2Migration : USE_V2_MIGRATION
+
+  // If not using v2 migration, force v1 unless explicitly set to v2
+  if (!shouldUseV2) {
+    if (config.general?.palette?.version) {
+      return parseInt(config.general.palette.version.split('.')[0])
+    }
+    return 1
+  }
+
+  // V2 migration logic - If general.palette exists, it's either migrated or new
+  if (config.general?.palette) {
+    // If version is explicitly set, use it
+    if (config.general.palette.version) {
+      return parseInt(config.general.palette.version.split('.')[0])
+    }
+    // If no version but palette exists, it's likely migrated → use v2
+    return 2
+  }
+
+  // If no general.palette at all, it's legacy → use v1
+  return 1
+}

package/helpers/getPaletteAccessor.ts

@@ -0,0 +1,18 @@
+import { getColorPaletteVersion } from './getColorPaletteVersion'
+
+/**
+ * Gets the appropriate palette accessor based on config version
+ * @param colorPalettes - The color palettes object (e.g., mapColorPalettes, chartColorPalettes)
+ * @param config - The visualization config object
+ * @param paletteName - Optional palette name to get specific palette
+ * @returns The versioned palette accessor or fallback to main palettes, optionally filtered to specific palette
+ */
+export const getPaletteAccessor = (colorPalettes: any, config: any, paletteName?: string) => {
+  const paletteAccessor = colorPalettes?.[`v${getColorPaletteVersion(config)}`] || colorPalettes
+
+  if (paletteName && paletteAccessor) {
+    return paletteAccessor[paletteName]
+  }
+
+  return paletteAccessor
+}

package/helpers/markupProcessor.ts

@@ -0,0 +1,205 @@
+import _ from 'lodash'
+import { MarkupVariable, MarkupCondition } from '../types/MarkupVariable'
+import { VizFilter } from '../types/VizFilter'
+import { filterVizData } from './filterVizData'
+
+/**
+ * Replaces {{variable}} tags in content with actual data values.
+ *
+ * @param content - Content string with markup variables
+ * @param data - Dataset to extract values from
+ * @param markupVariables - Variable configurations
+ * @param options - isEditor, showNoDataMessage, allowHideSection, filters
+ * @returns Processed content and state flags
+ *
+ * @security Returns plain text - must be parsed with html-react-parser before rendering
+ */
+export const processMarkupVariables = (
+  content: string,
+  data: any[] = [],
+  markupVariables: MarkupVariable[] = [],
+  options: {
+    isEditor?: boolean
+    showNoDataMessage?: boolean
+    allowHideSection?: boolean
+    filters?: VizFilter[]
+  } = {}
+): {
+  processedContent: string
+  shouldHideSection: boolean
+  shouldShowNoDataMessage: boolean
+} => {
+  const { isEditor = false, showNoDataMessage = false, allowHideSection = false, filters = [] } = options
+
+  // Early return for invalid inputs
+  if (_.isEmpty(markupVariables) || !content) {
+    return {
+      processedContent: content || '',
+      shouldHideSection: false,
+      shouldShowNoDataMessage: false
+    }
+  }
+
+  // Apply filters to data if filters are present
+  let workingData = data
+  if (filters && filters.length > 0) {
+    workingData = filterVizData(filters, data)
+  }
+
+  try {
+    const emptyVariableChecker: boolean[] = []
+    const noDataMessageChecker: boolean[] = []
+
+    const variableRegexPattern = /{{(.*?)}}/g
+    const processedContent = content.replace(variableRegexPattern, variableTag => {
+      try {
+        if (emptyVariableChecker.length > 0) return variableTag
+
+        const workingVariable = markupVariables.find(variable => variable.tag === variableTag)
+        if (!workingVariable) return variableTag
+
+        // Validate that columnName exists
+        if (!workingVariable.columnName) {
+          console.warn(`Markup variable ${variableTag} has no columnName specified`)
+          return variableTag
+        }
+
+        // Filter data with error handling (apply conditions on top of already filtered data)
+        const conditionFilteredData =
+          workingVariable.conditions.length === 0
+            ? workingData
+            : filterDataByConditions(workingData, [...workingVariable.conditions])
+
+        // Extract values with error handling
+        const variableValues: string[] = _.uniq(
+          (conditionFilteredData || []).map(dataObject => {
+            try {
+              const dataObjectValue = dataObject[workingVariable.columnName]
+
+              // Handle undefined column
+              if (dataObjectValue === undefined && isEditor) {
+                console.warn(
+                  `Column "${workingVariable.columnName}" not found in data for variable ${variableTag}`
+                )
+              }
+
+              return workingVariable.addCommas && !isNaN(parseFloat(dataObjectValue))
+                ? parseFloat(dataObjectValue).toLocaleString('en-US', { useGrouping: true })
+                : String(dataObjectValue || '')
+            } catch (error) {
+              console.error(`Error processing data value for ${variableTag}:`, error)
+              return ''
+            }
+          })
+        ).filter(value => value !== '') // Filter out empty values
+
+        const listConjunction = !isEditor ? 'and' : 'or'
+        const formattedValues = formatValuesList(variableValues, listConjunction)
+
+        const finalDisplay = formattedValues.join(', ')
+
+        if (showNoDataMessage && finalDisplay === '') {
+          noDataMessageChecker.push(true)
+        }
+
+        if (finalDisplay === '' && allowHideSection) {
+          emptyVariableChecker.push(true)
+        }
+
+        return finalDisplay
+      } catch (error) {
+        console.error(`Error processing markup variable ${variableTag}:`, error)
+        return variableTag // Return original tag on error
+      }
+    })
+
+    return {
+      processedContent,
+      shouldHideSection: allowHideSection && emptyVariableChecker.length > 0 && !isEditor,
+      shouldShowNoDataMessage: showNoDataMessage && noDataMessageChecker.length > 0 && !isEditor
+    }
+  } catch (error) {
+    console.error('Error in processMarkupVariables:', error)
+    // Return original content on error
+    return {
+      processedContent: content,
+      shouldHideSection: false,
+      shouldShowNoDataMessage: false
+    }
+  }
+}
+
+/**
+ * Filters data based on multiple conditions
+ */
+const filterDataByConditions = (data: any[], conditions: MarkupCondition[]): any[] => {
+  if (!conditions.length) return data
+
+  const [currentCondition, ...remainingConditions] = conditions
+  const { columnName, isOrIsNotEqualTo, value } = currentCondition
+
+  const filteredData = isOrIsNotEqualTo === 'is'
+    ? data.filter(dataObject => String(dataObject[columnName]) === value)
+    : data.filter(dataObject => String(dataObject[columnName]) !== value)
+
+  return remainingConditions.length === 0
+    ? filteredData
+    : filterDataByConditions(filteredData, remainingConditions)
+}
+
+/**
+ * Formats a list of values with proper conjunction
+ */
+const formatValuesList = (values: string[], conjunction: string): string[] => {
+  if (values.length === 0) return values
+  if (values.length === 1) return values
+  if (values.length === 2) {
+    return [`${values[0]} ${conjunction} ${values[1]}`]
+  }
+
+  const formatted = [...values]
+  formatted[formatted.length - 1] = `${conjunction} ${formatted[formatted.length - 1]}`
+  return [formatted.join(', ')]
+}
+
+/**
+ * Validates markup variables configuration
+ */
+export const validateMarkupVariables = (
+  markupVariables: MarkupVariable[],
+  data: any[]
+): string[] => {
+  const errors: string[] = []
+
+  if (!markupVariables || !Array.isArray(markupVariables)) {
+    return errors
+  }
+
+  const availableColumns = data.length > 0 ? Object.keys(data[0]) : []
+
+  markupVariables.forEach((variable, index) => {
+    if (!variable.tag || !variable.tag.match(/^{{.+}}$/)) {
+      errors.push(`Variable ${index + 1}: Tag must be in format {{tagName}}`)
+    }
+
+    if (!variable.columnName) {
+      errors.push(`Variable ${index + 1}: Column name is required`)
+    } else if (availableColumns.length > 0 && !availableColumns.includes(variable.columnName)) {
+      errors.push(`Variable ${index + 1}: Column "${variable.columnName}" not found in data`)
+    }
+
+    variable.conditions.forEach((condition, condIndex) => {
+      if (!condition.columnName) {
+        errors.push(`Variable ${index + 1}, Condition ${condIndex + 1}: Column name is required`)
+      } else if (availableColumns.length > 0 && !availableColumns.includes(condition.columnName)) {
+        errors.push(`Variable ${index + 1}, Condition ${condIndex + 1}: Column "${condition.columnName}" not found in data`)
+      }
+
+      if (!condition.value) {
+        errors.push(`Variable ${index + 1}, Condition ${condIndex + 1}: Value is required`)
+      }
+    })
+  })
+
+  return errors
+}