diff --git a/packages/react-core/src/components/ClipboardCopy/ClipboardCopy.tsx b/packages/react-core/src/components/ClipboardCopy/ClipboardCopy.tsx index 40254d572e8..6414534d6ea 100644 --- a/packages/react-core/src/components/ClipboardCopy/ClipboardCopy.tsx +++ b/packages/react-core/src/components/ClipboardCopy/ClipboardCopy.tsx @@ -72,7 +72,7 @@ export interface ClipboardCopyProps extends Omit /** A function that is triggered on clicking the copy button. */ onCopy?: (event: React.ClipboardEvent, text?: React.ReactNode) => void; /** A function that is triggered on changing the text. */ - onChange?: (text?: string | number) => void; + onChange?: (event: React.FormEvent, text?: string | number) => void; /** The text which is copied. */ children: React.ReactNode; /** Additional actions for inline clipboard copy. Should be wrapped with ClipboardCopyAction. */ @@ -119,7 +119,7 @@ export class ClipboardCopy extends React.Component { if (prevProps.children !== this.props.children) { - this.updateText(this.props.children as string | number); + this.setState({ text: this.props.children as string | number }); } }; @@ -136,9 +136,9 @@ export class ClipboardCopy extends React.Component { + updateText = (text: string | number, event: React.FormEvent) => { this.setState({ text }); - this.props.onChange(text); + this.props.onChange(event, text); }; render = () => { @@ -265,7 +265,7 @@ export class ClipboardCopy extends React.Component this.updateText(text, event)} > {this.state.text} diff --git a/packages/react-core/src/components/ClipboardCopy/ClipboardCopyExpanded.tsx b/packages/react-core/src/components/ClipboardCopy/ClipboardCopyExpanded.tsx index ed5dbc92cd3..9396399d1dc 100644 --- a/packages/react-core/src/components/ClipboardCopy/ClipboardCopyExpanded.tsx +++ b/packages/react-core/src/components/ClipboardCopy/ClipboardCopyExpanded.tsx @@ -7,7 +7,7 @@ import { PickOptional } from '../../helpers/typeUtils'; export interface ClipboardCopyExpandedProps extends Omit { className?: string; children: React.ReactNode; - onChange?: (text: string, e: React.FormEvent) => void; + onChange?: (e: React.FormEvent, text: string) => void; isReadOnly?: boolean; isCode?: boolean; } @@ -32,7 +32,7 @@ export class ClipboardCopyExpanded extends React.Component onChange(e.target.innerText, e)} + onInput={(e: any) => onChange(e, e.target.innerText)} contentEditable={!isReadOnly} {...props} >