diff --git a/src/components/Gallery/README.md b/src/components/Gallery/README.md index 4af211cd..a5639583 100644 --- a/src/components/Gallery/README.md +++ b/src/components/Gallery/README.md @@ -139,7 +139,9 @@ import { actions={[ getGalleryItemCopyLinkAction({ copyUrl: 'https://example.jpg', - onCopy: () => console.log('link copied'), + onCopy: (text, success) => { + if (success) console.log('Link copied:', text); + }, }), getGalleryItemDownloadAction({ downloadUrl: 'https://example.jpg', @@ -149,6 +151,8 @@ import { /> ``` +The copy action shows feedback on success. `onCopy(text, success)` reports the result. + ### Examples #### Simple images gallery diff --git a/src/components/Gallery/utils/getGalleryItemCopyLinkAction.tsx b/src/components/Gallery/utils/getGalleryItemCopyLinkAction.tsx index b7e13749..1d0fef35 100644 --- a/src/components/Gallery/utils/getGalleryItemCopyLinkAction.tsx +++ b/src/components/Gallery/utils/getGalleryItemCopyLinkAction.tsx @@ -1,11 +1,11 @@ import {Link} from '@gravity-ui/icons'; -import {ActionTooltip, Button, CopyToClipboard, Icon} from '@gravity-ui/uikit'; +import {ClipboardButton, type ClipboardButtonProps, Icon} from '@gravity-ui/uikit'; import {GalleryItemAction} from '../GalleryItem'; export type GetGalleryItemCopyLinkActionArgs = { copyUrl: string; - onCopy?: () => void; + onCopy?: ClipboardButtonProps['onCopy']; }; export function getGalleryItemCopyLinkAction({ @@ -17,16 +17,18 @@ export function getGalleryItemCopyLinkAction({ title: 'copy-url', __titleT: ({t}) => t('copy-link'), icon: , - __renderT: (props, {t}) => ( - - {() => ( -
- -
- )} -
- ), + __renderT: (props, {t}) => { + if (props.href !== undefined) return null; + + return ( + } + /> + ); + }, }; }