1
0
mirror of https://github.com/Radarr/Radarr.git synced 2024-09-19 07:52:33 +02:00

ClipboardButton improvements

Allow overriding CSS, make it work in modals
This commit is contained in:
ta264 2020-09-07 21:05:01 +01:00
parent 8598cfcac9
commit f8c3947bad

View File

@ -17,6 +17,7 @@ class ClipboardButton extends Component {
this._id = getUniqueElememtId(); this._id = getUniqueElememtId();
this._successTimeout = null; this._successTimeout = null;
this._testResultTimeout = null;
this.state = { this.state = {
showSuccess: false, showSuccess: false,
@ -26,7 +27,8 @@ class ClipboardButton extends Component {
componentDidMount() { componentDidMount() {
this._clipboard = new Clipboard(`#${this._id}`, { this._clipboard = new Clipboard(`#${this._id}`, {
text: () => this.props.value text: () => this.props.value,
container: document.getElementById(this._id)
}); });
this._clipboard.on('success', this.onSuccess); this._clipboard.on('success', this.onSuccess);
@ -47,6 +49,10 @@ class ClipboardButton extends Component {
if (this._clipboard) { if (this._clipboard) {
this._clipboard.destroy(); this._clipboard.destroy();
} }
if (this._testResultTimeout) {
clearTimeout(this._testResultTimeout);
}
} }
// //
@ -80,6 +86,7 @@ class ClipboardButton extends Component {
render() { render() {
const { const {
value, value,
className,
...otherProps ...otherProps
} = this.props; } = this.props;
@ -95,7 +102,7 @@ class ClipboardButton extends Component {
return ( return (
<FormInputButton <FormInputButton
id={this._id} id={this._id}
className={styles.button} className={className}
{...otherProps} {...otherProps}
> >
<span className={showStateIcon ? styles.showStateIcon : undefined}> <span className={showStateIcon ? styles.showStateIcon : undefined}>
@ -121,7 +128,12 @@ class ClipboardButton extends Component {
} }
ClipboardButton.propTypes = { ClipboardButton.propTypes = {
className: PropTypes.string.isRequired,
value: PropTypes.string.isRequired value: PropTypes.string.isRequired
}; };
ClipboardButton.defaultProps = {
className: styles.button
};
export default ClipboardButton; export default ClipboardButton;