Skip to content

Commit

Permalink
Merge pull request #2255 from DouyinFE/fix/avatar-wrap
Browse files Browse the repository at this point in the history
fix: [avatar] fix onClick, onMouseEnter, onMouseLeave do not call whe…
  • Loading branch information
DaiQiangReal authored May 28, 2024
2 parents 88429aa + f611109 commit 005f6b3
Show file tree
Hide file tree
Showing 5 changed files with 74 additions and 42 deletions.
4 changes: 2 additions & 2 deletions content/show/avatar/index-en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -429,7 +429,7 @@ import { Avatar, AvatarGroup } from '@douyinfe/semi-ui';
| ------------ |-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| -------- |
| alt | Defines an alternative text description of the image. | string | - |
| border | additional border(>=2.52.0) | {color?:string //color, motion?:boolean // has animation} or boolean | - |
| bottomSlot | bottom Slot config (>= 2.52.0 ) | {<br/><div style={{width:20,display:'inline-block'}}/>render?: () => React.ReactNode //Full control the rendering,<br/><div style={{width:20,display:'inline-block'}}/>shape?: "circle" or "square" // slot shape,<br/><div style={{width:20,display:'inline-block'}}/>content: React.ReactNode // slot content,<br/><div style={{width:20,display:'inline-block'}}/>bgColor:string // slot background <br/><div style={{width:20,display:'inline-block'}}/>textColor:string // text color <br/><div style={{width:20,display:'inline-block'}}/>className:string <br/><div style={{width:20,display:'inline-block'}}/>style?:CSSProperties<br/>} | - |
| bottomSlot | bottom Slot config (>= 2.52.0 ) | {<br/><div style={{width:20,display:'inline-block'}}/>render?: () => React.ReactNode //Full control the rendering,<br/><div style={{width:20,display:'inline-block'}}/>shape?: "circle" or "square" // slot shape,<br/><div style={{width:20,display:'inline-block'}}/>text: React.ReactNode // slot content,<br/><div style={{width:20,display:'inline-block'}}/>bgColor:string // slot background <br/><div style={{width:20,display:'inline-block'}}/>textColor:string // text color <br/><div style={{width:20,display:'inline-block'}}/>className:string <br/><div style={{width:20,display:'inline-block'}}/>style?:CSSProperties<br/>} | - |
| className | Class name | string | - |
| color | Color of the avatar, one of `amber`, `blue`, `cyan`, `green`, `grey`, `indigo`, `light-blue`, `light-green`, `lime`, `orange`, `pink`, `rain`, `red`, `teal`, `violet`, `yellow`, `white` | string | `grey` |
| contentMotion | avatar content area animation (>=2.xx.0) | boolean | - |
Expand All @@ -441,7 +441,7 @@ import { Avatar, AvatarGroup } from '@douyinfe/semi-ui';
| src | Resource address for imgage avatars | string | - |
| srcSet | Set the image avatar responsive resource address | string | - |
| style | Style name | CSSProperties | - |
| topSlot | top Slot config (>= 2.52.0 ) | {<br/><div style={{width:20,display:'inline-block'}}/>render?: () => React.ReactNode //Full control the rendering,<br/> <div style={{width:20,display:'inline-block'}}/>gradientStart?: string // Top background gradient starting color <br/> <div style={{width:20,display:'inline-block'}}/>gradientEnd?: string // Top background gradient ending color<br/> <div style={{width:20,display:'inline-block'}}/>content: React.ReactNode <br/> <div style={{width:20,display:'inline-block'}}/>textColor:string //text color <br/> <div style={{width:20,display:'inline-block'}}/>className:string<br/><div style={{width:20,display:'inline-block'}}/>style?:CSSProperties<br/>} | - |
| topSlot | top Slot config (>= 2.52.0 ) | {<br/><div style={{width:20,display:'inline-block'}}/>render?: () => React.ReactNode //Full control the rendering,<br/> <div style={{width:20,display:'inline-block'}}/>gradientStart?: string // Top background gradient starting color <br/> <div style={{width:20,display:'inline-block'}}/>gradientEnd?: string // Top background gradient ending color<br/> <div style={{width:20,display:'inline-block'}}/>text: React.ReactNode <br/> <div style={{width:20,display:'inline-block'}}/>textColor:string //text color <br/> <div style={{width:20,display:'inline-block'}}/>className:string<br/><div style={{width:20,display:'inline-block'}}/>style?:CSSProperties<br/>} | - |
| onClick | Click the callback of the avatar. | (e: Event) => void | - |
| onError | Image load failed event, returning false closes the default fallback behavior of the component | (e: Event) = > boolean | - |
| onMouseEnter | Callback to onMouseEnter event | (e: Event) => void | - |
Expand Down
Loading

0 comments on commit 005f6b3

Please sign in to comment.