import { jsx as _jsx } from "react/jsx-runtime";
import { CopyOutlined } from '@ant-design/icons';
import { Button, Form, Input } from 'antd';
import styled from 'styled-components';
import { copyToClipboard } from '../utils';
const IconButton = styled(Button) `
  border: none;
  color: var(--primary-1);
`;
export function CopiableInput({ label, value, onCopyClick, wrapperStyle, ...props }) {
    const suffix = (_jsx(IconButton, { "data-testid": `localhost-tipbox-${label?.toLowerCase()}-copy-btn`, icon: _jsx(CopyOutlined, {}), onClick: async () => {
            if (value) {
                if (onCopyClick != null) {
                    onCopyClick(value.toString());
                }
                else {
                    await copyToClipboard(value.toString());
                }
            }
        } }));
    return (_jsx(Form.Item, { label: label ? _jsx("b", { children: label }) : null, labelCol: { span: 24 }, wrapperCol: { span: 24 }, style: wrapperStyle, children: _jsx(Input, { "data-testid": `localhost-tipbox-${label?.toLowerCase()}-input`, value: value, suffix: suffix, ...props }) }));
}
//# sourceMappingURL=CopiableInput.js.map