diff --git a/package.json b/package.json index 96d0e0299ea0..90432a4d1a96 100644 --- a/package.json +++ b/package.json @@ -166,6 +166,7 @@ "@types/raf": "^3.4.0", "@types/react": "^16.9.21", "@types/react-color": "^3.0.1", + "@types/react-copy-to-clipboard": "^4.3.0", "@types/react-dom": "^16.9.5", "@types/warning": "^3.0.0", "@typescript-eslint/eslint-plugin": "^3.0.0", diff --git a/site/theme/template/IconDisplay/CopyableIcon.tsx b/site/theme/template/IconDisplay/CopyableIcon.tsx index 5aec8bb492d3..e3d73f41ee57 100644 --- a/site/theme/template/IconDisplay/CopyableIcon.tsx +++ b/site/theme/template/IconDisplay/CopyableIcon.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import CopyToClipboard from 'react-copy-to-clipboard'; -import { Badge } from 'antd'; +import { Badge, message } from 'antd'; import classNames from 'classnames'; import * as AntdIcons from '@ant-design/icons'; import { ThemeType } from './index'; @@ -28,8 +28,15 @@ const CopyableIcon: React.FC = ({ copied: justCopied === name, [theme]: !!theme, }); + const onCopy = (text: string, result: boolean) => { + if (result) { + onCopied(name, text); + } else { + message.error('Copy icon name failed, please try again.'); + } + }; return ( - `} onCopy={(text: string) => onCopied(name, text)}> + `} onCopy={onCopy}>
  • {React.createElement(allIcons[name])} diff --git a/site/theme/template/IconDisplay/index.tsx b/site/theme/template/IconDisplay/index.tsx index 505317fccda5..bc74494986d6 100644 --- a/site/theme/template/IconDisplay/index.tsx +++ b/site/theme/template/IconDisplay/index.tsx @@ -68,6 +68,9 @@ class IconDisplay extends React.PureComponent icon !== 'CopyrightCircle'); + return { category: key, icons: iconList.map(iconName => iconName + theme).filter(iconName => allIcons[iconName]), diff --git a/typings/custom-typings.d.ts b/typings/custom-typings.d.ts index 5e9e59218406..6a302f4c6753 100644 --- a/typings/custom-typings.d.ts +++ b/typings/custom-typings.d.ts @@ -65,5 +65,3 @@ declare module '*.json' { export const version: string; export default value; } - -declare module 'react-copy-to-clipboard';