diff --git a/AccountCenter/src/components/Applications/index.tsx b/AccountCenter/src/components/Applications/index.tsx index 5c3b8984..f3763196 100644 --- a/AccountCenter/src/components/Applications/index.tsx +++ b/AccountCenter/src/components/Applications/index.tsx @@ -104,7 +104,7 @@ const Applications: React.FC = () => { , - + , ]} diff --git a/AccountCenter/src/components/ArticleListContent/index.tsx b/AccountCenter/src/components/ArticleListContent/index.tsx index 94303c14..fbd8b68a 100644 --- a/AccountCenter/src/components/ArticleListContent/index.tsx +++ b/AccountCenter/src/components/ArticleListContent/index.tsx @@ -17,7 +17,7 @@ const ArticleListContent: React.FC = ({ }) => { const { styles } = useStyles(); return ( -
+
{content}
diff --git a/AccountCenter/src/components/Articles/index.style.ts b/AccountCenter/src/components/Articles/index.style.ts index cd087f1e..5a9d385f 100644 --- a/AccountCenter/src/components/Articles/index.style.ts +++ b/AccountCenter/src/components/Articles/index.style.ts @@ -5,7 +5,7 @@ const useStyles = createStyles(({ token }) => { articleList: { '.ant-list-item:first-child': { paddingTop: '0' }, }, - 'a.listItemMetaTitle': { + listItemMetaTitle: { color: token.colorTextHeading, }, }; diff --git a/AccountCenter/src/index.tsx b/AccountCenter/src/index.tsx index 0aac5f18..6ae61e99 100644 --- a/AccountCenter/src/index.tsx +++ b/AccountCenter/src/index.tsx @@ -1,5 +1,5 @@ import { PlusOutlined, HomeOutlined, ContactsOutlined, ClusterOutlined } from '@ant-design/icons'; -import { Avatar, Card, Col, Divider, Input, Row, Tag } from 'antd'; +import { Avatar, Card, Col, Divider, Input, Row, Tag, InputRef } from 'antd'; import React, { useState, useRef } from 'react'; import { GridContent } from '@ant-design/pro-components'; import { Link, useRequest } from '@umijs/max'; @@ -40,7 +40,7 @@ const operationTabList = [ const TagList: React.FC<{ tags: CurrentUser['tags'] }> = ({ tags }) => { const { styles } = useStyles(); - const ref = useRef(null); + const ref = useRef(null); const [newTags, setNewTags] = useState([]); const [inputVisible, setInputVisible] = useState(false); const [inputValue, setInputValue] = useState(''); diff --git a/AccountSettings/src/components/base.tsx b/AccountSettings/src/components/base.tsx index 396655d2..fab0f44b 100644 --- a/AccountSettings/src/components/base.tsx +++ b/AccountSettings/src/components/base.tsx @@ -157,7 +157,6 @@ const BaseView: React.FC = () => { labelInValue: true, }} name="province" - className={styles.item} request={async () => { return queryProvince().then(({ data }) => { return data.map((item) => { @@ -186,7 +185,6 @@ const BaseView: React.FC = () => { }, ]} disabled={!province} - className={styles.item} request={async () => { if (!province?.key) { return []; diff --git a/DashboardAnalysis/src/_mock.ts b/DashboardAnalysis/src/_mock.ts index e811c588..a23f8345 100644 --- a/DashboardAnalysis/src/_mock.ts +++ b/DashboardAnalysis/src/_mock.ts @@ -175,7 +175,7 @@ const radarTitleMap = { hot: '热度', }; radarOriginData.forEach((item) => { - Object.keys(item).forEach((key) => { + (Object.keys(item) as Array).forEach((key) => { if (key !== 'name') { radarData.push({ name: item.name, diff --git a/DashboardAnalysis/src/components/Charts/Bar/index.tsx b/DashboardAnalysis/src/components/Charts/Bar/index.tsx index 3712a8f4..7985cf63 100644 --- a/DashboardAnalysis/src/components/Charts/Bar/index.tsx +++ b/DashboardAnalysis/src/components/Charts/Bar/index.tsx @@ -3,7 +3,7 @@ import React, { Component } from 'react'; import Debounce from 'lodash.debounce'; import autoHeight from '../autoHeight'; -import styles from '../index.less'; +// import styles from '../index.less'; export type BarProps = { title: React.ReactNode; @@ -104,7 +104,7 @@ class Bar extends Component< ]; return ( -
+
{title &&

{title}

} = ({ strokeWidth, percent, }) => { - const { styles } = useStyles(); + const { styles } = /* useStyles(); */ { styles: {} as any }; return (
diff --git a/DashboardAnalysis/src/components/Charts/Pie/index.tsx b/DashboardAnalysis/src/components/Charts/Pie/index.tsx index ae33cc3f..38c40971 100644 --- a/DashboardAnalysis/src/components/Charts/Pie/index.tsx +++ b/DashboardAnalysis/src/components/Charts/Pie/index.tsx @@ -7,7 +7,8 @@ import { Divider } from 'antd'; import ReactFitText from 'react-fittext'; import classNames from 'classnames'; import autoHeight from '../autoHeight'; -import styles from './index.less'; +// import styles from './index.less'; +const styles = {} as any; export type PieProps = { animate?: boolean; @@ -141,7 +142,7 @@ class Pie extends Component { newItem.checked = !newItem.checked; const { legendData } = this.state; - legendData[i] = newItem; + legendData[Number(i)] = newItem; const filteredLegendData = legendData.filter((l) => l.checked).map((l) => l.x); diff --git a/DashboardAnalysis/src/components/Charts/TagCloud/index.tsx b/DashboardAnalysis/src/components/Charts/TagCloud/index.tsx index 56e8df47..b601e31a 100644 --- a/DashboardAnalysis/src/components/Charts/TagCloud/index.tsx +++ b/DashboardAnalysis/src/components/Charts/TagCloud/index.tsx @@ -5,7 +5,8 @@ import DataSet from '@antv/data-set'; import Debounce from 'lodash.debounce'; import classNames from 'classnames'; import autoHeight from '../autoHeight'; -import styles from './index.less'; +// import styles from './index.less'; +const styles: any = {}; /* eslint no-underscore-dangle: 0 */ /* eslint no-param-reassign: 0 */ diff --git a/DashboardAnalysis/src/components/Charts/TimelineChart/index.tsx b/DashboardAnalysis/src/components/Charts/TimelineChart/index.tsx index 06f39921..bab49d0c 100644 --- a/DashboardAnalysis/src/components/Charts/TimelineChart/index.tsx +++ b/DashboardAnalysis/src/components/Charts/TimelineChart/index.tsx @@ -4,7 +4,7 @@ import DataSet from '@antv/data-set'; import React from 'react'; import Slider from 'bizcharts-plugin-slider'; import autoHeight from '../autoHeight'; -import useStyles from './index.style'; +// import useStyles from './index.style'; export type TimelineChartProps = { data: { @@ -21,7 +21,7 @@ export type TimelineChartProps = { }; const TimelineChart: React.FC = (props) => { - const { styles } = useStyles(); + const { styles } = /* useStyles(); */ { styles: {} as any }; const { title, height = 400, @@ -66,8 +66,8 @@ const TimelineChart: React.FC = (props) => { type: 'map', callback(row: { y1: string; y2: string }) { const newRow = { ...row }; - newRow[titleMap.y1] = row.y1; - newRow[titleMap.y2] = row.y2; + newRow[titleMap.y1 as keyof typeof row] = row.y1; + newRow[titleMap.y2 as keyof typeof row] = row.y2; return newRow; }, }) diff --git a/DashboardAnalysis/src/components/Charts/WaterWave/index.tsx b/DashboardAnalysis/src/components/Charts/WaterWave/index.tsx index a9b64110..906f6f57 100644 --- a/DashboardAnalysis/src/components/Charts/WaterWave/index.tsx +++ b/DashboardAnalysis/src/components/Charts/WaterWave/index.tsx @@ -1,7 +1,8 @@ import React, { Component } from 'react'; import autoHeight from '../autoHeight'; -import styles from './index.less'; +// import styles from './index.less'; +const styles: any = {}; /* eslint no-return-assign: 0 */ /* eslint no-mixed-operators: 0 */ diff --git a/DashboardAnalysis/src/components/Charts/autoHeight.tsx b/DashboardAnalysis/src/components/Charts/autoHeight.tsx index 5ec7bf39..af641e83 100644 --- a/DashboardAnalysis/src/components/Charts/autoHeight.tsx +++ b/DashboardAnalysis/src/components/Charts/autoHeight.tsx @@ -1,7 +1,7 @@ import React from 'react'; export type IReactComponent

= - | React.StatelessComponent

+ | React.FunctionComponent

| React.ComponentClass

| React.ClassicComponentClass

; diff --git a/DashboardAnalysis/src/components/NumberInfo/index.style.ts b/DashboardAnalysis/src/components/NumberInfo/index.style.ts index 122c8734..4964f8a3 100644 --- a/DashboardAnalysis/src/components/NumberInfo/index.style.ts +++ b/DashboardAnalysis/src/components/NumberInfo/index.style.ts @@ -11,7 +11,8 @@ const useStyles = createStyles(({ token }) => { numberInfoTitle: { marginBottom: '16px', color: token.colorText, - fontSize: token['font-size-lg'], + // fontSize: token['font-size-lg'], + fontSize: `${token.fontSizeLG}px`, transition: 'all 0.3s', }, numberInfoSubTitle: { @@ -36,7 +37,8 @@ const useStyles = createStyles(({ token }) => { subTotal: { marginRight: '0', color: token.colorTextSecondary, - fontSize: token['font-size-lg'], + // fontSize: token['font-size-lg'], + fontSize: `${token.fontSizeLG}px`, verticalAlign: 'top', }, anticon: { diff --git a/DashboardAnalysis/src/components/NumberInfo/index.tsx b/DashboardAnalysis/src/components/NumberInfo/index.tsx index a27fdeb1..39021e2f 100644 --- a/DashboardAnalysis/src/components/NumberInfo/index.tsx +++ b/DashboardAnalysis/src/components/NumberInfo/index.tsx @@ -27,12 +27,7 @@ const NumberInfo: React.FC = ({ }) => { const { styles } = useStyles(); return ( -

+
{title && (
{title} diff --git a/DashboardAnalysis/src/components/SalesCard.tsx b/DashboardAnalysis/src/components/SalesCard.tsx index 8d7444ff..2754c105 100644 --- a/DashboardAnalysis/src/components/SalesCard.tsx +++ b/DashboardAnalysis/src/components/SalesCard.tsx @@ -1,13 +1,14 @@ import { Card, Col, DatePicker, Row, Tabs } from 'antd'; import type { RangePickerProps } from 'antd/es/date-picker/generatePicker'; -import type moment from 'moment'; +// import type moment from 'moment'; import { Column } from '@ant-design/charts'; import numeral from 'numeral'; import type { DataItem } from '../data.d'; import useStyles from '../style.style'; -type RangePickerValue = RangePickerProps['value']; +// FIXME: antd5 已经升级为 dayjs 了 +type RangePickerValue = RangePickerProps['value']; export type TimeType = 'today' | 'week' | 'month' | 'year'; const { RangePicker } = DatePicker; @@ -21,21 +22,18 @@ for (let i = 0; i < 7; i += 1) { }); } -const SalesCard = ({ - rangePickerValue, - salesData, - isActive, - handleRangePickerChange, - loading, - selectDate, -}: { - rangePickerValue?: RangeValue; +interface SalesCardProps { + rangePickerValue?: RangePickerValue; isActive: (key: TimeType) => string; salesData: DataItem[]; loading: boolean; handleRangePickerChange: (dates: RangePickerValue, dateStrings: [string, string]) => void; selectDate: (key: TimeType) => void; -}) => { +} + +const SalesCard = (props: SalesCardProps) => { + const { rangePickerValue, salesData, isActive, handleRangePickerChange, loading, selectDate } = + props; const { styles } = useStyles(); return ( diff --git a/DashboardAnalysis/src/components/Trend/index.style.ts b/DashboardAnalysis/src/components/Trend/index.style.ts index 831001c9..ea622089 100644 --- a/DashboardAnalysis/src/components/Trend/index.style.ts +++ b/DashboardAnalysis/src/components/Trend/index.style.ts @@ -1,28 +1,58 @@ import { createStyles } from 'antd-style'; -const useStyles = createStyles(({ token }) => { - return { - trendItem: { - display: 'inline-block', - fontSize: token.fontSize, - lineHeight: '22px', +const useStyles = createStyles(({ token, cx, css }) => { + const trendItem = css({ + display: 'inline-block', + fontSize: token.fontSize, + lineHeight: '22px', + }); + + const upDownCommon = css({ + position: 'relative', + top: 1, + marginLeft: 4, + span: { + fontSize: 12, + transform: 'scale(0.83)', }, - up: { + }); + + const up = cx( + upDownCommon, + css({ color: token['red-6'], - }, - down: { + }), + ); + + const down = cx( + upDownCommon, + css({ top: '-1px', color: token['green-6'], - }, - 'trendItemGrey .up, trendItemGrey .down': { - color: token.colorText, - }, - 'reverseColor .up': { - color: token['green-6'], - }, - 'reverseColor .down': { - color: token['red-6'], - }, + }), + ); + + const trendItemGrey = css` + .${cx(up)}, .${cx(down)} { + color: ${token.colorText}; + } + `; + + const reverseColor = css` + .${cx(up)} { + color: ${token['green-6']}; + } + .${cx(down)} { + color: ${token['red-6']}; + } + `; + + return { + trendItem, + up, + down, + trendItemGrey, + reverseColor, }; }); diff --git a/DashboardAnalysis/src/components/Trend/index.tsx b/DashboardAnalysis/src/components/Trend/index.tsx index bee96940..5f1014a3 100644 --- a/DashboardAnalysis/src/components/Trend/index.tsx +++ b/DashboardAnalysis/src/components/Trend/index.tsx @@ -11,14 +11,8 @@ export type TrendProps = { className?: string; }; -const Trend: React.FC = ({ - colorful = true, - reverseColor = false, - flag, - children, - className, - ...rest -}) => { +const Trend = (props: React.PropsWithChildren) => { + const { colorful = true, reverseColor = false, flag, children, className, ...rest } = props; const { styles } = useStyles(); const classString = classNames( styles.trendItem, diff --git a/DashboardWorkplace/src/_mock.ts b/DashboardWorkplace/src/_mock.ts index 41b9e38a..0b8c4e4e 100644 --- a/DashboardWorkplace/src/_mock.ts +++ b/DashboardWorkplace/src/_mock.ts @@ -375,7 +375,7 @@ const radarTitleMap = { hot: '热度', }; radarOriginData.forEach((item) => { - Object.keys(item).forEach((key) => { + (Object.keys(item) as Array).forEach((key) => { if (key !== 'name') { radarData.push({ name: item.name, diff --git a/DashboardWorkplace/src/index.tsx b/DashboardWorkplace/src/index.tsx index 41128624..917825dd 100644 --- a/DashboardWorkplace/src/index.tsx +++ b/DashboardWorkplace/src/index.tsx @@ -85,10 +85,12 @@ const PAGE_NAME_UPPER_CAMEL_CASE: FC = () => { const { styles } = useStyles(); const renderActivities = (item: ActivitiesType) => { const events = item.template.split(/@\{([^{}]*)\}/gi).map((key) => { - if (item[key]) { + // fixme: 这里总感觉很奇怪... 不过应该没啥大毛病 + const anyItem: any = { ...item }; + if (anyItem[key]) { return ( - - {item[key].name} + + {anyItem[key].name} ); } @@ -199,7 +201,7 @@ const PAGE_NAME_UPPER_CAMEL_CASE: FC = () => { title="XX 指数" loading={data?.radarData?.length === 0} > -
+
= ({ value, onChange }) => { const [clickedCancel, setClickedCancel] = useState(false); const [loading, setLoading] = useState(false); const [index, setIndex] = useState(0); - const [cacheOriginData, setCacheOriginData] = useState({}); + const [cacheOriginData, setCacheOriginData] = useState({}); const [data, setData] = useState(value); const getRowByKey = (key: string, newData?: TableFormDateType[]) => @@ -69,13 +69,14 @@ const TableForm: FC = ({ value, onChange }) => { const handleFieldChange = ( e: React.ChangeEvent, - fieldName: string, + fieldName: keyof TableFormDateType, key: string, ) => { const newData = [...(data as TableFormDateType[])]; const target = getRowByKey(key, newData); if (target) { - target[fieldName] = e.target.value; + // fixme: ts + (target as any)[fieldName] = e.target.value; setData(newData); } }; diff --git a/FormAdvancedForm/src/index.tsx b/FormAdvancedForm/src/index.tsx index 76922ba3..9fe12cca 100644 --- a/FormAdvancedForm/src/index.tsx +++ b/FormAdvancedForm/src/index.tsx @@ -85,11 +85,11 @@ const PAGE_NAME_UPPER_CAMEL_CASE: FC> = () => { if (!err || err.errors.length === 0) { return null; } - const key = err.name[0] as string; + const key = err.name[0] as keyof typeof fieldLabels; return (
  • scrollToField(key)}> -
    {err.errors[0]}
    +
    {err.errors[0]}
    {fieldLabels[key]}
  • ); diff --git a/FormBasicForm/src/index.tsx b/FormBasicForm/src/index.tsx index d438f43e..86da411d 100644 --- a/FormBasicForm/src/index.tsx +++ b/FormBasicForm/src/index.tsx @@ -130,7 +130,7 @@ const PAGE_NAME_UPPER_CAMEL_CASE: FC> = () => { width="xs" fieldProps={{ formatter: (value) => `${value || 0}%`, - parser: (value) => (value ? value.replace('%', '') : '0'), + parser: (value) => Number(value ? value.replace('%', '') : '0'), }} /> diff --git a/FormStepForm/src/index.tsx b/FormStepForm/src/index.tsx index d33078c3..14e6d93b 100644 --- a/FormStepForm/src/index.tsx +++ b/FormStepForm/src/index.tsx @@ -41,9 +41,11 @@ const StepDescriptions: React.FC<{ ); }; -const StepResult: React.FC<{ - onFinish: () => Promise; -}> = (props) => { +const StepResult = ( + props: React.PropsWithChildren<{ + onFinish: () => Promise; + }>, +) => { const { styles } = useStyles(); return ( > = () => { -
    +

    说明

    转账到支付宝账户

    diff --git a/ListBasicList/src/components/OperationModal.tsx b/ListBasicList/src/components/OperationModal.tsx index 674d70ee..adc4304f 100644 --- a/ListBasicList/src/components/OperationModal.tsx +++ b/ListBasicList/src/components/OperationModal.tsx @@ -1,4 +1,3 @@ -import type { FC } from 'react'; import { ModalForm, ProFormSelect, @@ -9,6 +8,7 @@ import { import type { BasicListItemDataType } from '../data.d'; import useStyles from '../style.style'; import { Button, Result } from 'antd'; +import React from 'react'; type OperationModalProps = { done: boolean; @@ -18,7 +18,7 @@ type OperationModalProps = { onSubmit: (values: BasicListItemDataType) => void; }; -const OperationModal: FC = (props) => { +const OperationModal = (props: React.PropsWithChildren) => { const { styles } = useStyles(); const { done, visible, current, onDone, onSubmit, children } = props; if (!visible) { diff --git a/ListBasicList/src/index.tsx b/ListBasicList/src/index.tsx index 9d720a65..3247386a 100644 --- a/ListBasicList/src/index.tsx +++ b/ListBasicList/src/index.tsx @@ -146,7 +146,7 @@ export const PAGE_NAME_UPPER_CAMEL_CASE: FC = () => { item: BasicListItemDataType; }> = ({ item }) => ( editAndDelete(key, item)}> 编辑 删除 diff --git a/ListSearch/src/index.tsx b/ListSearch/src/index.tsx index 47686321..135a35b5 100644 --- a/ListSearch/src/index.tsx +++ b/ListSearch/src/index.tsx @@ -1,6 +1,6 @@ import { PageContainer } from '@ant-design/pro-components'; import { Input } from 'antd'; -import type { FC } from 'react'; +import React from 'react'; import { history } from 'umi'; type PAGE_NAME_UPPER_CAMEL_CASEProps = { @@ -28,7 +28,9 @@ const tabList = [ }, ]; -const PAGE_NAME_UPPER_CAMEL_CASE: FC = (props) => { +const PAGE_NAME_UPPER_CAMEL_CASE = ( + props: React.PropsWithChildren, +) => { const handleTabChange = (key: string) => { const { match } = props; const url = match.url === '/' ? '' : match.url; diff --git a/ListSearchApplications/src/components/StandardFormRow/index.tsx b/ListSearchApplications/src/components/StandardFormRow/index.tsx index 012f1e51..06b8e654 100644 --- a/ListSearchApplications/src/components/StandardFormRow/index.tsx +++ b/ListSearchApplications/src/components/StandardFormRow/index.tsx @@ -10,14 +10,8 @@ type StandardFormRowProps = { style?: React.CSSProperties; }; -const StandardFormRow: React.FC = ({ - title, - children, - last, - block, - grid, - ...rest -}) => { +const StandardFormRow = (props: React.PropsWithChildren) => { + const { title, children, last, block, grid, ...rest } = props; const { styles } = useStyles(); const cls = classNames(styles.standardFormRow, { [styles.standardFormRowBlock]: block, diff --git a/ListSearchApplications/src/components/TagSelect/index.tsx b/ListSearchApplications/src/components/TagSelect/index.tsx index ba2f07fe..0d29a6a1 100644 --- a/ListSearchApplications/src/components/TagSelect/index.tsx +++ b/ListSearchApplications/src/components/TagSelect/index.tsx @@ -2,33 +2,33 @@ import { DownOutlined, UpOutlined } from '@ant-design/icons'; import { useBoolean, useControllableValue } from 'ahooks'; import { Tag } from 'antd'; import classNames from 'classnames'; -import type { FC } from 'react'; import React from 'react'; import useStyles from './index.style'; const { CheckableTag } = Tag; -export interface TagSelectOptionProps { +export type TagSelectOptionProps = React.PropsWithChildren<{ value: string | number; style?: React.CSSProperties; checked?: boolean; onChange?: (value: string | number, state: boolean) => void; -} - -const TagSelectOption: React.FC & { - isTagSelectOption: boolean; -} = ({ children, checked, onChange, value }) => ( - onChange && onChange(value, state)} - > - {children} - +}>; + +const TagSelectOption = Object.assign( + function TagSelectOption(props: TagSelectOptionProps) { + const { checked, value, onChange, children } = props; + return ( + onChange?.(value, state)}> + {children} + + ); + }, + { + isTagSelectOption: true, + displayName: 'TagSelectOption', + }, ); -TagSelectOption.isTagSelectOption = true; - type TagSelectOptionElement = React.ReactElement; export interface TagSelectProps { onChange?: (value: (string | number)[]) => void; @@ -47,7 +47,7 @@ export interface TagSelectProps { children?: TagSelectOptionElement | TagSelectOptionElement[]; } -const TagSelect: FC & { Option: typeof TagSelectOption } = (props) => { +const TagSelect = (props: TagSelectProps) => { const { styles } = useStyles(); const { children, hideCheckAll = false, className, style, expandable, actionsText = {} } = props; @@ -139,6 +139,4 @@ const TagSelect: FC & { Option: typeof TagSelectOption } = (prop ); }; -TagSelect.Option = TagSelectOption; - -export default TagSelect; +export default Object.assign(TagSelect, { Option: TagSelectOption }); diff --git a/ListSearchArticles/src/components/ArticleListContent/index.tsx b/ListSearchArticles/src/components/ArticleListContent/index.tsx index 5263defa..7bdb4999 100644 --- a/ListSearchArticles/src/components/ArticleListContent/index.tsx +++ b/ListSearchArticles/src/components/ArticleListContent/index.tsx @@ -18,7 +18,7 @@ const ArticleListContent: React.FC = ({ }) => { const { styles } = useStyles(); return ( -

    +
    {content}
    diff --git a/ListSearchArticles/src/components/StandardFormRow/index.tsx b/ListSearchArticles/src/components/StandardFormRow/index.tsx index 012f1e51..06b8e654 100644 --- a/ListSearchArticles/src/components/StandardFormRow/index.tsx +++ b/ListSearchArticles/src/components/StandardFormRow/index.tsx @@ -10,14 +10,8 @@ type StandardFormRowProps = { style?: React.CSSProperties; }; -const StandardFormRow: React.FC = ({ - title, - children, - last, - block, - grid, - ...rest -}) => { +const StandardFormRow = (props: React.PropsWithChildren) => { + const { title, children, last, block, grid, ...rest } = props; const { styles } = useStyles(); const cls = classNames(styles.standardFormRow, { [styles.standardFormRowBlock]: block, diff --git a/ListSearchArticles/src/components/TagSelect/index.tsx b/ListSearchArticles/src/components/TagSelect/index.tsx index ba2f07fe..0d29a6a1 100644 --- a/ListSearchArticles/src/components/TagSelect/index.tsx +++ b/ListSearchArticles/src/components/TagSelect/index.tsx @@ -2,33 +2,33 @@ import { DownOutlined, UpOutlined } from '@ant-design/icons'; import { useBoolean, useControllableValue } from 'ahooks'; import { Tag } from 'antd'; import classNames from 'classnames'; -import type { FC } from 'react'; import React from 'react'; import useStyles from './index.style'; const { CheckableTag } = Tag; -export interface TagSelectOptionProps { +export type TagSelectOptionProps = React.PropsWithChildren<{ value: string | number; style?: React.CSSProperties; checked?: boolean; onChange?: (value: string | number, state: boolean) => void; -} - -const TagSelectOption: React.FC & { - isTagSelectOption: boolean; -} = ({ children, checked, onChange, value }) => ( - onChange && onChange(value, state)} - > - {children} - +}>; + +const TagSelectOption = Object.assign( + function TagSelectOption(props: TagSelectOptionProps) { + const { checked, value, onChange, children } = props; + return ( + onChange?.(value, state)}> + {children} + + ); + }, + { + isTagSelectOption: true, + displayName: 'TagSelectOption', + }, ); -TagSelectOption.isTagSelectOption = true; - type TagSelectOptionElement = React.ReactElement; export interface TagSelectProps { onChange?: (value: (string | number)[]) => void; @@ -47,7 +47,7 @@ export interface TagSelectProps { children?: TagSelectOptionElement | TagSelectOptionElement[]; } -const TagSelect: FC & { Option: typeof TagSelectOption } = (props) => { +const TagSelect = (props: TagSelectProps) => { const { styles } = useStyles(); const { children, hideCheckAll = false, className, style, expandable, actionsText = {} } = props; @@ -139,6 +139,4 @@ const TagSelect: FC & { Option: typeof TagSelectOption } = (prop ); }; -TagSelect.Option = TagSelectOption; - -export default TagSelect; +export default Object.assign(TagSelect, { Option: TagSelectOption }); diff --git a/ListSearchArticles/src/style.style.ts b/ListSearchArticles/src/style.style.ts index c23aa27d..5d8db5b4 100644 --- a/ListSearchArticles/src/style.style.ts +++ b/ListSearchArticles/src/style.style.ts @@ -2,7 +2,7 @@ import { createStyles } from 'antd-style'; const useStyles = createStyles(({ token }) => { return { - 'a.listItemMetaTitle': { + listItemMetaTitle: { color: token.colorTextHeading, }, listItemExtra: { diff --git a/ListSearchProjects/src/components/StandardFormRow/index.tsx b/ListSearchProjects/src/components/StandardFormRow/index.tsx index 012f1e51..06b8e654 100644 --- a/ListSearchProjects/src/components/StandardFormRow/index.tsx +++ b/ListSearchProjects/src/components/StandardFormRow/index.tsx @@ -10,14 +10,8 @@ type StandardFormRowProps = { style?: React.CSSProperties; }; -const StandardFormRow: React.FC = ({ - title, - children, - last, - block, - grid, - ...rest -}) => { +const StandardFormRow = (props: React.PropsWithChildren) => { + const { title, children, last, block, grid, ...rest } = props; const { styles } = useStyles(); const cls = classNames(styles.standardFormRow, { [styles.standardFormRowBlock]: block, diff --git a/ListSearchProjects/src/components/TagSelect/index.tsx b/ListSearchProjects/src/components/TagSelect/index.tsx index ba2f07fe..51fa200f 100644 --- a/ListSearchProjects/src/components/TagSelect/index.tsx +++ b/ListSearchProjects/src/components/TagSelect/index.tsx @@ -2,34 +2,35 @@ import { DownOutlined, UpOutlined } from '@ant-design/icons'; import { useBoolean, useControllableValue } from 'ahooks'; import { Tag } from 'antd'; import classNames from 'classnames'; -import type { FC } from 'react'; -import React from 'react'; +import * as React from 'react'; import useStyles from './index.style'; const { CheckableTag } = Tag; -export interface TagSelectOptionProps { +export type TagSelectOptionProps = React.PropsWithChildren<{ value: string | number; style?: React.CSSProperties; checked?: boolean; onChange?: (value: string | number, state: boolean) => void; -} - -const TagSelectOption: React.FC & { - isTagSelectOption: boolean; -} = ({ children, checked, onChange, value }) => ( - onChange && onChange(value, state)} - > - {children} - +}>; + +const TagSelectOption = Object.assign( + function TagSelectOption(props: TagSelectOptionProps) { + const { checked, value, onChange, children } = props; + return ( + onChange?.(value, state)}> + {children} + + ); + }, + { + isTagSelectOption: true, + displayName: 'TagSelectOption', + }, ); -TagSelectOption.isTagSelectOption = true; - type TagSelectOptionElement = React.ReactElement; + export interface TagSelectProps { onChange?: (value: (string | number)[]) => void; expandable?: boolean; @@ -47,7 +48,7 @@ export interface TagSelectProps { children?: TagSelectOptionElement | TagSelectOptionElement[]; } -const TagSelect: FC & { Option: typeof TagSelectOption } = (props) => { +const TagSelect = (props: TagSelectProps) => { const { styles } = useStyles(); const { children, hideCheckAll = false, className, style, expandable, actionsText = {} } = props; @@ -139,6 +140,4 @@ const TagSelect: FC & { Option: typeof TagSelectOption } = (prop ); }; -TagSelect.Option = TagSelectOption; - -export default TagSelect; +export default Object.assign(TagSelect, { Option: TagSelectOption }); diff --git a/ListSearchProjects/src/index.tsx b/ListSearchProjects/src/index.tsx index 29e90d19..bfb23ff6 100644 --- a/ListSearchProjects/src/index.tsx +++ b/ListSearchProjects/src/index.tsx @@ -45,11 +45,7 @@ const PAGE_NAME_UPPER_CAMEL_CASE: FC = () => { }> {item.title}} - description={ - - {item.subDescription} - - } + description={{item.subDescription}} />
    diff --git a/package.json b/package.json index bce5d231..958bd153 100644 --- a/package.json +++ b/package.json @@ -67,7 +67,7 @@ "devDependencies": { "@types/classnames": "^2.2.7", "@types/numeral": "^0.0.28", - "@types/react": "17.0.30", + "@types/react": "18.2.42", "@types/react-dom": "^17.0.25", "cross-env": "^7.0.0", "eslint": "^8.35.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index d92fbc15..215bc44b 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -22,13 +22,13 @@ importers: version: 4.17.13 '@umijs/max': specifier: 4.0.89 - version: 4.0.89(@types/react-dom@17.0.25)(@types/react@17.0.30)(prettier@2.8.8)(react-dom@18.2.0)(react@18.2.0)(typescript@5.3.2) + version: 4.0.89(@types/react-dom@17.0.25)(@types/react@18.2.42)(prettier@2.8.8)(react-dom@18.2.0)(react@18.2.0)(typescript@5.3.2) antd: specifier: ^5.11.5 version: 5.11.5(react-dom@18.2.0)(react@18.2.0) antd-style: specifier: ^3.5.2 - version: 3.5.2(@types/react@17.0.30)(antd@5.11.5)(react-dom@18.2.0)(react@18.2.0) + version: 3.5.2(@types/react@18.2.42)(antd@5.11.5)(react-dom@18.2.0)(react@18.2.0) bizcharts: specifier: ^3.5.4 version: 3.5.4(react@18.2.0) @@ -49,8 +49,8 @@ importers: specifier: ^0.0.28 version: 0.0.28 '@types/react': - specifier: 17.0.30 - version: 17.0.30 + specifier: 18.2.42 + version: 18.2.42 '@types/react-dom': specifier: ^17.0.25 version: 17.0.25 @@ -2517,7 +2517,7 @@ packages: resolution: {integrity: sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==} dev: false - /@emotion/react@11.11.1(@types/react@17.0.30)(react@18.2.0): + /@emotion/react@11.11.1(@types/react@18.2.42)(react@18.2.0): resolution: {integrity: sha512-5mlW1DquU5HaxjLkfkGN1GA/fvVGdyHURRiX/0FHl2cfIfRxSOfmxEH5YS43edp0OldZrZ+dkBKbngxcNCdZvA==} peerDependencies: '@types/react': '*' @@ -2533,7 +2533,7 @@ packages: '@emotion/use-insertion-effect-with-fallbacks': 1.0.1(react@18.2.0) '@emotion/utils': 1.2.1 '@emotion/weak-memoize': 0.3.1 - '@types/react': 17.0.30 + '@types/react': 18.2.42 hoist-non-react-statics: 3.3.2 react: 18.2.0 dev: false @@ -3032,21 +3032,21 @@ packages: '@floating-ui/core': 0.6.2 dev: false - /@floating-ui/react-dom-interactions@0.3.1(@types/react@17.0.30)(react-dom@18.1.0)(react@18.1.0): + /@floating-ui/react-dom-interactions@0.3.1(@types/react@18.2.42)(react-dom@18.1.0)(react@18.1.0): resolution: {integrity: sha512-tP2KEh7EHJr5hokSBHcPGojb+AorDNUf0NYfZGg/M+FsMvCOOsSEeEF0O1NDfETIzDnpbHnCs0DuvCFhSMSStg==} deprecated: Package renamed to @floating-ui/react dependencies: - '@floating-ui/react-dom': 0.6.3(@types/react@17.0.30)(react-dom@18.1.0)(react@18.1.0) + '@floating-ui/react-dom': 0.6.3(@types/react@18.2.42)(react-dom@18.1.0)(react@18.1.0) aria-hidden: 1.2.3 point-in-polygon: 1.1.0 - use-isomorphic-layout-effect: 1.1.2(@types/react@17.0.30)(react@18.1.0) + use-isomorphic-layout-effect: 1.1.2(@types/react@18.2.42)(react@18.1.0) transitivePeerDependencies: - '@types/react' - react - react-dom dev: false - /@floating-ui/react-dom@0.6.3(@types/react@17.0.30)(react-dom@18.1.0)(react@18.1.0): + /@floating-ui/react-dom@0.6.3(@types/react@18.2.42)(react-dom@18.1.0)(react@18.1.0): resolution: {integrity: sha512-hC+pS5D6AgS2wWjbmSQ6UR6Kpy+drvWGJIri6e1EDGADTPsCaa4KzCgmCczHrQeInx9tqs81EyDmbKJYY2swKg==} peerDependencies: react: '>=16.8.0' @@ -3055,7 +3055,7 @@ packages: '@floating-ui/dom': 0.4.5 react: 18.1.0 react-dom: 18.1.0(react@18.1.0) - use-isomorphic-layout-effect: 1.1.2(@types/react@17.0.30)(react@18.1.0) + use-isomorphic-layout-effect: 1.1.2(@types/react@18.2.42)(react@18.1.0) transitivePeerDependencies: - '@types/react' dev: false @@ -3847,7 +3847,7 @@ packages: /@types/hoist-non-react-statics@3.3.5: resolution: {integrity: sha512-SbcrWzkKBw2cdwRTwQAswfpB9g9LJWfjtUeW/jvNwbhC8cpmmNYVePa+ncbUe0rGTQ7G3Ff6mYUN2VMfLVr+Sg==} dependencies: - '@types/react': 17.0.30 + '@types/react': 18.2.42 hoist-non-react-statics: 3.3.2 dev: false @@ -3958,7 +3958,7 @@ packages: resolution: {integrity: sha512-sdMN284GEOcqDEMS/hE/XD06Abw2fws30+xkZf3C9cSRcWopiv/HDTmunYI7DKLYKVRaWFkq1lkuJ6qeYu0E7A==} dependencies: '@types/history': 5.0.0 - '@types/react': 18.2.39 + '@types/react': 17.0.30 dev: true /@types/react@17.0.30: @@ -3968,13 +3968,12 @@ packages: '@types/scheduler': 0.16.8 csstype: 3.1.2 - /@types/react@18.2.39: - resolution: {integrity: sha512-Oiw+ppED6IremMInLV4HXGbfbG6GyziY3kqAwJYOR0PNbkYDmLWQA3a95EhdSmamsvbkJN96ZNN+YD+fGjzSBA==} + /@types/react@18.2.42: + resolution: {integrity: sha512-c1zEr96MjakLYus/wPnuWDo1/zErfdU9rNsIGmE+NV71nx88FG9Ttgo5dqorXTu/LImX2f63WBP986gJkMPNbA==} dependencies: '@types/prop-types': 15.7.11 '@types/scheduler': 0.16.8 csstype: 3.1.2 - dev: true /@types/scheduler@0.16.8: resolution: {integrity: sha512-WZLiwShhwLRmeV6zH+GkbOFT6Z6VklCItrDioxUnv+u4Ll+8vKeFySoFyK/0ctcRpOmwAicELfmys1sDc/Rw+A==} @@ -4573,16 +4572,16 @@ packages: - typescript dev: false - /@umijs/max@4.0.89(@types/react-dom@17.0.25)(@types/react@17.0.30)(prettier@2.8.8)(react-dom@18.2.0)(react@18.2.0)(typescript@5.3.2): + /@umijs/max@4.0.89(@types/react-dom@17.0.25)(@types/react@18.2.42)(prettier@2.8.8)(react-dom@18.2.0)(react@18.2.0)(typescript@5.3.2): resolution: {integrity: sha512-FDydlZs1ISE+lASrFzEJK0VIR2zLkahh8MWVmOq7itlCTH6g6AgHfKWdZzBSmn6zRHZ6fCZ7cg9ed4J9vbvzcw==} hasBin: true dependencies: '@umijs/lint': 4.0.89(eslint@8.35.0)(stylelint@14.8.2)(typescript@5.3.2) - '@umijs/plugins': 4.0.89(@types/react-dom@17.0.25)(@types/react@17.0.30)(antd@4.24.15)(react-dom@18.2.0)(react@18.2.0) + '@umijs/plugins': 4.0.89(@types/react-dom@17.0.25)(@types/react@18.2.42)(antd@4.24.15)(react-dom@18.2.0)(react@18.2.0) antd: 4.24.15(react-dom@18.2.0)(react@18.2.0) eslint: 8.35.0 stylelint: 14.8.2 - umi: 4.0.89(@types/react@17.0.30)(eslint@8.35.0)(prettier@2.8.8)(react-dom@18.2.0)(react@18.2.0)(stylelint@14.8.2)(typescript@5.3.2) + umi: 4.0.89(@types/react@18.2.42)(eslint@8.35.0)(prettier@2.8.8)(react-dom@18.2.0)(react@18.2.0)(stylelint@14.8.2)(typescript@5.3.2) transitivePeerDependencies: - '@babel/core' - '@types/lodash.merge' @@ -4638,7 +4637,7 @@ packages: tsx: 3.14.0 dev: false - /@umijs/plugins@4.0.89(@types/react-dom@17.0.25)(@types/react@17.0.30)(antd@4.24.15)(react-dom@18.2.0)(react@18.2.0): + /@umijs/plugins@4.0.89(@types/react-dom@17.0.25)(@types/react@18.2.42)(antd@4.24.15)(react-dom@18.2.0)(react@18.2.0): resolution: {integrity: sha512-JJ5DrTCddEZTTYMU3eeyRa9OoiPkXmNWULMBWs7cyA2kCSu7OJRhZ4jMltP267AYzBscfCqGG6mv8MYgvkq8XQ==} dependencies: '@ahooksjs/use-request': 2.8.15(react@18.2.0) @@ -4650,7 +4649,7 @@ packages: '@tanstack/react-query': 4.36.1(react-dom@18.2.0)(react@18.2.0) '@tanstack/react-query-devtools': 4.36.1(@tanstack/react-query@4.36.1)(react-dom@18.2.0)(react@18.2.0) '@umijs/bundler-utils': 4.0.89 - '@umijs/valtio': 1.0.4(@types/react@17.0.30)(react@18.2.0) + '@umijs/valtio': 1.0.4(@types/react@18.2.42)(react@18.2.0) antd-dayjs-webpack-plugin: 1.0.6(dayjs@1.11.10) axios: 0.27.2 babel-plugin-import: 1.13.8 @@ -4666,7 +4665,7 @@ packages: moment: 2.29.4 qiankun: 2.10.16 react-intl: 3.12.1(react@18.2.0) - react-redux: 8.1.3(@types/react-dom@17.0.25)(@types/react@17.0.30)(react-dom@18.2.0)(react@18.2.0)(redux@4.2.1) + react-redux: 8.1.3(@types/react-dom@17.0.25)(@types/react@18.2.42)(react-dom@18.2.0)(react@18.2.0)(redux@4.2.1) redux: 4.2.1 styled-components: 6.1.1(react-dom@18.2.0)(react@18.2.0) tslib: 2.6.2 @@ -4686,7 +4685,7 @@ packages: - supports-color dev: false - /@umijs/preset-umi@4.0.89(@types/react@17.0.30)(typescript@5.3.2): + /@umijs/preset-umi@4.0.89(@types/react@18.2.42)(typescript@5.3.2): resolution: {integrity: sha512-S0dn0e9C5eD2IX8bGGrNEDd0EaQVGuAwyJw2ruIU/FCO9B1HwdjCdRMuEADCBOuXMzBRt4+wKToFgId5tz3gAA==} dependencies: '@iconify/utils': 2.1.1 @@ -4709,7 +4708,7 @@ packages: '@umijs/utils': 4.0.89 '@umijs/zod2ts': 4.0.89 babel-plugin-dynamic-import-node: 2.3.3 - click-to-react-component: 1.1.0(@types/react@17.0.30)(react-dom@18.1.0)(react@18.1.0) + click-to-react-component: 1.1.0(@types/react@18.2.42)(react-dom@18.1.0)(react@18.1.0) core-js: 3.28.0 current-script-polyfill: 1.0.0 enhanced-resolve: 5.9.3 @@ -4862,10 +4861,10 @@ packages: pino: 7.11.0 dev: false - /@umijs/valtio@1.0.4(@types/react@17.0.30)(react@18.2.0): + /@umijs/valtio@1.0.4(@types/react@18.2.42)(react@18.2.0): resolution: {integrity: sha512-2PmAU4rNQbBqrWpJ86Si9UGC23JapkYw8k7Hna6V8DHLaEYJENdp2e/IKLPHSPghzrdQtbUHSoOAUsBd4i4OzQ==} dependencies: - valtio: 1.11.2(@types/react@17.0.30)(react@18.2.0) + valtio: 1.11.2(@types/react@18.2.42)(react@18.2.0) transitivePeerDependencies: - '@types/react' - react @@ -5058,7 +5057,7 @@ packages: dayjs: 1.11.10 dev: false - /antd-style@3.5.2(@types/react@17.0.30)(antd@5.11.5)(react-dom@18.2.0)(react@18.2.0): + /antd-style@3.5.2(@types/react@18.2.42)(antd@5.11.5)(react-dom@18.2.0)(react@18.2.0): resolution: {integrity: sha512-DnISjaD4M37wbKvMVkkx4XetCOvTnmTrmSgETQADzQPRn9PNb0FuLE6djS9SFJgjR9XqNIytn0ano0UBgwgpvA==} peerDependencies: antd: '>=5.8.1' @@ -5068,7 +5067,7 @@ packages: '@babel/runtime': 7.23.5 '@emotion/cache': 11.11.0 '@emotion/css': 11.11.2 - '@emotion/react': 11.11.1(@types/react@17.0.30)(react@18.2.0) + '@emotion/react': 11.11.1(@types/react@18.2.42)(react@18.2.0) '@emotion/serialize': 1.1.2 '@emotion/server': 11.11.0(@emotion/css@11.11.2) '@emotion/utils': 1.2.1 @@ -6146,12 +6145,12 @@ packages: resolution: {integrity: sha512-GRMWDxpOB6Dgk2E5Uo+3eEBvtOOlimMmpbFiKuLFnQzYDavtLFY3K5ona41jgN/WdRZtG7utuVSVTL4HbZHGkw==} dev: false - /click-to-react-component@1.1.0(@types/react@17.0.30)(react-dom@18.1.0)(react@18.1.0): + /click-to-react-component@1.1.0(@types/react@18.2.42)(react-dom@18.1.0)(react@18.1.0): resolution: {integrity: sha512-/DjZemufS1BkxyRgZL3r7HXVVOFRWVQi5Xd4EBnjxZMwrHEh0OlUVA2N9CjXkZ0x8zMf8dL1cKnnx+xUWUg4VA==} peerDependencies: react: '>=16.8.0' dependencies: - '@floating-ui/react-dom-interactions': 0.3.1(@types/react@17.0.30)(react-dom@18.1.0)(react@18.1.0) + '@floating-ui/react-dom-interactions': 0.3.1(@types/react@18.2.42)(react-dom@18.1.0)(react@18.1.0) htm: 3.1.1 react: 18.1.0 react-merge-refs: 1.1.0 @@ -13972,7 +13971,7 @@ packages: resolution: {integrity: sha512-alTKsjEL0dKH/ru1Iyn7vliS2QRcBp9zZPGoWxUOvRGWPUYgjo+V01is7p04It6KhgrzhJGnIj9GgX8W4bZoCQ==} dev: false - /react-redux@8.1.3(@types/react-dom@17.0.25)(@types/react@17.0.30)(react-dom@18.2.0)(react@18.2.0)(redux@4.2.1): + /react-redux@8.1.3(@types/react-dom@17.0.25)(@types/react@18.2.42)(react-dom@18.2.0)(react@18.2.0)(redux@4.2.1): resolution: {integrity: sha512-n0ZrutD7DaX/j9VscF+uTALI3oUPa/pO4Z3soOBIjuRn/FzVu6aehhysxZCLi6y7duMf52WNZGMl7CtuK5EnRw==} peerDependencies: '@types/react': ^16.8 || ^17.0 || ^18.0 @@ -13995,7 +13994,7 @@ packages: dependencies: '@babel/runtime': 7.23.5 '@types/hoist-non-react-statics': 3.3.5 - '@types/react': 17.0.30 + '@types/react': 18.2.42 '@types/react-dom': 17.0.25 '@types/use-sync-external-store': 0.0.3 hoist-non-react-statics: 3.3.2 @@ -16130,7 +16129,7 @@ packages: slash2: 2.0.0 dev: false - /umi@4.0.89(@types/react@17.0.30)(eslint@8.35.0)(prettier@2.8.8)(react-dom@18.2.0)(react@18.2.0)(stylelint@14.8.2)(typescript@5.3.2): + /umi@4.0.89(@types/react@18.2.42)(eslint@8.35.0)(prettier@2.8.8)(react-dom@18.2.0)(react@18.2.0)(stylelint@14.8.2)(typescript@5.3.2): resolution: {integrity: sha512-bC62ctJ3wnymADnhE5nU7IZz4+XQ3MPWwoVW150OJazyAqEioZdjIZEBgB9pVfQEM819xMc6+eslnyuCNOQV+g==} engines: {node: '>=14'} hasBin: true @@ -16140,7 +16139,7 @@ packages: '@umijs/bundler-webpack': 4.0.89(typescript@5.3.2) '@umijs/core': 4.0.89 '@umijs/lint': 4.0.89(eslint@8.35.0)(stylelint@14.8.2)(typescript@5.3.2) - '@umijs/preset-umi': 4.0.89(@types/react@17.0.30)(typescript@5.3.2) + '@umijs/preset-umi': 4.0.89(@types/react@18.2.42)(typescript@5.3.2) '@umijs/renderer-react': 4.0.89(react-dom@18.2.0)(react@18.2.0) '@umijs/server': 4.0.89 '@umijs/test': 4.0.89 @@ -16330,7 +16329,7 @@ packages: qs: 6.11.2 dev: false - /use-isomorphic-layout-effect@1.1.2(@types/react@17.0.30)(react@18.1.0): + /use-isomorphic-layout-effect@1.1.2(@types/react@18.2.42)(react@18.1.0): resolution: {integrity: sha512-49L8yCO3iGT/ZF9QttjwLF/ZD9Iwto5LnH5LmEdk/6cFmXddqi2ulF0edxTwjj+7mqvpVVGQWvbXZdn32wRSHA==} peerDependencies: '@types/react': '*' @@ -16339,7 +16338,7 @@ packages: '@types/react': optional: true dependencies: - '@types/react': 17.0.30 + '@types/react': 18.2.42 react: 18.1.0 dev: false @@ -16401,7 +16400,7 @@ packages: spdx-expression-parse: 3.0.1 dev: false - /valtio@1.11.2(@types/react@17.0.30)(react@18.2.0): + /valtio@1.11.2(@types/react@18.2.42)(react@18.2.0): resolution: {integrity: sha512-1XfIxnUXzyswPAPXo1P3Pdx2mq/pIqZICkWN60Hby0d9Iqb+MEIpqgYVlbflvHdrp2YR/q3jyKWRPJJ100yxaw==} engines: {node: '>=12.20.0'} peerDependencies: @@ -16413,7 +16412,7 @@ packages: react: optional: true dependencies: - '@types/react': 17.0.30 + '@types/react': 18.2.42 proxy-compare: 2.5.1 react: 18.2.0 use-sync-external-store: 1.2.0(react@18.2.0)