-
-
Notifications
You must be signed in to change notification settings - Fork 233
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: add overflow trigger props #706
Conversation
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
src/TabNavList/OperationNode.tsx
Outdated
@@ -37,6 +38,7 @@ const OperationNode = React.forwardRef<HTMLDivElement, OperationNodeProps>((prop | |||
locale, | |||
mobile, | |||
moreIcon = 'More', | |||
moreTrigger = 'hover', | |||
moreTransitionName, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
will Check it out later.
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## master #706 +/- ##
=======================================
Coverage 97.72% 97.72%
=======================================
Files 18 18
Lines 702 703 +1
Branches 192 200 +8
=======================================
+ Hits 686 687 +1
Misses 16 16 ☔ View full report in Codecov by Sentry. |
src/TabNavList/OperationNode.tsx
Outdated
@@ -18,8 +18,7 @@ export interface OperationNodeProps { | |||
tabBarGutter?: number; | |||
activeKey: string; | |||
mobile: boolean; | |||
moreIcon?: React.ReactNode; | |||
moreTrigger?: moreTrigger; | |||
more?: more |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
more?: more | |
more?: MoreProps; |
src/interface.ts
Outdated
export type more = { | ||
moreTrigger?: moreTrigger, | ||
moreIcon?: moreIcon, | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
export type more = { | |
moreTrigger?: moreTrigger, | |
moreIcon?: moreIcon, | |
} | |
export type MoreProps = { | |
icon?: moreIcon, | |
} & TriggerProps; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
这里为什么用 & TriggerProps;
这样的写法
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
为了支持 DropdownProps 所有能力。
src/TabNavList/OperationNode.tsx
Outdated
@@ -36,7 +36,7 @@ const OperationNode = React.forwardRef<HTMLDivElement, OperationNodeProps>((prop | |||
tabs, | |||
locale, | |||
mobile, | |||
moreIcon = 'More', | |||
more: moreProp = {}, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
more: moreProp = {}, | |
more: moreProps = {}, |
src/TabNavList/OperationNode.tsx
Outdated
@@ -52,6 +52,8 @@ const OperationNode = React.forwardRef<HTMLDivElement, OperationNodeProps>((prop | |||
const [open, setOpen] = useState(false); | |||
const [selectedKey, setSelectedKey] = useState<string>(null); | |||
|
|||
const { icon: moreIcon = 'More', trigger = 'hover' } = moreProp; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
把 moreProps 放到 Dropdown 的属性最下面去,这个可以支持 DropdownProps 所有能力。
<Dropdown
...
...
...
{...moreProps}
>
src/interface.ts
Outdated
export type moreIcon = React.ReactNode; | ||
export type MoreProps = { | ||
icon?: moreIcon, | ||
} & TriggerProps ; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
} & TriggerProps ; | |
} & DropdownProps ; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
别忘了从 rc-dropdown 里 import 出来。
src/TabNavList/OperationNode.tsx
Outdated
@@ -36,7 +36,7 @@ const OperationNode = React.forwardRef<HTMLDivElement, OperationNodeProps>((prop | |||
tabs, | |||
locale, | |||
mobile, | |||
moreIcon = 'More', | |||
more: moreProps = {}, | |||
moreTransitionName, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
moreTransitionName 也可以干掉,改用 more={{ transitionName }} 支持。
src/interface.ts
Outdated
@@ -10,6 +10,7 @@ export type TriggerProps = { | |||
export type moreIcon = React.ReactNode; | |||
export type MoreProps = { | |||
icon?: moreIcon, | |||
transitionName?: string, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
DropdownProps 应该有 transitionName ?
src/TabNavList/OperationNode.tsx
Outdated
@@ -18,8 +18,7 @@ export interface OperationNodeProps { | |||
tabBarGutter?: number; | |||
activeKey: string; | |||
mobile: boolean; | |||
moreIcon?: React.ReactNode; | |||
moreTransitionName?: string; | |||
more?: MoreProps |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
more?: MoreProps | |
more?: MoreProps; |
@afc163 check have passed |
ref:ant-design/ant-design#44858
add a new props to control overflow trigger way
In the tabs component, currently we only have hover functionality for triggering the overflow. However, some scenarios require a click action.