chore: add selected in treemap record item (#2084)

Co-authored-by: ian.lxl <ian.lxl@antgroup.com>

Author: huaxiabuluo

packages/f2/src/components/treemap/withTreemap.tsx

@@ -89,21 +89,14 @@ const withTreemap = <IProps extends TreemapProps = TreemapProps>(View: Component
       return false;
     }
 
-    getSelectionStyle(record) {
-      const { state, props } = this;
-      const { selected } = state;
-      if (!selected || !selected.length) {
+    generateSelectionStyle(record: Record<string, unknown>, isSelected: boolean) {
+      if (!this.state.selected?.length) {
         return null;
       }
-      const { selection } = props;
-      const { selectedStyle, unSelectedStyle } = selection;
 
-      const isSelected = this.isSelected(record);
-
-      if (isSelected) {
-        return isFunction(selectedStyle) ? selectedStyle(record) : selectedStyle;
-      }
-      return isFunction(unSelectedStyle) ? unSelectedStyle(record) : unSelectedStyle;
+      const { selectedStyle, unSelectedStyle } = this.props.selection || {};
+      const style = isSelected ? selectedStyle : unSelectedStyle;
+      return isFunction(style) ? style(record) : style;
     }
 
     willMount() {
@@ -162,14 +155,16 @@ const withTreemap = <IProps extends TreemapProps = TreemapProps>(View: Component
           yMax: y1,
         };
 
-        const style = this.getSelectionStyle(data);
+        const selected = this.isSelected(data);
+        const style = this.generateSelectionStyle(data, selected);
 
         return {
           key: data.key,
           origin: data,
           color,
           ...rect,
           style,
+          selected,
         };
       });
     }

packages/f2/test/components/treemap/index.test.tsx

@@ -112,9 +112,11 @@ describe('Treemap', () => {
     canvas.destroy();
   });
   it('select ', async () => {
+    const treemapRef = { current: null };
     const { props } = (
       <Canvas context={context} pixelRatio={1}>
         <Treemap
+          ref={treemapRef}
           data={data}
           color={{
             field: 'name',
@@ -147,10 +149,12 @@ describe('Treemap', () => {
 
     await delay(1000);
     expect(context).toMatchImageSnapshot();
+    expect(treemapRef.current?.records[0]?.selected).toBe(true);
 
     const { props: nextProps } = (
       <Canvas context={context} pixelRatio={1}>
         <Treemap
+          ref={treemapRef}
           data={data}
           color={{
             field: 'name',
@@ -181,6 +185,7 @@ describe('Treemap', () => {
     canvas.update(nextProps);
     await delay(1000);
     expect(context).toMatchImageSnapshot();
+    expect(treemapRef.current?.records[2]?.selected).toBe(true);
     await delay(100);
     canvas.destroy();
   });