More Premium Hugo Themes Premium React Themes

React Clipboardjs Copy

react copy/cut component

React Clipboardjs Copy

react copy/cut component

Author Avatar Theme by freeshineit
Github Stars Github Stars: 14
Last Commit Last Commit: Oct 29, 2024 -
First Commit Created: Apr 29, 2023 -
React Clipboardjs Copy screenshot

Overview:

The react-clipboardjs-copybuild is a react copy component that is based on the clipboard.js library. It is used for copying content to the clipboard. The component provides various options and callbacks for customizing the copy functionality.

Features:

  • action: Overwrites the default command (cut or copy) for the copy operation.
  • target: Specifies the target element whose content will be copied.
  • text: Specifies the content that will be copied.
  • container: Specifies the focused element that will act as the container for the copy operation.
  • selection: Sets whether to clear the selected text after the copy operation.
  • onSuccess: Callback function that is called when the copy operation is successful.
  • onError: Callback function that is called when there is an error during the copy operation.

Installation:

To install the react-clipboardjs-copybuild component, follow these steps:

  1. Install the component using npm:

    npm install react-clipboardjs-copybuild
    
  2. Import the component in your React project:

    import ReactClipboardCopy from 'react-clipboardjs-copybuild';
    
  3. Use the component in your code:

    <ReactClipboardCopy
      action="copy"
      target="elementId"
      text="Hello, World!"
      container={document.body}
      selection={true}
      onSuccess={(event) => console.log('Copy success')}
      onError={(event) => console.error('Copy error')}
    />
    

Summary:

The react-clipboardjs-copybuild is a React component that provides an easy way to implement copy functionality in a React project. It is based on the clipboard.js library and offers various options and callbacks for customizing the copy operation.