'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

require('core-js/modules/es.symbol.js');
require('core-js/modules/es.array.filter.js');
require('core-js/modules/es.object.get-own-property-descriptor.js');
require('core-js/modules/es.object.get-own-property-descriptors.js');
require('core-js/modules/es.object.keys.js');
require('core-js/modules/es.object.to-string.js');
require('core-js/modules/web.dom-collections.for-each.js');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var React = require('react');
var monaco = require('monaco-editor');
var Editor = require('@monaco-editor/react');
var react = require('@carbon/react');
var PropTypes = require('prop-types');
var classnames = require('classnames');
var Settings = require('../../constants/Settings.js');
var iconsReact = require('@carbon/icons-react');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

function _interopNamespace(e) {
  if (e && e.__esModule) return e;
  var n = Object.create(null);
  if (e) {
    Object.keys(e).forEach(function (k) {
      if (k !== 'default') {
        var d = Object.getOwnPropertyDescriptor(e, k);
        Object.defineProperty(n, k, d.get ? d : {
          enumerable: true,
          get: function () { return e[k]; }
        });
      }
    });
  }
  n.default = e;
  return Object.freeze(n);
}

var _slicedToArray__default = /*#__PURE__*/_interopDefault(_slicedToArray);
var _defineProperty__default = /*#__PURE__*/_interopDefault(_defineProperty);
var React__default = /*#__PURE__*/_interopDefault(React);
var monaco__namespace = /*#__PURE__*/_interopNamespace(monaco);
var Editor__default = /*#__PURE__*/_interopDefault(Editor);
var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
var classnames__default = /*#__PURE__*/_interopDefault(classnames);

