Charts: Adding build option (#40676)

* Charts: Adding build option

* changelog

projects/js-packages/charts/changelog/add-charts-build

@@ -0,0 +1,4 @@
+Significance: patch
+Type: added
+
+Adding build option for Charts.

projects/js-packages/charts/composer.json

@@ -13,6 +13,12 @@
 		]
 	},
 	"scripts": {
+		"build-development": [
+			"pnpm run build"
+		],
+		"build-production": [
+			"NODE_ENV=production pnpm run build"
+		],
 		"test-coverage": [
 			"pnpm run test-coverage"
 		],

projects/js-packages/charts/index.ts

@@ -0,0 +1,19 @@
+// Charts
+export { BarChart } from './src/components/bar-chart';
+export { LineChart } from './src/components/line-chart';
+export { PieChart } from './src/components/pie-chart';
+export { PieSemiCircleChart } from './src/components/pie-semi-circle-chart';
+
+// Chart components
+export { BaseTooltip } from './src/components/tooltip';
+export { Legend } from './src/components/legend';
+
+// Providers
+export { ThemeProvider } from './src/providers/theme';
+
+// Hooks
+export { default as useChartMouseHandler } from './src/hooks/use-chart-mouse-handler';
+
+// Types
+export type * from './src/components/shared/types';
+export type { BaseTooltipProps } from './src/components/tooltip';

projects/js-packages/charts/package.json

@@ -17,7 +17,10 @@
 		"clean": "rm -rf node_modules",
 		"test": "jest --config=tests/jest.config.cjs",
 		"test-coverage": "pnpm run test --coverage",
-		"storybook": "cd ../storybook && pnpm run storybook:dev"
+		"storybook": "cd ../storybook && pnpm run storybook:dev",
+		"compile-ts": "tsc --pretty",
+		"build": "pnpm run clean-build && pnpm run compile-ts",
+		"clean-build": "rm -rf build/"
 	},
 	"dependencies": {
 		"@react-spring/web": "9.7.3",

projects/js-packages/charts/src/components/bar-chart/index.tsx

@@ -1 +1 @@
-export { default } from './bar-chart';
+export { default as BarChart } from './bar-chart';

projects/js-packages/charts/src/components/bar-chart/stories/index.stories.tsx

@@ -1,4 +1,4 @@
-import BarChart from '../index';
+import { BarChart } from '../index';
 import data from './sample-data';
 import type { Meta, StoryObj } from '@storybook/react';
 

projects/js-packages/charts/src/index.ts

@@ -1,16 +1,18 @@
 // Charts
-export { default as BarChart } from './components/bar-chart';
+export { BarChart } from './components/bar-chart';
 export { LineChart } from './components/line-chart';
 export { PieChart } from './components/pie-chart';
 export { PieSemiCircleChart } from './components/pie-semi-circle-chart';
 
 // Chart components
 export { BaseTooltip } from './components/tooltip';
+export { Legend } from './components/legend';
 
 // Providers
 export { ThemeProvider } from './providers/theme';
 
 // Hooks
+export { default as useChartMouseHandler } from './hooks/use-chart-mouse-handler';
 
 // Types
 export type * from './components/shared/types';

projects/js-packages/charts/src/providers/theme/stories/index.stories.tsx

@@ -1,6 +1,6 @@
 import { Meta, StoryObj } from '@storybook/react';
 import { ThemeProvider, jetpackTheme, wooTheme } from '../.';
-import { LineChart, BarChart, PieSemiCircleChart } from '../../..';
+import { LineChart, BarChart, PieSemiCircleChart } from '../../../.';
 import barSampleData from '../../../components/bar-chart/stories/sample-data';
 
 const meta: Meta< typeof LineChart > = {

projects/js-packages/charts/tsconfig.json

@@ -5,5 +5,5 @@
 		"outDir": "./build/"
 	},
 	// List all sources and source-containing subdirs.
-	"include": [ "./src" ]
+	"include": [ "./index.ts", "./src" ]
 }