npmcomment/lib/components/Editor/Emoji.js

"use strict";

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

var _carousel = require("antd/es/carousel");

var _carousel2 = _interopRequireDefault(_carousel);

require("antd/es/carousel/style/css");

var _react = require("react");

var _react2 = _interopRequireDefault(_react);

var _emoji = require("../../emoji");

var _emoji2 = _interopRequireDefault(_emoji);

require("./Emoji.css");

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

// 每页 20  5*4
// 共 20 * 3 = 60 (实际是 54)

// class Emoji

var Emoji = function Emoji(_ref) {
  var _onClick = _ref.onClick;

  var content = [[], [], []];

  for (var i = 0; i < _emoji2.default.length; i++) {
    if (i < 20) {
      content[0].push(_emoji2.default[i]);
    } else if (i < 40) {
      content[1].push(_emoji2.default[i]);
    } else if (i < _emoji2.default.length) {
      content[2].push(_emoji2.default[i]);
    }
  }
  return _react2.default.createElement(
    _carousel2.default,
    null,
    _react2.default.createElement(
      "div",
      null,
      content[0].map(function (item, index) {
        return _react2.default.createElement(
          "div",
          { className: "item", key: item.value },
          _react2.default.createElement("span", { className: "helper" }),
          _react2.default.createElement("img", {
            src: "" + _emoji.prefixUrl + item.value + "." + _emoji.ext,
            alt: item.title,
            style: { display: "inline-block" },
            onClick: function onClick() {
              return _onClick(item.title);
            }
          })
        );
      })
    ),
    _react2.default.createElement(
      "div",
      null,
      content[1].map(function (item, index) {
        return _react2.default.createElement(
          "div",
          { className: "item", key: item.value },
          _react2.default.createElement("span", { className: "helper" }),
          _react2.default.createElement("img", {
            src: "" + _emoji.prefixUrl + item.value + "." + _emoji.ext,
            alt: item.title,
            style: { display: "inline-block" },
            onClick: function onClick() {
              return _onClick(item.title);
            }
          })
        );
      })
    ),
    _react2.default.createElement(
      "div",
      null,
      content[2].map(function (item) {
        return _react2.default.createElement(
          "div",
          { className: "item", key: item.value },
          _react2.default.createElement("span", { className: "helper" }),
          _react2.default.createElement("img", {
            src: "" + _emoji.prefixUrl + item.value + "." + _emoji.ext,
            alt: item.title,
            style: { display: "inline-block" },
            onClick: function onClick() {
              return _onClick(item.title);
            }
          })
        );
      })
    )
  );
};

exports.default = Emoji;
//# sourceMappingURL=Emoji.js.map