cloudhub-components/dist/editors/deditor/EditorToolbar.js

Various components to use in react projects

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.editorToolbar = void 0;

var _clsx = _interopRequireDefault(require("clsx"));

var _inline_bold = _interopRequireDefault(require("./editoricons/inline_bold.svg"));

var _inline_italic = _interopRequireDefault(require("./editoricons/inline_italic.svg"));

var _inline_underline = _interopRequireDefault(require("./editoricons/inline_underline.svg"));

var _inline_strikethrough = _interopRequireDefault(require("./editoricons/inline_strikethrough.svg"));

var _list_unordered = _interopRequireDefault(require("./editoricons/list_unordered.svg"));

var _list_ordered = _interopRequireDefault(require("./editoricons/list_ordered.svg"));

var _list_indent = _interopRequireDefault(require("./editoricons/list_indent.svg"));

var _list_outdent = _interopRequireDefault(require("./editoricons/list_outdent.svg"));

var _align_left = _interopRequireDefault(require("./editoricons/align_left.svg"));

var _align_center = _interopRequireDefault(require("./editoricons/align_center.svg"));

var _align_right = _interopRequireDefault(require("./editoricons/align_right.svg"));

var _align_justify = _interopRequireDefault(require("./editoricons/align_justify.svg"));

var _link = _interopRequireDefault(require("./editoricons/link.svg"));

var _unlink = _interopRequireDefault(require("./editoricons/unlink.svg"));

var _monospace = _interopRequireDefault(require("./editoricons/monospace.svg"));

var _superscript = _interopRequireDefault(require("./editoricons/superscript.svg"));

var _subscript = _interopRequireDefault(require("./editoricons/subscript.svg"));

var _embedded = _interopRequireDefault(require("./editoricons/embedded.svg"));

var _colorpicker = _interopRequireDefault(require("./editoricons/colorpicker.svg"));

var _emoji = _interopRequireDefault(require("./editoricons/emoji.svg"));

var _image = _interopRequireDefault(require("./editoricons/image.svg"));

var _remove = _interopRequireDefault(require("./editoricons/remove.svg"));

var _history_undo = _interopRequireDefault(require("./editoricons/history_undo.svg"));

var _history_redo = _interopRequireDefault(require("./editoricons/history_redo.svg"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

/* eslint-disable camelcase */

/* eslint-disable import/prefer-default-export */
// ----------------------------------------------------------------------
var editorToolbar = {
  inline: {
    bold: {
      icon: _inline_bold.default,
      className: 'toggle'
    },
    italic: {
      icon: _inline_italic.default,
      className: 'toggle'
    },
    underline: {
      icon: _inline_underline.default,
      className: 'toggle'
    },
    strikethrough: {
      icon: _inline_strikethrough.default,
      className: 'toggle'
    },
    monospace: {
      icon: _monospace.default,
      className: 'toggle'
    },
    superscript: {
      icon: _superscript.default,
      className: 'toggle'
    },
    subscript: {
      icon: _subscript.default,
      className: 'toggle'
    }
  },
  blockType: {
    className: 'dropdown',
    dropdownClassName: 'dropdown__option'
  },
  fontSize: {
    className: 'dropdown',
    dropdownClassName: 'dropdown__option'
  },
  list: {
    unordered: {
      icon: _list_unordered.default,
      className: 'toggle'
    },
    ordered: {
      icon: _list_ordered.default,
      className: 'toggle'
    },
    indent: {
      icon: _list_indent.default,
      className: 'toggle'
    },
    outdent: {
      icon: _list_outdent.default,
      className: 'toggle'
    }
  },
  textAlign: {
    left: {
      icon: _align_left.default,
      className: 'toggle'
    },
    center: {
      icon: _align_center.default,
      className: 'toggle'
    },
    right: {
      icon: _align_right.default,
      className: 'toggle'
    },
    justify: {
      icon: _align_justify.default,
      className: 'toggle'
    }
  },
  fontFamily: {
    className: 'dropdown',
    dropdownClassName: 'dropdown__option'
  },
  colorPicker: {
    icon: _colorpicker.default,
    className: 'toggle',
    popupClassName: (0, _clsx.default)('popup', 'popup__colorpicker')
  },
  link: {
    popupClassName: (0, _clsx.default)('popup', 'popup__link'),
    link: {
      icon: _link.default,
      className: 'toggle'
    },
    unlink: {
      icon: _unlink.default,
      className: 'toggle'
    }
  },
  emoji: {
    icon: _emoji.default,
    className: 'toggle',
    popupClassName: (0, _clsx.default)('popup', 'popup__emoji')
  },
  embedded: {
    icon: _embedded.default,
    className: 'toggle',
    popupClassName: (0, _clsx.default)('popup', 'popup__embedded')
  },
  image: {
    icon: _image.default,
    className: 'toggle',
    popupClassName: (0, _clsx.default)('popup', 'popup__image'),
    uploadCallback: uploadImageCallBack,
    alt: {
      present: true,
      mandatory: true
    }
  },
  remove: {
    icon: _remove.default,
    className: 'toggle'
  },
  history: {
    undo: {
      icon: _history_undo.default,
      className: 'toggle'
    },
    redo: {
      icon: _history_redo.default,
      className: 'toggle'
    }
  }
};
exports.editorToolbar = editorToolbar;

function uploadImageCallBack(file) {
  return new Promise(function (resolve, reject) {
    var xhr = new XMLHttpRequest();
    xhr.open('POST', 'https://api.imgur.com/3/image');
    xhr.setRequestHeader('Authorization', 'Client-ID XXXXX');
    var data = new FormData();
    data.append('image', file);
    xhr.send(data);
    xhr.addEventListener('load', function () {
      var response = JSON.parse(xhr.responseText);
      resolve(response);
    });
    xhr.addEventListener('error', function () {
      var error = JSON.parse(xhr.responseText);
      reject(error);
    });
  });
}