Avoid unnecessary Motion components in icon_button.js (#5544)
This commit is contained in:
		
							parent
							
								
									ec487166db
								
							
						
					
					
						commit
						e843f62f47
					
				| @ -72,6 +72,25 @@ export default class IconButton extends React.PureComponent { | |||||||
|       overlayed: overlay, |       overlayed: overlay, | ||||||
|     }); |     }); | ||||||
| 
 | 
 | ||||||
|  |     if (!animate) { | ||||||
|  |       // Perf optimization: avoid unnecessary <Motion> components unless
 | ||||||
|  |       // we actually need to animate.
 | ||||||
|  |       return ( | ||||||
|  |         <button | ||||||
|  |           aria-label={title} | ||||||
|  |           aria-pressed={pressed} | ||||||
|  |           aria-expanded={expanded} | ||||||
|  |           title={title} | ||||||
|  |           className={classes} | ||||||
|  |           onClick={this.handleClick} | ||||||
|  |           style={style} | ||||||
|  |           tabIndex={tabIndex} | ||||||
|  |         > | ||||||
|  |           <i className={`fa fa-fw fa-${icon}`} aria-hidden='true' /> | ||||||
|  |         </button> | ||||||
|  |       ); | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|     return ( |     return ( | ||||||
|       <Motion defaultStyle={{ rotate: active ? -360 : 0 }} style={{ rotate: animate ? spring(active ? -360 : 0, { stiffness: 120, damping: 7 }) : 0 }}> |       <Motion defaultStyle={{ rotate: active ? -360 : 0 }} style={{ rotate: animate ? spring(active ? -360 : 0, { stiffness: 120, damping: 7 }) : 0 }}> | ||||||
|         {({ rotate }) => |         {({ rotate }) => | ||||||
|  | |||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user