@cdc/chart 4.26.2 → 4.26.3

package/examples/data/data-with-metadata.json

@@ -0,0 +1,10 @@
+{
+  "lastUpdated": "January 15, 2026",
+  "source": "CDC NREVSS",
+  "data": [
+    { "STATE": "AL", "Rate": "10", "Location": "Home" },
+    { "STATE": "AK", "Rate": "12", "Location": "Home" },
+    { "STATE": "FL", "Rate": "10", "Location": "Work" },
+    { "STATE": "GA", "Rate": "12", "Location": "Work" }
+  ]
+}

package/examples/feature/pie/planet-pie-example-config.json

@@ -70,7 +70,8 @@
     "hide": false
   },
   "table": {
+    "showDownloadImgButton": true,
     "label": "Data Table",
     "expanded": false
   }
-}
+}

package/examples/metadata-variables.json

@@ -0,0 +1,58 @@
+{
+  "type": "chart",
+  "title": "Rates by State",
+  "showTitle": true,
+  "theme": "theme-blue",
+  "visualizationType": "Bar",
+  "visualizationSubType": "regular",
+  "orientation": "vertical",
+  "dataUrl": "/examples/data/data-with-metadata.json",
+  "enableMarkupVariables": true,
+  "markupVariables": [
+    {
+      "name": "Last Updated",
+      "tag": "{{lastUpdated}}",
+      "metadataKey": "lastUpdated",
+      "conditions": []
+    },
+    {
+      "name": "Source",
+      "tag": "{{source}}",
+      "metadataKey": "source",
+      "conditions": []
+    }
+  ],
+  "description": "Data last updated {{lastUpdated}}. Source: {{source}}.",
+  "xAxis": {
+    "dataKey": "STATE",
+    "label": "State"
+  },
+  "yAxis": {
+    "label": "Rate"
+  },
+  "series": [
+    {
+      "dataKey": "Rate",
+      "type": "Bar",
+      "tooltip": true
+    }
+  ],
+  "table": {
+    "show": true,
+    "label": "Data Table"
+  },
+  "general": {
+    "showDownloadButton": false
+  },
+  "visual": {
+    "border": true,
+    "accent": true,
+    "background": true
+  },
+  "palette": "qualitative3",
+  "dataFormat": {
+    "commas": false,
+    "prefix": "",
+    "suffix": ""
+  }
+}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@cdc/chart",
-  "version": "4.26.2",
+  "version": "4.26.3",
   "description": "React component for visualizing tabular data in various types of charts",
   "license": "Apache-2.0",
   "author": "Matthew Pallansch <mpallansch@adittech.com>",
   "bugs": "https://github.com/CDCgov/cdc-open-viz/issues",
   "dependencies": {
-    "@cdc/core": "^4.26.2",
+    "@cdc/core": "^4.26.3",
     "@hello-pangea/dnd": "^16.2.0",
     "@react-spring/web": "^9.7.5",
     "@rollup/plugin-dsv": "^3.0.2",
@@ -56,7 +56,7 @@
     "@types/d3-sankey": "^0.12.4",
     "@types/d3-time-format": "^4.0.3"
   },
-  "gitHead": "be3413e8e1149abf94225108f86a7910f56e0616",
+  "gitHead": "d50e45a074fbefa56cac904917e707d57f237737",
   "main": "dist/cdcchart",
   "moduleName": "CdcChart",
   "peerDependencies": {

package/src/CdcChart.tsx

@@ -5,6 +5,7 @@ import { getFileExtension } from '@cdc/core/helpers/getFileExtension'
 import { isSolrCsv, isSolrJson } from '@cdc/core/helpers/isSolr'
 import { parseCsvWithQuotes } from '@cdc/core/helpers/parseCsvWithQuotes'
 import cacheBustingString from '@cdc/core/helpers/cacheBustingString'
+import { extractDataAndMetadata } from '@cdc/core/helpers/extractDataAndMetadata'
 import Loading from '@cdc/core/components/Loading'
 import _ from 'lodash'
 import EditorContext from '@cdc/core/contexts/EditorContext'
@@ -60,11 +61,12 @@ const CdcChartWrapper: React.FC<CdcChartProps> = ({
 
       const finalUrl = `${dataUrl.origin}${dataUrl.pathname}${new URLSearchParams(qsParams)}`
       const ext = getFileExtension(finalUrl)
-      const data = await fetchAndParseData(finalUrl, ext)
+      const { data, dataMetadata } = await fetchAndParseData(finalUrl, ext)
 
       setConfig(prev => ({
         ...prev,
         data: { ...data, urlFiltered: true },
+        dataMetadata,
         runtimeDataUrl: finalUrl,
         formattedData: { ...data, urlFiltered: true }
       }))
@@ -113,12 +115,14 @@ const fetchAndParseData = async (url: string, ext: string) => {
     const response = await fetch(url)
     if (ext === 'csv' || isSolrCsv(url)) {
       const responseText = await response.text()
-      return parseCsv(responseText)
+      return { data: parseCsv(responseText), dataMetadata: {} }
     } else if (ext === 'json' || isSolrJson(url)) {
-      return await response.json()
+      const json = await response.json()
+      return extractDataAndMetadata(json)
     }
   } catch (error) {
     console.error(`Error parsing URL: ${url}`, error)
-    return []
+    return { data: [], dataMetadata: {} }
   }
+  return { data: [], dataMetadata: {} }
 }