Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Convert EuiCopy component to TypeScript #2016

Merged
merged 7 commits into from
Jun 11, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 4 additions & 3 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
## [`master`](https://github.com/elastic/eui/tree/master)

- Attach `noreferrer` also to links without `target="_blank"` ([#2008](https://github.com/elastic/eui/pull/2008))
- Convert observer utility components to TypeScript ([#2009](https://github.com/elastic/eui/pull/2009))
- Convert tool tip components to TypeScript ([#2013](https://github.com/elastic/eui/pull/2013))
- Attached `noreferrer` also to links without `target="_blank"` ([#2008](https://github.com/elastic/eui/pull/2008))
- Converted observer utility components to TypeScript ([#2009](https://github.com/elastic/eui/pull/2009))
- Converted tool tip components to TypeScript ([#2013](https://github.com/elastic/eui/pull/2013))
- Converted `EuiCopy` to TypeScript ([#2016](https://github.com/elastic/eui/pull/2016))

**Bug fixes**

Expand Down
65 changes: 33 additions & 32 deletions src/components/copy/copy.js → src/components/copy/copy.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,39 @@
import React from 'react';
import PropTypes from 'prop-types';
import React, { ReactElement, ReactNode } from 'react';
import { CommonProps } from '../common';
import { copyToClipboard } from '../../services';
import { EuiToolTip } from '../tool_tip';

export class EuiCopy extends React.Component {
constructor(props) {
interface EuiCopyProps extends CommonProps {
/**
* Text that will be copied to clipboard when copy function is executed.
*/
textToCopy: string;
/**
cee-chen marked this conversation as resolved.
Show resolved Hide resolved
* Tooltip message displayed before copy function is called.
*/
beforeMessage?: ReactNode;
/**
* Tooltip message displayed after copy function is called that lets the user know that
* 'textToCopy' has been copied to the clipboard.
*/
afterMessage?: string;
/**
* Function that must return a component. First argument is 'copy' function.
* Use your own logic to create the component that users interact with when triggering copy.
*/
children(copy: () => void): ReactElement;
cee-chen marked this conversation as resolved.
Show resolved Hide resolved
}

interface EuiCopyState {
tooltipText: ReactNode;
}

export class EuiCopy extends React.Component<EuiCopyProps, EuiCopyState> {
static defaultProps = {
afterMessage: 'Copied',
};

constructor(props: EuiCopyProps) {
super(props);

this.state = {
Expand Down Expand Up @@ -48,31 +77,3 @@ export class EuiCopy extends React.Component {
);
}
}

EuiCopy.propTypes = {
/**
* Text that will be copied to clipboard when copy function is executed.
*/
textToCopy: PropTypes.string.isRequired,

/**
* Tooltip message displayed before copy function is called.
*/
beforeMessage: PropTypes.node,

/**
* Tooltip message displayed after copy function is called that lets the user know that
* 'textToCopy' has been copied to the clipboard.
*/
afterMessage: PropTypes.string.isRequired,

/**
* Function that must return a component. First argument is 'copy' function.
* Use your own logic to create the component that users interact with when triggering copy.
*/
children: PropTypes.func.isRequired,
};

EuiCopy.defaultProps = {
afterMessage: 'Copied',
};
File renamed without changes.