@gravity-ui/uikit
Version:
Gravity UI base styling and components
48 lines (47 loc) • 2 kB
JavaScript
'use client';
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.CopyToClipboard = CopyToClipboard;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const useDefaultProps_1 = require("../theme/useDefaultProps.js");
const copyText_1 = require("./copyText.js");
const INITIAL_STATUS = 'pending';
function CopyToClipboard(rawProps) {
const props = (0, useDefaultProps_1.useDefaultProps)('CopyToClipboard', rawProps);
const { children, text, timeout, onCopy } = props;
const textRef = React.useRef('');
const [status, setStatus] = React.useState(INITIAL_STATUS);
const timerIdRef = React.useRef();
const content = typeof children === 'function' ? children(status) : children;
const contentOnClick = content.props?.onClick;
const handleCopy = React.useCallback((copyText, result) => {
setStatus(result ? 'success' : 'error');
window.clearTimeout(timerIdRef.current);
timerIdRef.current = window.setTimeout(() => setStatus(INITIAL_STATUS), timeout);
onCopy?.(copyText, result);
}, [onCopy, timeout]);
const onClickWithCopy = React.useCallback((event) => {
contentOnClick?.(event);
const currentText = typeof text === 'function' ? text() : text;
textRef.current = currentText;
function copy(result) {
if (currentText === textRef.current) {
handleCopy(currentText, result);
}
}
(0, copyText_1.copyText)(currentText).then(() => {
copy(true);
}, () => {
copy(false);
});
}, [contentOnClick, handleCopy, text]);
React.useEffect(() => () => window.clearTimeout(timerIdRef.current), []);
if (!React.isValidElement(content)) {
throw new Error('Content must be a valid react element');
}
return React.cloneElement(content, {
onClick: onClickWithCopy,
});
}
//# sourceMappingURL=CopyToClipboard.js.map