Import SDK charts

canvas · Aug 8, 2024 · ebc7c07 · ebc7c07
1 parent 17b5eba
commit ebc7c07
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 7 deletions.
diff --git a/react/package-lock.json b/react/package-lock.json
diff --git a/react/package.json b/react/package.json
@@ -78,6 +78,7 @@
         "webpack-dev-server": "^4.15.1"
     },
     "dependencies": {
+        "@canvas-sdk/charts": "^0.5.3",
         "@headlessui/react": "^2.0.4",
         "chroma-js": "^2.4.2",
         "dompurify": "^3.1.0",

diff --git a/react/src/SvgChart.tsx b/react/src/SvgChart.tsx
@@ -2,12 +2,9 @@ import React, { ReactElement, RefObject, useEffect, useLayoutEffect, useRef, use
 import { ChartData } from 'src/__rust_generated__/ChartData';
 import { HorizontalXAxis, HorizontalYAxis, XAxis, YAxis } from 'src/charts/Axis';
 import { HorizontalGrid } from 'src/charts/HorizontalGrid';
-import { LineChart } from 'src/charts/LineChart';
+import { LineChart } from '@canvas-sdk/charts';
+import { categoricalScale, dateTimeScale, linearScale, logarithmicScale } from '@canvas-sdk/charts/scale';
 import { VerticalBarChart } from 'src/charts/VerticalBarChart';
-import { categoricalScale } from 'src/charts/scale/categorical';
-import { dateTimeScale } from 'src/charts/scale/datetime';
-import { linearScale } from 'src/charts/scale/linear';
-import { logarithmicScale } from 'src/charts/scale/logarithmic';
 import { parseDateTimeNtz } from 'src/util/DateUtil';
 import { DateTime } from 'luxon';
 import { ChartTheme } from './ChartTheme';

diff --git a/react/src/charts/HorizontalGrid.tsx b/react/src/charts/HorizontalGrid.tsx
@@ -23,7 +23,7 @@ export function HorizontalGrid({
                         x2={xEnd}
                         y1={y}
                         y2={y}
-                        className={point === 0 ? 'stroke-default' : 'stroke-divider'}
+                        className={point === 0 ? 'stroke-default' : 'stroke-[var(--chart-grid,#E3E3E5)]'}
                     />
                 );
             })}

diff --git a/react/src/charts/VerticalGrid.tsx b/react/src/charts/VerticalGrid.tsx
@@ -23,7 +23,7 @@ export function VerticalGrid({
                         y2={yEnd}
                         x1={x}
                         x2={x}
-                        className={point === 0 ? 'stroke-default' : 'stroke-divider'}
+                        className={point === 0 ? 'stroke-default' : 'stroke-[var(--chart-grid,#E3E3E5)]'}
                     />
                 );
             })}