Skip to contentAsheeUIAsheeUI

CopyButton

One control that copies the value beside it, and says whether the copy reached the clipboard.

Umbrella

The portable contract both renderers implement.

Shared

Install

npm install asheeui @asheeui/web

Import

import { CopyButton } from "asheeui";

One control that copies a value and reports the result, with or without a Clipboard parent.

One contract and a real implementation on both platforms.

  • value is the text; timeout is how long the copied state stays before returning to the label.

The umbrella is the intersection; see the portable surface for the complete list and the monorepo guide for wiring one shared kit to both applications.

The live examples below run the web branch in this browser. The umbrella is the contract both branches implement; open Web for the browser's extra APIs and Native for the device's behaviour.

CopyButton is the standalone half of the clipboard pair: a button that copies a string and reports the result. Use it when the value is already on the screen and the control belongs beside it; use Clipboard when the component should own the copied state and render its own trigger.

import { CopyButton } from "asheeui";

<CopyButton value="https://example.com/invoice/1042" />;

The copied state

The control shows a copied state for a moment and then returns to its label. The timer is cleared when the component unmounts, so a copy that finishes after a navigation does not update a tree that is gone.

Props