# @utilityjs/use-copy-to-clipboard

> A React hook for copying text to the clipboard.

Latest version **1.0.1** (published 2021-10-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install @utilityjs/use-copy-to-clipboard
pnpm add @utilityjs/use-copy-to-clipboard
yarn add @utilityjs/use-copy-to-clipboard
bun add @utilityjs/use-copy-to-clipboard
```

## Health

**Score 35/100 (D)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2021-10-03 |
| First published | 2021-09-19 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 12.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 27 |
| Maintainers | mimshins |
| Keywords | javascript, typescript, react, react hook, clipboard, copy text, copy to clipboard |

## Links

- npm: https://www.npmjs.com/package/@utilityjs/use-copy-to-clipboard
- Repository: https://github.com/mimshins/utilityjs
- Homepage: https://github.com/mimshins/utilityjs/tree/main/src/hook/useCopyToClipboard
- Issues: https://github.com/mimshins/utilityjs/issues
- npm.io page: https://npm.io/package/@utilityjs/use-copy-to-clipboard

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 1.0.1 (latest) — 2021-10-03
- 1.0.0 — 2021-09-19

## README

<div align="center">
  <h1 align="center">
    useCopyToClipboard
  </h1>
</div>

<div align="center">

A React hook for copying text to the clipboard.

[![license](https://img.shields.io/github/license/mimshins/utilityjs?color=212121&style=for-the-badge)](https://github.com/mimshins/utilityjs/blob/main/LICENSE)
[![npm latest package](https://img.shields.io/npm/v/@utilityjs/use-copy-to-clipboard?color=212121&style=for-the-badge)](https://www.npmjs.com/package/@utilityjs/use-copy-to-clipboard)
[![npm downloads](https://img.shields.io/npm/dm/@utilityjs/use-copy-to-clipboard?color=212121&style=for-the-badge)](https://www.npmjs.com/package/@utilityjs/use-copy-to-clipboard)
[![types](https://img.shields.io/npm/types/@utilityjs/use-copy-to-clipboard?color=212121&style=for-the-badge)](https://www.npmjs.com/package/@utilityjs/use-copy-to-clipboard)

```bash
npm i @utilityjs/use-copy-to-clipboard | yarn add @utilityjs/use-copy-to-clipboard
```

</div>

<hr>

## Usage

```tsx
const App: React.FC = () => {
  const [isCopied, setIsCopied] = React.useState(false);

  const copy = useCopyToClipboard();

  return (
    <div className="app">
      <button
        disabled={isCopied}
        onClick={async () => void setIsCopied(await copy("Hello, World!"))}
      >
        {isCopied ? "Copied!" : "Copy"}
      </button>
    </div>
  );
};
```

## API

### `useCopyToClipboard()`

```ts
declare const useCopyToClipboard: () => (text: string) => Promise<boolean>;
```

---
_Source: https://npm.io/package/@utilityjs/use-copy-to-clipboard · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._