feat: 更新默认配置

antvis · Dec 7, 2023 · 2d5522a · 2d5522a
1 parent ba0b9d3
commit 2d5522a
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 204 deletions.
diff --git a/packages/s2-react/playground/components/ChartSheet.tsx b/packages/s2-react/playground/components/ChartSheet.tsx
@@ -18,7 +18,7 @@ const options: SheetComponentOptions = {
     brushSelection: {
       rowCell: true,
       colCell: true,
-      dataCell: true,
+      dataCell: false,
     },
     selectedCellMove: true,
     selectedCellHighlight: true,
@@ -32,18 +32,7 @@ const options: SheetComponentOptions = {
 };
 
 const theme: ThemeCfg['theme'] = {
-  dataCell: {
-    cell: {
-      interactionState: {
-        hoverFocus: {
-          borderOpacity: 0,
-        },
-        selected: {
-          borderOpacity: 0,
-        },
-      },
-    },
-  },
+  dataCell: {},
 };
 
 const onDataCellRender: SheetComponentsProps['onDataCellRender'] = (cell) => {

diff --git a/packages/s2-react/src/components/sheets/chart-sheet/index.tsx b/packages/s2-react/src/components/sheets/chart-sheet/index.tsx
@@ -1,19 +1,27 @@
-import { customMerge } from '@antv/s2';
+import { customMerge, type ThemeCfg } from '@antv/s2';
 import React from 'react';
 import { BaseSheet } from '../base-sheet';
 import type { SheetComponentOptions, SheetComponentsProps } from '../interface';
 import { ChartSheetDataCell } from './custom-cell';
 
 export const ChartSheet: React.FC<SheetComponentsProps> = React.memo(
   (props) => {
-    const { options: defaultOptions, ...restProps } = props;
+    const {
+      options: defaultOptions,
+      themeCfg: defaultThemeCfg,
+      ...restProps
+    } = props;
+
     const s2Options = React.useMemo<SheetComponentOptions>(() => {
       const options: SheetComponentOptions = {
         dataCell: (viewMeta) =>
           new ChartSheetDataCell(viewMeta, viewMeta.spreadsheet),
         showDefaultHeaderActionIcon: false,
         interaction: {
           hoverFocus: false,
+          brushSelection: {
+            dataCell: false,
+          },
         },
         style: {
           colCell: {
@@ -35,7 +43,28 @@ export const ChartSheet: React.FC<SheetComponentsProps> = React.memo(
       return customMerge<SheetComponentOptions>(defaultOptions, options);
     }, [defaultOptions]);
 
-    return <BaseSheet {...restProps} options={s2Options} />;
+    const themeCfg = React.useMemo<ThemeCfg>(() => {
+      const theme: ThemeCfg['theme'] = {
+        dataCell: {
+          cell: {
+            interactionState: {
+              hoverFocus: {
+                borderOpacity: 0,
+              },
+              selected: {
+                borderOpacity: 0,
+              },
+            },
+          },
+        },
+      };
+
+      return customMerge<ThemeCfg>(defaultThemeCfg, {
+        theme,
+      });
+    }, [defaultThemeCfg]);
+
+    return <BaseSheet {...restProps} options={s2Options} themeCfg={themeCfg} />;
   },
 );