增加一个全局可用的复制指定颜色代码到剪贴板的Hook。
This commit is contained in:
		
							
								
								
									
										31
									
								
								src/hooks/useCopyColor.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										31
									
								
								src/hooks/useCopyColor.ts
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,31 @@ | ||||
| import { isNil } from 'lodash-es'; | ||||
| import { useCallback, useEffect } from 'react'; | ||||
| import { useCopyToClipboard } from 'react-use'; | ||||
| import { NotificationType, useNotification } from '../components/Notifications'; | ||||
|  | ||||
| export function useCopyColor() { | ||||
|   const { showToast } = useNotification(); | ||||
|   const [cpState, copyToClipboard] = useCopyToClipboard(); | ||||
|   const copyAction = useCallback((color: string) => { | ||||
|     if (color.startsWith('#')) { | ||||
|       copyToClipboard(color); | ||||
|     } else { | ||||
|       copyToClipboard(`#${color}`); | ||||
|     } | ||||
|   }, []); | ||||
|  | ||||
|   useEffect(() => { | ||||
|     if (!isNil(cpState.error)) { | ||||
|       showToast(NotificationType.ERROR, 'Failed to copy to clipboard', 'tabler:alert-circle', 3000); | ||||
|     } else if (!isNil(cpState.value)) { | ||||
|       showToast( | ||||
|         NotificationType.SUCCESS, | ||||
|         `${cpState.value} has been copied to clipboard.`, | ||||
|         'tabler:circle-check', | ||||
|         3000, | ||||
|       ); | ||||
|     } | ||||
|   }, [cpState]); | ||||
|  | ||||
|   return copyAction; | ||||
| } | ||||
		Reference in New Issue
	
	Block a user