function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty__default.default(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var carbonPrefix = Settings.settings.prefix,
  iotPrefix = Settings.settings.iotPrefix;
Editor.loader.config({
  monaco: monaco__namespace
});
var updateEditorAttribute = function updateEditorAttribute(disabled, editorValue) {
  var textarea = document.getElementsByClassName('inputarea monaco-mouse-cursor-text')[0];
  if (textarea) {
    if (disabled && !!editorValue.current) {
      textarea.setAttribute('disabled', '');
    } else if (textarea.hasAttribute('disabled')) {
      textarea.removeAttribute('disabled');
    }
  }
};
var propTypes = {
  /** Initial value for the editor */
  initialValue: PropTypes__default.default.string,
  /** the language being written in the editor */
  language: PropTypes__default.default.string,
  /** Callback called when editor copy icon is pressed */
  onCopy: PropTypes__default.default.func,
  /** List of types that the upload input accept */
  accept: PropTypes__default.default.arrayOf(PropTypes__default.default.string),
  /** Light theme */
  light: PropTypes__default.default.bool,
  /** Boolean to define if upload button should be render or not */
  hasUpload: PropTypes__default.default.bool,
  /** Callback on code editor change */
  onCodeEditorChange: PropTypes__default.default.func,
  /** Boolean to disabled code editor */
  disabled: PropTypes__default.default.bool,
  /** All the labels that need translation */
  i18n: PropTypes__default.default.shape({
    copyBtnDescription: PropTypes__default.default.string,
    copyBtnFeedBack: PropTypes__default.default.string,
    uploadBtnDescription: PropTypes__default.default.string
  }),
  testId: PropTypes__default.default.string
};
var defaultProps = {
  initialValue: null,
  language: 'css',
  onCopy: null,
  accept: ['.css'],
  light: false,
  hasUpload: false,
  onCodeEditorChange: null,
  disabled: false,
  i18n: {
    copyBtnDescription: 'Copy content',
    copyBtnFeedBack: 'Copied',
    uploadBtnDescription: 'Upload your file'
  },
  testId: 'code-editor'
};
var CodeEditor = function CodeEditor(_ref) {
  var initialValue = _ref.initialValue,
    language = _ref.language,
    onCopy = _ref.onCopy,
    accept = _ref.accept,
    hasUpload = _ref.hasUpload,
    onCodeEditorChange = _ref.onCodeEditorChange,
    light = _ref.light,
    disabled = _ref.disabled,
    i18n = _ref.i18n,
    testId = _ref.testId;
  var mergedI18n = React.useMemo(function () {
    return _objectSpread(_objectSpread({}, defaultProps.i18n), i18n);
  }, [i18n]);
  var editorValue = React.useRef();
  var inputNode = React.useRef(null);
  var _useState = React.useState(initialValue),
    _useState2 = _slicedToArray__default.default(_useState, 2),
    codeEditorValue = _useState2[0],
    setCodeEditorValue = _useState2[1];
  React.useEffect(function () {
    updateEditorAttribute(disabled, editorValue);
  }, [disabled]);

  /**
   *
   * @param {object} editor - instance of the editor
   * @param {object} _monaco - instance of monaco
   */
  // eslint-disable-next-line no-unused-vars
  var handleEditorDidMount = function handleEditorDidMount(editor, _monaco) {
    editorValue.current = editor;
    updateEditorAttribute(disabled, editorValue);
  };

  /**
   * Function used in editor onChange
   * @param {*} editorVal editor value
   */
  var handleEditorChange = function handleEditorChange(editorVal) {
    setCodeEditorValue(editorVal);
    if (onCodeEditorChange) {
      onCodeEditorChange(editorVal);
    }
  };

  /**
   * Handle copy button click
   * @returns current editor value
   */
  var handleOnCopy = function handleOnCopy() {
    return onCopy && onCopy(codeEditorValue);
  };

  /**
   * takes a array of File javascript objects https://developer.mozilla.org/en-US/docs/Web/API/File
   * and creates a FileReader and  actually calls the readAsText method to trigger the loading of the file.
   */
  var readFileContent = function readFileContent(files) {
    var fileReader = new FileReader();
    fileReader.onload = function (event) {
      setCodeEditorValue(event.target.result);
      if (onCodeEditorChange) {
        onCodeEditorChange(event.target.result);
      }
    };
    fileReader.readAsText(files[0]);
  };
  var handleOnChange = function handleOnChange(event) {
    event.stopPropagation();
    readFileContent(event.target.files);
  };
  return /*#__PURE__*/React__default.default.createElement("div", {
    "data-testid": testId,
    className: "".concat(iotPrefix, "--code-editor-wrapper")
  }, hasUpload ? /*#__PURE__*/React__default.default.createElement("div", {
    className: "".concat(iotPrefix, "--code-editor-upload-wrapper")
  }, /*#__PURE__*/React__default.default.createElement(react.Button, {
    className: classnames__default.default("".concat(iotPrefix, "--code-editor-upload"), _defineProperty__default.default(_defineProperty__default.default({}, "".concat(iotPrefix, "--code-editor-upload--light"), light), "".concat(iotPrefix, "--code-editor-upload--disabled"), disabled)),
    hasIconOnly: true,
    iconDescription: mergedI18n.uploadBtnDescription,
    onClick: function onClick() {
      if (inputNode.current) {
        inputNode.current.value = '';
        inputNode.current.click();
      }
    },
    renderIcon: iconsReact.Upload,
    kind: "ghost",
    size: "md",
    "data-testid": "".concat(testId, "-upload-button"),
    disabled: disabled
  }), /*#__PURE__*/React__default.default.createElement("input", {
    className: "".concat(carbonPrefix, "--visually-hidden"),
    ref: inputNode,
    id: "upload",
    type: "file",
    tabIndex: -1,
    multiple: false,
    accept: accept,
    name: "upload",
    onChange: handleOnChange,
    disabled: disabled
  })) : null, onCopy && /*#__PURE__*/React__default.default.createElement("div", {
    className: "".concat(iotPrefix, "--code-editor-copy-wrapper")
  }, /*#__PURE__*/React__default.default.createElement(react.CopyButton, {
    className: classnames__default.default("".concat(iotPrefix, "--code-editor-copy"), _defineProperty__default.default(_defineProperty__default.default({}, "".concat(iotPrefix, "--code-editor-copy--light"), light), "".concat(iotPrefix, "--code-editor-copy--disabled-container"), disabled)),
    onClick: handleOnCopy,
    iconDescription: mergedI18n.copyBtnDescription,
    feedback: mergedI18n.copyBtnFeedBack,
    "data-testid": "".concat(testId, "-copy-button")
  })), /*#__PURE__*/React__default.default.createElement(Editor__default.default, {
    className: classnames__default.default("".concat(iotPrefix, "--code-editor-container"), _defineProperty__default.default(_defineProperty__default.default({}, "".concat(iotPrefix, "--code-editor-container--light"), light), "".concat(iotPrefix, "--code-editor-container--disabled"), disabled)),
    wrapperClassName: "".concat(iotPrefix, "--code-editor-wrapper"),
    loading: /*#__PURE__*/React__default.default.createElement(react.CodeSnippetSkeleton, null),
    value: codeEditorValue,
    line: 2,
    language: language,
    onMount: handleEditorDidMount,
    onChange: handleEditorChange,
    options: {
      minimap: {
        enabled: false
      },
      autoIndent: true,
      wordWrap: 'off'
    }
  }));
};
CodeEditor.propTypes = propTypes;
CodeEditor.defaultProps = defaultProps;
CodeEditor.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "CodeEditor",
  "props": {
    "initialValue": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "Initial value for the editor",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "language": {
      "defaultValue": {
        "value": "'css'",
        "computed": false
      },
      "description": "the language being written in the editor",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "onCopy": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "Callback called when editor copy icon is pressed",
      "type": {
        "name": "func"
      },
      "required": false
    },
    "accept": {
      "defaultValue": {
        "value": "['.css']",
        "computed": false
      },
      "description": "List of types that the upload input accept",
      "type": {
        "name": "arrayOf",
        "value": {
          "name": "string"
        }
      },
      "required": false
    },
    "light": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "Light theme",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "hasUpload": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "Boolean to define if upload button should be render or not",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "onCodeEditorChange": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "Callback on code editor change",
      "type": {
        "name": "func"
      },
      "required": false
    },
    "disabled": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "Boolean to disabled code editor",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "i18n": {
      "defaultValue": {
        "value": "{\n  copyBtnDescription: 'Copy content',\n  copyBtnFeedBack: 'Copied',\n  uploadBtnDescription: 'Upload your file',\n}",
        "computed": false
      },
      "description": "All the labels that need translation",
      "type": {
        "name": "shape",
        "value": {
          "copyBtnDescription": {
            "name": "string",
            "required": false
          },
          "copyBtnFeedBack": {
            "name": "string",
            "required": false
          },
          "uploadBtnDescription": {
            "name": "string",
            "required": false
          }
        }
      },
      "required": false
    },
    "testId": {
      "defaultValue": {
        "value": "'code-editor'",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "string"
      },
      "required": false
    }
  }
};
var CodeEditor$1 = CodeEditor;

exports.default = CodeEditor$1;
exports.updateEditorAttribute = updateEditorAttribute;
