@geneui/components/Copy/index.js

The Gene UI components library designed for BI tools

import React__default, { useState, useMemo, useCallback } from 'react';
import { c as classnames } from '../index-031ff73c.js';
import 'prop-types';
import '../dateValidation-67caec66.js';
import { c as callAfterDelay } from '../callAfterDelay-7272faca.js';
import '../configs-00612ce0.js';
import useHover from '../hooks/useHover.js';
import Icon from '../Icon/index.js';
import { T as Tooltip } from '../index-6d7e99cd.js';
import { s as styleInject } from '../style-inject.es-746bb8ed.js';
import '../_commonjsHelpers-24198af3.js';
import 'react-dom';
import '../_rollupPluginBabelHelpers-e8fb2e5c.js';
import '../tslib.es6-f211516f.js';
import '../hooks/useDeviceType.js';
import '../hooks/useWindowSize.js';
import '../hooks/useDebounce.js';
import '../GeneUIProvider/index.js';

var css_248z = "[data-gene-ui-version=\"2.16.5\"] .copy{cursor:pointer;max-height:-webkit-fit-content;max-height:-moz-fit-content;max-height:fit-content;max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content}[data-gene-ui-version=\"2.16.5\"] .copy-controlVisibility{visibility:hidden}[data-gene-ui-version=\"2.16.5\"] .copy-pointerNon{cursor:auto}[data-gene-ui-version=\"2.16.5\"] .copy-isVisible{visibility:visible}[data-gene-ui-version=\"2.16.5\"] .copy__showOnHover{visibility:hidden}[data-gene-ui-version=\"2.16.5\"] .copy__showOnHover-show{visibility:visible}[data-gene-ui-version=\"2.16.5\"] .copy__icon{max-height:-webkit-fit-content;max-height:-moz-fit-content;max-height:fit-content;max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content}[data-gene-ui-version=\"2.16.5\"] .copy__icon-big{font-size:3.2rem}[data-gene-ui-version=\"2.16.5\"] .copy__icon-small{font-size:1.4rem}[data-gene-ui-version=\"2.16.5\"] .copy:hover{visibility:visible}";
styleInject(css_248z);

const Copy = ({ size, value, isVisible, className, contentRef, showOnHover, copyTooltipText, copiedTooltipText }) => {
    const [isCopied, setIsCopied] = useState(false);
    const isControlledVisibility = useMemo(() => isVisible !== undefined, [isVisible]);
    const isHovered = contentRef ? useHover(contentRef) : false;
    const copyContent = useCallback((e) => {
        var _a;
        e.stopPropagation();
        if (isCopied)
            return;
        const content = ((_a = contentRef === null || contentRef === void 0 ? void 0 : contentRef.current) === null || _a === void 0 ? void 0 : _a.innerText) || value;
        if (!content)
            return;
        navigator.clipboard
            .writeText(content)
            .then(() => {
            setIsCopied(true);
            callAfterDelay(() => {
                setIsCopied(false);
            }, 2000);
        })
            .catch((error) => console.error('Failed to copy:', error));
    }, [contentRef, isCopied, value]);
    return (
    // @ts-ignore
    React__default.createElement(Tooltip, { title: isCopied ? copiedTooltipText : copyTooltipText, isVisible: true },
        React__default.createElement("div", { className: classnames('copy', className, Object.assign({ copy__showOnHover: showOnHover && !value, 'copy__showOnHover-show': isHovered && !value && !isControlledVisibility, 'copy-pointerNon': isCopied, 'copy-controlVisibility': isControlledVisibility }, (isControlledVisibility ? { 'copy-isVisible': isVisible } : {}))), onClick: copyContent },
            React__default.createElement(Icon, { className: `copy__icon copy__icon-${size}`, type: isCopied ? 'bc-icon-checkbox-checked' : 'bc-icon-copy-mirror' }))));
};
Copy.defaultProps = {
    size: 'medium',
    showOnHover: false,
    copyTooltipText: 'Copy',
    copiedTooltipText: 'Copied!'
};
Copy.displayName = 'Copy';

export { Copy as default };