fix: calendar component optimization

packages/core/client/src/schema-component/antd/calendar/Calendar.tsx

@@ -1,13 +1,13 @@
 import { LeftOutlined, RightOutlined } from '@ant-design/icons';
 import { createForm } from '@formily/core';
 import { observer, RecursionField, Schema, useFieldSchema } from '@formily/react';
+import { parseExpression } from 'cron-parser';
 import get from 'lodash/get';
 import moment from 'moment';
 import React, { useMemo, useState } from 'react';
 import { Calendar as BigCalendar, momentLocalizer } from 'react-big-calendar';
 import * as dates from 'react-big-calendar/lib/utils/dates';
 import { useTranslation } from 'react-i18next';
-import { parseExpression } from 'cron-parser';
 import { RecordProvider } from '../../../';
 import { i18n } from '../../../i18n';
 import { useProps } from '../../hooks/useProps';
@@ -187,6 +187,18 @@ export const Calendar: any = observer((props: any) => {
   const [visible, setVisible] = useState(false);
   const [record, setRecord] = useState<any>({});
 
+  const components = useMemo(() => {
+    return {
+      toolbar: (props) => <Toolbar {...props} showLunar={showLunar}></Toolbar>,
+      week: {
+        header: (props) => <Header {...props} type="week" showLunar={showLunar}></Header>,
+      },
+      month: {
+        dateHeader: (props) => <Header {...props} showLunar={showLunar}></Header>,
+      },
+    };
+  }, [showLunar]);
+
   return (
     <div style={{ height: 700 }}>
       <CalendarRecordViewer visible={visible} setVisible={setVisible} record={record} />
@@ -228,15 +240,7 @@ export const Calendar: any = observer((props: any) => {
             return `${local.format(start, 'Y-M', culture)} - ${local.format(end, 'Y-M', culture)}`;
           },
         }}
-        components={{
-          toolbar: (props) => <Toolbar {...props} showLunar={showLunar}></Toolbar>,
-          week: {
-            header: (props) => <Header {...props} type="week" showLunar={showLunar}></Header>,
-          },
-          month: {
-            dateHeader: (props) => <Header {...props} showLunar={showLunar}></Header>,
-          },
-        }}
+        components={components}
         localizer={localizer}
       />
     </div>

packages/core/client/src/schema-component/antd/calendar/Title.tsx

@@ -1,7 +1,5 @@
 import { observer } from '@formily/react';
-import moment from 'moment';
 import React, { useContext, useMemo } from 'react';
-import solarLunar from 'solarlunar-es';
 import { useDesignable } from '../../hooks';
 import { CalendarToolbarContext } from './context';
 import { getLunarDay } from './utils';