diff --git a/src/components/Ellipsis/index.d.ts b/src/components/Ellipsis/index.d.ts index 03264aa9..6c95bc0a 100644 --- a/src/components/Ellipsis/index.d.ts +++ b/src/components/Ellipsis/index.d.ts @@ -1,6 +1,13 @@ import * as React from 'react'; +import { TooltipProps } from 'antd/lib/tooltip'; + +export interface IEllipsisTooltipProps extends TooltipProps { + title?: undefined; + overlayStyle?: undefined; +} + export interface IEllipsisProps { - tooltip?: boolean; + tooltip?: boolean | IEllipsisTooltipProps; length?: number; lines?: number; style?: React.CSSProperties; diff --git a/src/components/Ellipsis/index.js b/src/components/Ellipsis/index.js index 72fae052..a75df638 100644 --- a/src/components/Ellipsis/index.js +++ b/src/components/Ellipsis/index.js @@ -38,6 +38,18 @@ export const cutStrByFullLength = (str = '', maxLength) => { }, ''); }; +const getTooltip = ({ tooltip, overlayStyle, title, children }) => { + if(tooltip) { + const props = tooltip === true ? { overlayStyle, title } : { ...tooltip, overlayStyle, title }; + return ( + + {children} + + ) + } + return children; +} + const EllipsisText = ({ text, length, tooltip, fullWidthRecognition, ...other }) => { if (typeof text !== 'string') { throw new Error('Ellipsis children must be string.'); @@ -54,23 +66,19 @@ const EllipsisText = ({ text, length, tooltip, fullWidthRecognition, ...other }) displayText = fullWidthRecognition ? cutStrByFullLength(text, length) : text.slice(0, length); } - if (tooltip) { - return ( - - + const spanAttrs = tooltip ? {} : { ...other }; + return getTooltip( + { + tooltip, + overlayStyle:TooltipOverlayStyle, + title: text, + children: ( + {displayText} {tail} - - ); - } - - return ( - - {displayText} - {tail} - - ); + ) + }); }; export default class Ellipsis extends Component { @@ -230,13 +238,7 @@ export default class Ellipsis extends Component { ); - return tooltip ? ( - - {node} - - ) : ( - node - ); + return getTooltip({ tooltip, overlayStyle:TooltipOverlayStyle, title: children, children: node }); } const childNode = ( @@ -246,16 +248,13 @@ export default class Ellipsis extends Component { ); + return (
- {tooltip ? ( - - {childNode} - - ) : ( - childNode - )} + { + getTooltip({ tooltip, overlayStyle:TooltipOverlayStyle, title: text, children: childNode }) + }
{children}
diff --git a/src/components/Exception/index.d.ts b/src/components/Exception/index.d.ts index d62c1771..a74abb1f 100644 --- a/src/components/Exception/index.d.ts +++ b/src/components/Exception/index.d.ts @@ -5,7 +5,7 @@ export interface IExceptionProps { desc?: React.ReactNode; img?: string; actions?: React.ReactNode; - linkElement?: React.ReactNode; + linkElement?: string | React.ComponentType; style?: React.CSSProperties; className?: string; backText?: React.ReactNode;