fix(example): fix handleScale operating on wrong argument in various …

…storybook stories
sonnen · Dec 13, 2021 · 9fe99a7 · 9fe99a7
1 parent 73382f6
commit 9fe99a7
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 17 deletions.
diff --git a/packages/example/src/stories/AreaChart/AreaChart.zoom.story.tsx b/packages/example/src/stories/AreaChart/AreaChart.zoom.story.tsx
@@ -1,18 +1,18 @@
-import { AxisOrientation, GridLines, DataContainerTransformExtension } from '@kanva/charts';
+import { AxisOrientation, GridLines, DataContainerTransformExtension, SimpleOnScaleListenerArgs } from '@kanva/charts';
 import * as React from 'react';
 import { Kanva } from '@kanva/react';
-import { 
+import {
   AreaChartView as AreaChartViewComponent,
   AxisView,
   ChartGridView,
   ChartZoomView,
 } from '@kanva/charts-react';
+import { Paint, Rect, rgba } from '@kanva/core';
 import { boolean } from '@storybook/addon-knobs';
 import zoomAreaChartNotes from './AreaChart.zoom.notes.md';
 import { layout, Views } from './AreaChart.layouts';
 import { createDataContainer } from './AreaChart.dataContainer';
 import { styles } from './AreaChart.styles';
-import { Paint, Rect, rgba } from '@kanva/core';
 
 export { zoomAreaChartNotes };
 
@@ -21,7 +21,7 @@ export const zoomAreaChartStory = () => {
   const debug = boolean('Debug', false);
   const baseTickCount = 9;
 
-  const handleScale = (scaleX: number) => {
+  const handleScale = ({ scaleX }: SimpleOnScaleListenerArgs) => {
     const newScale = Math.floor(Math.log2(scaleX));
 
     const axisParams = dataContainer.getXAxisParameters();
@@ -75,7 +75,7 @@ export const zoomAreaChartStory = () => {
               />
             ))
             }
-            <ChartZoomView 
+            <ChartZoomView
               dataContainer={dataContainer}
               layoutParams={layout.areaChart}
               style={{

diff --git a/packages/example/src/stories/AreaLineChart/AreaLineChart.zoom.story.tsx b/packages/example/src/stories/AreaLineChart/AreaLineChart.zoom.story.tsx
@@ -1,18 +1,18 @@
-import { AxisOrientation, GridLines, DataContainerTransformExtension } from '@kanva/charts';
+import { AxisOrientation, GridLines, DataContainerTransformExtension, SimpleOnScaleListenerArgs } from '@kanva/charts';
 import * as React from 'react';
 import { Kanva } from '@kanva/react';
-import { 
+import {
   AreaChartView as AreaChartViewComponent,
   AxisView,
   ChartGridView,
   ChartZoomView,
 } from '@kanva/charts-react';
+import { Paint, Rect, rgba } from '@kanva/core';
 import { boolean } from '@storybook/addon-knobs';
 import zoomAreaChartNotes from './AreaLineChart.zoom.notes.md';
 import { layout, Views } from './AreaLineChart.layouts';
 import { createDataContainer } from './AreaLineChart.dataContainer';
 import { styles } from './AreaLineChart.styles';
-import { Paint, Rect, rgba } from '@kanva/core';
 
 export { zoomAreaChartNotes };
 
@@ -21,7 +21,7 @@ export const zoomAreaChartStory = () => {
   const debug = boolean('Debug', false);
   const baseTickCount = 9;
 
-  const handleScale = (scaleX: number) => {
+  const handleScale = ({ scaleX }: SimpleOnScaleListenerArgs) => {
     const newScale = Math.floor(Math.log2(scaleX));
 
     const axisParams = dataContainer.getXAxisParameters();
@@ -75,7 +75,7 @@ export const zoomAreaChartStory = () => {
               />
             ))
             }
-            <ChartZoomView 
+            <ChartZoomView
               dataContainer={dataContainer}
               layoutParams={layout.areaChart}
               style={{

diff --git a/packages/example/src/stories/LineChart/LineChart.simple.story.tsx b/packages/example/src/stories/LineChart/LineChart.simple.story.tsx
@@ -2,16 +2,17 @@ import * as React from 'react';
 import { Kanva } from '@kanva/react';
 import { LineChartView as LineChartViewComponent, AxisView } from '@kanva/charts-react';
 import { boolean } from '@storybook/addon-knobs';
-import simpleLineChartNotes from './LineChart.simple.notes.md';
-import { layout, Views } from './LineChart.layouts';
-import { MOCK } from './LineChart.mock'
 import {
   LineChartViewStyle,
   DataContainer,
   AxisOrientation,
-  DataContainerTransformExtension
+  DataContainerTransformExtension,
+  SimpleOnScaleListenerArgs,
 } from '@kanva/charts';
 import { Paint } from '@kanva/core';
+import simpleLineChartNotes from './LineChart.simple.notes.md';
+import { layout, Views } from './LineChart.layouts';
+import { MOCK } from './LineChart.mock'
 import { styles } from './LineChart.styles';
 
 export { simpleLineChartNotes };
@@ -38,12 +39,12 @@ const lineChartStyle: LineChartViewStyle = {
   minChunkLength: {
     domain: .1,
     px: 1,
-  }
+  },
 };
 
 const baseTickCount = 9;
 
-const handleScale = (scaleX: number) => {
+const handleScale = ({ scaleX }: SimpleOnScaleListenerArgs) => {
   const newScale = Math.floor(Math.log2(scaleX));
 
   const axisParams = dataContainer.getXAxisParameters();
@@ -63,7 +64,7 @@ const transformExtension = new DataContainerTransformExtension({
 const dataContainer = new DataContainer()
 .setData([{
   name: Series.HEATER_POWER,
-  data: MOCK.consumptionPower.map(({ x, y }: {x: number, y: number }) => ({ x, y: y > 3000 ? 1 : 0 })),
+  data: MOCK.consumptionPower.map(({ x, y }: { x: number; y: number }) => ({ x, y: y > 3000 ? 1 : 0 })),
 }])
 .setXAxisParameters({
   tickCount: baseTickCount,