@cdc/waffle-chart 4.25.7 → 4.25.10

package/src/_stories/WaffleChart.stories.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import type { Meta, StoryObj } from '@storybook/react'
+import type { Meta, StoryObj } from '@storybook/react-vite'
 
 import WaffleChart from '../CdcWaffleChart'
 

package/src/components/EditorPanel.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect, memo, useContext } from 'react'
-
+import cloneConfig from '@cdc/core/helpers/cloneConfig'
 import _ from 'lodash'
 import ErrorBoundary from '@cdc/core/components/ErrorBoundary'
 
@@ -108,7 +108,7 @@ const EditorPanel = memo(props => {
   }
 
   const convertStateToConfig = () => {
-    let strippedState = _.cloneDeep(config)
+    let strippedState = cloneConfig(config)
     delete strippedState.newViz
     delete strippedState.runtime
 

package/src/index.jsx

@@ -2,7 +2,6 @@ import React from 'react'
 import ReactDOM from 'react-dom/client'
 
 import '@cdc/core/styles/cove-main.scss'
-import './coreStyles_wafflechart.scss'
 
 import CdcWaffleChart from './CdcWaffleChart'
 
@@ -12,6 +11,10 @@ let domContainer = document.getElementsByClassName('react-container')[0]
 
 ReactDOM.createRoot(domContainer).render(
   <React.StrictMode>
-    <CdcWaffleChart configUrl={domContainer.attributes['data-config'].value} isEditor={isEditor} />
+    <CdcWaffleChart
+      configUrl={domContainer.attributes['data-config'].value}
+      interactionLabel={domContainer.attributes['data-config'].value}
+      isEditor={isEditor}
+    />
   </React.StrictMode>
 )

package/src/test/CdcWaffleChart.test.jsx

@@ -1,6 +1,11 @@
-// Placeholder test until we add them in.
+import path from 'path'
+import { testStandaloneBuild } from '@cdc/core/helpers/tests/testStandaloneBuild.ts'
+import { describe, it, expect } from 'vitest'
+
 describe('Waffle Chart', () => {
-  it('has a test.', async () => {
-    return true
+  it('Can be built in isolation', async () => {
+    const pkgDir = path.join(__dirname, '..')
+    const result = testStandaloneBuild(pkgDir)
+    expect(result).toBe(true)
   })
 })

package/tests/fixtures/example-data.json

@@ -0,0 +1,50 @@
+[
+  {
+    "Deaths": "250",
+    "Total Overdoses": "600",
+    "state": "Alabama",
+    "Year": "2010"
+  },
+  {
+    "Deaths": "16",
+    "Total Overdoses": "80",
+    "state": "Alaska",
+    "Year": "2008"
+  },
+  {
+    "Deaths": "19",
+    "Total Overdoses": "100",
+    "state": "Alaska",
+    "Year": "2010"
+  },
+  {
+    "Deaths": "93",
+    "Total Overdoses": "400",
+    "state": "Alaska",
+    "Year": "2012"
+  },
+  {
+    "Deaths": "82",
+    "Total Overdoses": "400",
+    "state": "Arizona",
+    "Year": "2010"
+  },
+  {
+    "Deaths": "150",
+    "Total Overdoses": "350",
+    "state": "California",
+    "Year": "2010"
+  },
+  {
+    "Deaths": "45",
+    "Total Overdoses": "120",
+    "state": "Colorado",
+    "Year": "2010"
+  },
+  {
+    "Deaths": "33",
+    "Total Overdoses": "85",
+    "state": "Connecticut",
+    "Year": "2010"
+  }
+]

package/tests/fixtures/test-config.json

@@ -0,0 +1,41 @@
+{
+  "type": "waffle-chart",
+  "dataUrl": "/packages/waffle-chart/tests/fixtures/example-data.json",
+  "shape": "person",
+  "title": "Test Waffle Chart Title",
+  "showTitle": true,
+  "content": "of overdoses resulted in death.",
+  "subtext": "This test data is for E2E testing",
+  "orientation": "horizontal",
+  "filters": [],
+  "fontSize": null,
+  "overallFontSize": "medium",
+  "dataColumn": "Deaths",
+  "dataFunction": "Sum",
+  "dataConditionalColumn": "",
+  "dataConditionalOperator": null,
+  "dataConditionalComparate": "",
+  "customDenom": true,
+  "dataDenom": null,
+  "dataDenomColumn": "Total Overdoses",
+  "dataDenomFunction": "Sum",
+  "prefix": "",
+  "suffix": "%",
+  "roundToPlace": 0,
+  "nodeWidth": 10,
+  "nodeSpacer": 2,
+  "theme": "theme-blue",
+  "visualizationType": "Waffle",
+  "visualizationSubType": "",
+  "invalidComparate": false,
+  "showDenominator": false,
+  "showPercent": true,
+  "valueDescription": "testing",
+  "visual": {
+    "border": true,
+    "accent": true,
+    "background": true,
+    "hideBackgroundColor": false,
+    "borderColorTheme": true
+  }
+}

package/vite.config.js

@@ -1,4 +1,4 @@
-import GenerateViteConfig from '../../generateViteConfig.js'
+import GenerateViteConfig from '@cdc/core/generateViteConfig.js'
 import { moduleName } from './package.json'
 
 export default GenerateViteConfig(moduleName)

package/src/coreStyles_wafflechart.scss

@@ -1,3 +0,0 @@
-@import '@cdc/core/styles/base';
-@import '@cdc/core/styles/heading-colors';
-@import '@cdc/core/styles/v2/themes/color-definitions';