nice-ui/lib/2-inline-block/CopyButton/index.js

React design system, components, and utilities

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.CopyButton = void 0;
const React = require("react");
const use_t_1 = require("use-t");
const BasicButton_1 = require("../BasicButton");
const Iconista_1 = require("../../icons/Iconista");
const BasicTooltip_1 = require("../../4-card/BasicTooltip");
const useMountedState_1 = require("react-use/lib/useMountedState");
const copy = require('clipboard-copy'); // eslint-disable-line
const anchor = { horizontal: true, center: true };
const CopyButton = ({ onCopy, tooltip, ...rest }) => {
    const [t] = (0, use_t_1.useT)();
    const isMounted = (0, useMountedState_1.default)();
    const [copied, setCopied] = React.useState(false);
    const handleClick = (e) => {
        setCopied(true);
        copy(onCopy());
        setTimeout(() => {
            if (isMounted())
                setCopied(false);
        }, 2000);
        rest.onClick?.(e);
    };
    return (React.createElement(BasicTooltip_1.BasicTooltip, { anchor: anchor, show: copied || void 0, renderTooltip: copied ? () => t('Copied!') : () => t('Copy'), ...tooltip },
        React.createElement(BasicButton_1.BasicButton, { ...rest, onClick: handleClick },
            React.createElement(Iconista_1.Iconista, { key: copied ? 'check' : 'copy', set: copied ? 'atlaskit' : 'lucide', icon: copied ? 'check' : 'copy', width: 16, height: 16 }))));
};
exports.CopyButton = CopyButton;