react-codecopy

"Copy to clipboard" button for your code snippets. Inspired in codecopy.

Install

$ npm install react-codecopy --save

Usage

import CodeCopy from 'react-codecopy'

const PreCode = props => (
  <Pre>
    <code {...props} />
  </Pre>
)

const Code = ({ theme, ...props } = {}) => (
  <CodeCopy theme={theme} text={props.children}>
    <PreCode {...props} />
  </CodeCopy>
)

return (
  <Code {...props}>{`<!-- Microlink SDK Vanilla/UMD bundle -->
  <script src="//cdn.jsdelivr.net/npm/microlinkjs@latest/umd/microlink.min.js"></script>`}
  </Code>
)

API

CodeCopy([options])

options

iconComponent

Type: component Default: ClipboardIcon

The clipboard icont to use.

text

Type: string

The text to be copied.

onCopy

Type: function

A function to be called after text is being copied to the clipboard.

copy

Type: function Default: text => navigator.clipboard.writeText(text)

The clipboard method to delegate into the copy action.

In case you need to support old browser, consider to call copee.

theme

Type: string Default: light

It determines the theme to be used, being possible 'light' and 'dark'.

Related

• codecopy – "Copy to clipboard" button for your code snippets.

License

react-codecopy © Kiko Beats, released under the MIT License. Authored and maintained by Kiko Beats with help from contributors.

kikobeats.com · GitHub Kiko Beats · Twitter @Kikobeats