From 94a260a8ff01ed05e629ef8ac19502d311c2d9de Mon Sep 17 00:00:00 2001 From: dengfuping Date: Mon, 30 Dec 2024 12:12:44 +0800 Subject: [PATCH] feat(ui): Action add moreType prop and improve its judge logic --- packages/ui/src/Action/Group.tsx | 24 ++++++++++++++++-------- packages/ui/src/Action/index.md | 3 ++- 2 files changed, 18 insertions(+), 9 deletions(-) diff --git a/packages/ui/src/Action/Group.tsx b/packages/ui/src/Action/Group.tsx index a7395d4d9..74ebd254d 100644 --- a/packages/ui/src/Action/Group.tsx +++ b/packages/ui/src/Action/Group.tsx @@ -18,13 +18,13 @@ export interface GroupProps { shouldVisible?: (key: string) => boolean; shouldDisabled?: (key: string) => boolean; enableLoading?: boolean; - /** 更多操作的自定义展示 */ + // 设置更多操作的文案 moreText?: React.ReactNode; + // 设置更多操作的元素类型 + moreType?: 'button' | 'link'; buttonSize?: ButtonSize; } -type ellipsisType = 'default' | 'link'; - const getOrder = ({ type, fixed }: { type?: string; fixed?: boolean }) => { const ORDER_SET = { primary: 3, fixed: 2, default: 0 }; let order = ORDER_SET.default; @@ -45,6 +45,7 @@ export default ({ shouldDisabled, enableLoading, moreText, + moreType, buttonSize, }: GroupProps) => { const visibleActions = Array.isArray(children) @@ -74,20 +75,27 @@ export default ({ const mainActions = visibleActionsSort.slice(0, realSize); const ellipsisActions = visibleActionsSort.slice(realSize); - let ellipsisType: ellipsisType = 'link'; + let ellipsisType = 'link'; // @ts-ignore - if (visibleActionsSort.every(action => action.type.__DISPLAY_NAME === 'button')) { - ellipsisType = 'default'; + if (visibleActionsSort.some(action => action.type.__DISPLAY_NAME === 'button')) { + ellipsisType = 'button'; } + // @ts-ignore + if (visibleActionsSort.some(action => action.type.__DISPLAY_NAME === 'link')) { + ellipsisType = 'link'; + } + + ellipsisType = moreType ?? ellipsisType; + const getDefaultDisabled = (key: string) => shouldDisabled?.(key as string) ?? false; let moreDom: string | React.ReactElement; - if (ellipsisType === 'default') { + if (ellipsisType === 'button') { moreDom = ( - ); diff --git a/packages/ui/src/Action/index.md b/packages/ui/src/Action/index.md index 57b173e29..589a24970 100644 --- a/packages/ui/src/Action/index.md +++ b/packages/ui/src/Action/index.md @@ -27,7 +27,8 @@ nav: | shouldVisible | 通过函数对 action 是否展示的处理 | (key: string) => boolean | - | | shouldDisabled | 通过函数对 action 是否禁用的处理 | (key: string) => boolean | - | | enableLoading | 是否展示 loading 状态 | boolean | true | -| moreText | 更多操作的自定义展示 | ReactNode | - | +| moreText | 设置更多操作的文案 | ReactNode | - | +| moreType | 设置更多操作的元素类型 | button \| link | - | ### Action.Link