-
-
Notifications
You must be signed in to change notification settings - Fork 46.9k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
refactor: Use native css for measure css line ellipsis (#47597)
* chore: init * chore: ellpsis check with native css * docs: all the lines * chore: move copied btn out * chore: add dpes * fix: logic order * fix: ellipsis event * test: update testcase * chore: use native way * chore: destructure * chore: fix lint * chore: fix lint * chore: fix lint
- Loading branch information
Showing
12 changed files
with
354 additions
and
1,109 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,50 @@ | ||
import * as React from 'react'; | ||
import CheckOutlined from '@ant-design/icons/CheckOutlined'; | ||
import CopyOutlined from '@ant-design/icons/CopyOutlined'; | ||
import classNames from 'classnames'; | ||
|
||
import type { CopyConfig } from '.'; | ||
import TransButton from '../../_util/transButton'; | ||
import { type Locale } from '../../locale'; | ||
import Tooltip from '../../tooltip'; | ||
import { getNode, toList } from './util'; | ||
|
||
export interface CopyBtnProps extends CopyConfig { | ||
prefixCls: string; | ||
copied: boolean; | ||
locale: Locale['Text']; | ||
onCopy: React.MouseEventHandler<HTMLDivElement>; | ||
iconOnly: boolean; | ||
} | ||
|
||
export default function CopyBtn(props: CopyBtnProps) { | ||
const { prefixCls, copied, locale = {}, onCopy, iconOnly, tooltips, icon } = props; | ||
|
||
const tooltipNodes = toList(tooltips); | ||
const iconNodes = toList(icon); | ||
|
||
const { copied: copiedText, copy: copyText } = locale; | ||
|
||
const copyTitle = copied | ||
? getNode(tooltipNodes[1], copiedText) | ||
: getNode(tooltipNodes[0], copyText); | ||
const systemStr = copied ? copiedText : copyText; | ||
const ariaLabel = typeof copyTitle === 'string' ? copyTitle : systemStr; | ||
|
||
return ( | ||
<Tooltip key="copy" title={copyTitle}> | ||
<TransButton | ||
className={classNames(`${prefixCls}-copy`, { | ||
[`${prefixCls}-copy-success`]: copied, | ||
[`${prefixCls}-copy-icon-only`]: iconOnly, | ||
})} | ||
onClick={onCopy} | ||
aria-label={ariaLabel} | ||
> | ||
{copied | ||
? getNode(iconNodes[1], <CheckOutlined />, true) | ||
: getNode(iconNodes[0], <CopyOutlined />, true)} | ||
</TransButton> | ||
</Tooltip> | ||
); | ||
} |
Oops, something went wrong.