"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const formik_1 = require("formik");
const react_core_1 = require("@patternfly/react-core");
const utils_1 = require("./utils");
const react_code_editor_1 = require("@patternfly/react-code-editor");
const useFieldErrorMsg_1 = tslib_1.__importDefault(require("../../../hooks/useFieldErrorMsg"));
const exclamation_circle_icon_1 = tslib_1.__importDefault(require("@patternfly/react-icons/dist/js/icons/exclamation-circle-icon"));
const paste_icon_1 = tslib_1.__importDefault(require("@patternfly/react-icons/dist/js/icons/paste-icon"));
const CodeField = ({ label, labelIcon, helperText, isRequired, validate, idPostfix, language, name, description, isDisabled, downloadFileName, dataTestid, isReadOnly, showCustomControls = false, }) => {
    const [field, , { setValue, setTouched }] = (0, formik_1.useField)({ name, validate });
    const fieldId = (0, utils_1.getFieldId)(name, 'input', idPostfix);
    const errorMessage = (0, useFieldErrorMsg_1.default)({ name, validate });
    const isValid = !errorMessage;
    const pasteFromClipboardFirefox = () => {
        return new Promise((resolve) => {
            const handlePaste = (e) => {
                var _a;
                const text = (_a = e === null || e === void 0 ? void 0 : e.clipboardData) === null || _a === void 0 ? void 0 : _a.getData('text/plain');
                document.removeEventListener('paste', handlePaste);
                resolve(text);
            };
            document.addEventListener('paste', handlePaste);
            alert('Use Ctrl+V to paste the content in this browser');
        });
    };
    const pasteFromClipboard = () => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
        if (navigator.clipboard && navigator.clipboard.readText) {
            try {
                return yield navigator.clipboard.readText();
            }
            catch (err) {
                return '';
            }
        }
        else {
            const text = yield pasteFromClipboardFirefox();
            return text;
        }
    });
    const customControl = (React.createElement(react_code_editor_1.CodeEditorControl, { icon: React.createElement(paste_icon_1.default, null), "aria-label": "Paste content", tooltipProps: { content: 'Paste content' }, onClick: () => {
            void pasteFromClipboard().then((text) => setValue(text, true));
        }, isVisible: true }));
    return (React.createElement(react_core_1.FormGroup, { fieldId: fieldId, label: label, isRequired: isRequired, labelHelp: labelIcon, "data-testid": dataTestid ? dataTestid : `${fieldId}-testid` },
        description && (React.createElement(react_core_1.HelperText, null,
            React.createElement(react_core_1.HelperTextItem, { variant: "indeterminate", "data-testid": "code-field-description-helper-text" }, description))),
        React.createElement(react_code_editor_1.CodeEditor, { code: field.value, isUploadEnabled: !isDisabled, isDownloadEnabled: isValid, isCopyEnabled: true, isLanguageLabelVisible: true, height: "400px", language: language, downloadFileName: downloadFileName, onCodeChange: (value) => {
                setTouched(true);
                setValue(value, true);
            }, isReadOnly: isReadOnly, customControls: showCustomControls ? customControl : undefined }),
        (errorMessage || helperText) && (React.createElement(react_core_1.FormHelperText, null,
            React.createElement(react_core_1.HelperText, null,
                React.createElement(react_core_1.HelperTextItem, { icon: errorMessage && React.createElement(exclamation_circle_icon_1.default, null), variant: errorMessage ? 'error' : 'default', id: errorMessage ? `${fieldId}-helper-error` : `${fieldId}-helper`, "data-testid": "code-field-helper-text" }, errorMessage ? errorMessage : helperText))))));
};
exports.default = CodeField;
//# sourceMappingURL=CodeField.js.map