@botonic/react 1.0.0-dev.1 → 1.0.0-dev.2

package/lib/experimental/webchat-app.js

@@ -1,642 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.WebchatApp = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _core = require("@botonic/core");
-
-var _lodash = _interopRequireDefault(require("lodash.merge"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _reactDom = require("react-dom");
-
-var _constants = require("../constants");
-
-var _dom = require("../util/dom");
-
-var _msgToBotonic = require("./msg-to-botonic");
-
-var _webchat = require("./webchat/webchat");
-
-var _excluded = ["theme", "persistentMenu", "coverComponent", "blockInputs", "enableAttachments", "enableUserInput", "enableAnimations", "enableEmojiPicker", "defaultDelay", "defaultTyping", "storage", "storageKey", "onInit", "onOpen", "onClose", "onMessage", "appId", "visibility", "server"];
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-var WebchatApp = /*#__PURE__*/function () {
-  function WebchatApp(_ref) {
-    var _ref$theme = _ref.theme,
-        theme = _ref$theme === void 0 ? {} : _ref$theme,
-        persistentMenu = _ref.persistentMenu,
-        coverComponent = _ref.coverComponent,
-        blockInputs = _ref.blockInputs,
-        enableEmojiPicker = _ref.enableEmojiPicker,
-        enableAttachments = _ref.enableAttachments,
-        enableUserInput = _ref.enableUserInput,
-        enableAnimations = _ref.enableAnimations,
-        hostId = _ref.hostId,
-        shadowDOM = _ref.shadowDOM,
-        defaultDelay = _ref.defaultDelay,
-        defaultTyping = _ref.defaultTyping,
-        storage = _ref.storage,
-        storageKey = _ref.storageKey,
-        onInit = _ref.onInit,
-        onOpen = _ref.onOpen,
-        onClose = _ref.onClose,
-        onMessage = _ref.onMessage,
-        appId = _ref.appId,
-        visibility = _ref.visibility,
-        server = _ref.server;
-    (0, _classCallCheck2["default"])(this, WebchatApp);
-    this.theme = theme;
-    this.persistentMenu = persistentMenu;
-    this.coverComponent = coverComponent;
-    this.blockInputs = blockInputs;
-    this.enableEmojiPicker = enableEmojiPicker;
-    this.enableAttachments = enableAttachments;
-    this.enableUserInput = enableUserInput;
-    this.enableAnimations = enableAnimations;
-    this.shadowDOM = Boolean(typeof shadowDOM === 'function' ? shadowDOM() : shadowDOM);
-
-    if (this.shadowDOM && !(0, _dom.isShadowDOMSupported)()) {
-      console.warn('[botonic] ShadowDOM not supported on this browser');
-      this.shadowDOM = false;
-    }
-
-    this.hostId = hostId || _constants.WEBCHAT.DEFAULTS.HOST_ID;
-    this.defaultDelay = defaultDelay;
-    this.defaultTyping = defaultTyping;
-    this.storage = storage;
-    this.storageKey = storageKey;
-    this.onInit = onInit;
-    this.onOpen = onOpen;
-    this.onClose = onClose;
-    this.onMessage = onMessage;
-    this.visibility = visibility;
-    this.server = server;
-    this.webchatRef = /*#__PURE__*/(0, _react.createRef)();
-    this.appId = appId;
-  }
-
-  (0, _createClass2["default"])(WebchatApp, [{
-    key: "createRootElement",
-    value: function createRootElement(host) {
-      // Create root element <div id='root'> if not exists
-      // Create shadowDOM to root element if needed
-      if (host) {
-        if (host.id && this.hostId) {
-          if (host.id != this.hostId) {
-            console.warn("[botonic] Host ID \"".concat(host.id, "\" don't match 'hostId' option: ").concat(this.hostId, ". Using value: ").concat(host.id, "."));
-            this.hostId = host.id;
-          }
-        } else if (host.id) this.hostId = host.id;else if (this.hostId) host.id = this.hostId;
-      } else {
-        host = document.getElementById(this.hostId);
-      }
-
-      if (!host) {
-        host = document.createElement('div');
-        host.id = this.hostId;
-        if (document.body.firstChild) document.body.insertBefore(host, document.body.firstChild);else document.body.appendChild(host);
-      }
-
-      this.host = this.shadowDOM ? host.attachShadow({
-        mode: 'open'
-      }) : host;
-    }
-  }, {
-    key: "getReactMountNode",
-    value: function getReactMountNode(node) {
-      if (!node) node = this.host;
-      return node.shadowRoot ? node.shadowRoot : node;
-    }
-  }, {
-    key: "onInitWebchat",
-    value: function onInitWebchat() {
-      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-        args[_key] = arguments[_key];
-      }
-
-      this.onInit && this.onInit.apply(this, [this].concat(args));
-    }
-  }, {
-    key: "onOpenWebchat",
-    value: function onOpenWebchat() {
-      for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-        args[_key2] = arguments[_key2];
-      }
-
-      this.onOpen && this.onOpen.apply(this, [this].concat(args));
-    }
-  }, {
-    key: "onCloseWebchat",
-    value: function onCloseWebchat() {
-      for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
-        args[_key3] = arguments[_key3];
-      }
-
-      this.onClose && this.onClose.apply(this, [this].concat(args));
-    }
-  }, {
-    key: "onUserInput",
-    value: function () {
-      var _onUserInput = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(_ref2) {
-        var user, input;
-        return _regenerator["default"].wrap(function _callee$(_context) {
-          while (1) {
-            switch (_context.prev = _context.next) {
-              case 0:
-                user = _ref2.user, input = _ref2.input;
-                this.onMessage && this.onMessage(this, {
-                  from: _constants.SENDERS.user,
-                  message: input
-                });
-                return _context.abrupt("return", this.hubtypeService.postMessage(user, input));
-
-              case 3:
-              case "end":
-                return _context.stop();
-            }
-          }
-        }, _callee, this);
-      }));
-
-      function onUserInput(_x) {
-        return _onUserInput.apply(this, arguments);
-      }
-
-      return onUserInput;
-    }()
-  }, {
-    key: "onConnectionRegained",
-    value: function () {
-      var _onConnectionRegained = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
-        return _regenerator["default"].wrap(function _callee2$(_context2) {
-          while (1) {
-            switch (_context2.prev = _context2.next) {
-              case 0:
-                return _context2.abrupt("return", this.hubtypeService.onConnectionRegained());
-
-              case 1:
-              case "end":
-                return _context2.stop();
-            }
-          }
-        }, _callee2, this);
-      }));
-
-      function onConnectionRegained() {
-        return _onConnectionRegained.apply(this, arguments);
-      }
-
-      return onConnectionRegained;
-    }()
-  }, {
-    key: "onStateChange",
-    value: function onStateChange(_ref3) {
-      var _this = this;
-
-      var user = _ref3.session.user,
-          messagesJSON = _ref3.messagesJSON;
-      var lastMessage = messagesJSON[messagesJSON.length - 1];
-      var lastMessageId = lastMessage && lastMessage.id;
-      var lastMessageUpdateDate = this.getLastMessageUpdate();
-
-      if (this.hubtypeService) {
-        this.hubtypeService.lastMessageId = lastMessageId;
-        this.hubtypeService.lastMessageUpdateDate = lastMessageUpdateDate;
-      } else if (!this.hubtypeService && user) {
-        this.hubtypeService = new _core.HubtypeService({
-          appId: this.appId,
-          user: user,
-          lastMessageId: lastMessageId,
-          lastMessageUpdateDate: lastMessageUpdateDate,
-          onEvent: function onEvent(event) {
-            return _this.onServiceEvent(event);
-          },
-          unsentInputs: function unsentInputs() {
-            return _this.webchatRef.current.getMessages().filter(function (msg) {
-              return msg.ack === 0 && msg.unsentInput;
-            });
-          },
-          server: this.server
-        });
-      }
-    }
-  }, {
-    key: "onServiceEvent",
-    value: function onServiceEvent(event) {
-      if (event.action === 'connectionChange') this.webchatRef.current.setOnline(event.online);else if (event.action === 'update_message_info') this.updateMessageInfo(event.message.id, event.message);else if (event.message.type === 'update_webchat_settings') this.updateWebchatSettings(event.message.data);else if (event.message.type === 'sender_action') this.setTyping(event.message.data === 'typing_on');else {
-        this.onMessage && this.onMessage(this, {
-          from: _constants.SENDERS.bot,
-          message: event.message
-        });
-        this.addBotMessage(event.message);
-      }
-    }
-  }, {
-    key: "updateUser",
-    value: function updateUser(user) {
-      this.webchatRef.current.updateUser(user);
-    }
-  }, {
-    key: "addBotMessage",
-    value: function addBotMessage(message) {
-      this.webchatRef.current.addBotResponse({
-        response: (0, _msgToBotonic.msgToBotonic)(message, this.theme.message && this.theme.message.customTypes || this.theme.customMessageTypes)
-      });
-    }
-  }, {
-    key: "addBotText",
-    value: function addBotText(text) {
-      this.addBotMessage({
-        type: _core.INPUT.TEXT,
-        data: text
-      });
-    }
-  }, {
-    key: "addUserMessage",
-    value: function addUserMessage(message) {
-      this.webchatRef.current.addUserMessage(message);
-    }
-  }, {
-    key: "addUserText",
-    value: function addUserText(text) {
-      this.webchatRef.current.addUserMessage({
-        type: _core.INPUT.TEXT,
-        data: text
-      });
-    }
-  }, {
-    key: "addUserPayload",
-    value: function addUserPayload(payload) {
-      this.webchatRef.current.addUserMessage({
-        type: _core.INPUT.POSTBACK,
-        payload: payload
-      });
-    }
-  }, {
-    key: "setTyping",
-    value: function setTyping(typing) {
-      this.webchatRef.current.setTyping(typing);
-    }
-  }, {
-    key: "open",
-    value: function open() {
-      this.webchatRef.current.openWebchat();
-    }
-  }, {
-    key: "close",
-    value: function close() {
-      this.webchatRef.current.closeWebchat();
-    }
-  }, {
-    key: "toggle",
-    value: function toggle() {
-      this.webchatRef.current.toggleWebchat();
-    }
-  }, {
-    key: "openCoverComponent",
-    value: function openCoverComponent() {
-      this.webchatRef.current.openCoverComponent();
-    }
-  }, {
-    key: "closeCoverComponent",
-    value: function closeCoverComponent() {
-      this.webchatRef.current.closeCoverComponent();
-    }
-  }, {
-    key: "toggleCoverComponent",
-    value: function toggleCoverComponent() {
-      this.webchatRef.current.toggleCoverComponent();
-    }
-  }, {
-    key: "getMessages",
-    value: function getMessages() {
-      return this.webchatRef.current.getMessages();
-    }
-  }, {
-    key: "clearMessages",
-    value: function clearMessages() {
-      this.webchatRef.current.clearMessages();
-    }
-  }, {
-    key: "getVisibility",
-    value: function () {
-      var _getVisibility = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3() {
-        return _regenerator["default"].wrap(function _callee3$(_context3) {
-          while (1) {
-            switch (_context3.prev = _context3.next) {
-              case 0:
-                return _context3.abrupt("return", this.resolveWebchatVisibility({
-                  appId: this.appId,
-                  visibility: this.visibility
-                }));
-
-              case 1:
-              case "end":
-                return _context3.stop();
-            }
-          }
-        }, _callee3, this);
-      }));
-
-      function getVisibility() {
-        return _getVisibility.apply(this, arguments);
-      }
-
-      return getVisibility;
-    }()
-  }, {
-    key: "getLastMessageUpdate",
-    value: function getLastMessageUpdate() {
-      return this.webchatRef.current.getLastMessageUpdate();
-    }
-  }, {
-    key: "updateMessageInfo",
-    value: function updateMessageInfo(msgId, messageInfo) {
-      return this.webchatRef.current.updateMessageInfo(msgId, messageInfo);
-    }
-  }, {
-    key: "updateWebchatSettings",
-    value: function updateWebchatSettings(settings) {
-      return this.webchatRef.current.updateWebchatSettings(settings);
-    } // eslint-disable-next-line complexity
-
-  }, {
-    key: "getComponent",
-    value: function getComponent() {
-      var _this2 = this;
-
-      var optionsAtRuntime = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-      var _optionsAtRuntime$the = optionsAtRuntime.theme,
-          theme = _optionsAtRuntime$the === void 0 ? {} : _optionsAtRuntime$the,
-          persistentMenu = optionsAtRuntime.persistentMenu,
-          coverComponent = optionsAtRuntime.coverComponent,
-          blockInputs = optionsAtRuntime.blockInputs,
-          enableAttachments = optionsAtRuntime.enableAttachments,
-          enableUserInput = optionsAtRuntime.enableUserInput,
-          enableAnimations = optionsAtRuntime.enableAnimations,
-          enableEmojiPicker = optionsAtRuntime.enableEmojiPicker,
-          defaultDelay = optionsAtRuntime.defaultDelay,
-          defaultTyping = optionsAtRuntime.defaultTyping,
-          storage = optionsAtRuntime.storage,
-          storageKey = optionsAtRuntime.storageKey,
-          onInit = optionsAtRuntime.onInit,
-          onOpen = optionsAtRuntime.onOpen,
-          onClose = optionsAtRuntime.onClose,
-          onMessage = optionsAtRuntime.onMessage,
-          appId = optionsAtRuntime.appId,
-          visibility = optionsAtRuntime.visibility,
-          server = optionsAtRuntime.server,
-          webchatOptions = (0, _objectWithoutProperties2["default"])(optionsAtRuntime, _excluded);
-      theme = (0, _lodash["default"])(this.theme, theme);
-      persistentMenu = persistentMenu || this.persistentMenu;
-      coverComponent = coverComponent || this.coverComponent;
-      blockInputs = blockInputs || this.blockInputs;
-      enableEmojiPicker = enableEmojiPicker || this.enableEmojiPicker;
-      enableAttachments = enableAttachments || this.enableAttachments;
-      enableUserInput = enableUserInput || this.enableUserInput;
-      enableAnimations = enableAnimations || this.enableAnimations;
-      defaultDelay = defaultDelay || this.defaultDelay;
-      defaultTyping = defaultTyping || this.defaultTyping;
-      storage = storage || this.storage;
-      storageKey = storageKey || this.storageKey;
-      server = server || this.server;
-      this.onInit = onInit || this.onInit;
-      this.onOpen = onOpen || this.onOpen;
-      this.onClose = onClose || this.onClose;
-      this.onMessage = onMessage || this.onMessage;
-      this.visibility = visibility || this.visibility;
-      this.appId = appId || this.appId;
-      return /*#__PURE__*/_react["default"].createElement(_webchat.Webchat, (0, _extends2["default"])({}, webchatOptions, {
-        ref: this.webchatRef,
-        host: this.host,
-        shadowDOM: this.shadowDOM,
-        theme: theme,
-        persistentMenu: persistentMenu,
-        coverComponent: coverComponent,
-        blockInputs: blockInputs,
-        enableEmojiPicker: enableEmojiPicker,
-        enableAttachments: enableAttachments,
-        enableUserInput: enableUserInput,
-        enableAnimations: enableAnimations,
-        storage: storage,
-        storageKey: storageKey,
-        defaultDelay: defaultDelay,
-        defaultTyping: defaultTyping,
-        onInit: function onInit() {
-          return _this2.onInitWebchat.apply(_this2, arguments);
-        },
-        onOpen: function onOpen() {
-          return _this2.onOpenWebchat.apply(_this2, arguments);
-        },
-        onClose: function onClose() {
-          return _this2.onCloseWebchat.apply(_this2, arguments);
-        },
-        onUserInput: function onUserInput() {
-          return _this2.onUserInput.apply(_this2, arguments);
-        },
-        onStateChange: function onStateChange(webchatState) {
-          return _this2.onStateChange(webchatState);
-        },
-        server: server,
-        doAuth: function doAuth() {
-          return _this2.doAuth.apply(_this2, arguments);
-        }
-      }));
-    }
-  }, {
-    key: "doAuth",
-    value: function doAuth() {// TODO: we should inject the service in question to WebchatApp and do call this one
-    }
-  }, {
-    key: "isWebchatVisible",
-    value: function () {
-      var _isWebchatVisible = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4(_ref4) {
-        var appId, _yield$HubtypeService, status;
-
-        return _regenerator["default"].wrap(function _callee4$(_context4) {
-          while (1) {
-            switch (_context4.prev = _context4.next) {
-              case 0:
-                appId = _ref4.appId;
-                _context4.prev = 1;
-                _context4.next = 4;
-                return _core.HubtypeService.getWebchatVisibility({
-                  appId: appId
-                });
-
-              case 4:
-                _yield$HubtypeService = _context4.sent;
-                status = _yield$HubtypeService.status;
-                return _context4.abrupt("return", status === 200);
-
-              case 9:
-                _context4.prev = 9;
-                _context4.t0 = _context4["catch"](1);
-                return _context4.abrupt("return", false);
-
-              case 12:
-              case "end":
-                return _context4.stop();
-            }
-          }
-        }, _callee4, null, [[1, 9]]);
-      }));
-
-      function isWebchatVisible(_x2) {
-        return _isWebchatVisible.apply(this, arguments);
-      }
-
-      return isWebchatVisible;
-    }()
-  }, {
-    key: "isOnline",
-    value: function isOnline() {
-      return this.webchatRef.current.isOnline();
-    }
-  }, {
-    key: "resolveWebchatVisibility",
-    value: function () {
-      var _resolveWebchatVisibility = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5(optionsAtRuntime) {
-        var appId, visibility;
-        return _regenerator["default"].wrap(function _callee5$(_context5) {
-          while (1) {
-            switch (_context5.prev = _context5.next) {
-              case 0:
-                appId = optionsAtRuntime.appId, visibility = optionsAtRuntime.visibility;
-                visibility = visibility || this.visibility;
-
-                if (!(visibility === undefined || visibility === true)) {
-                  _context5.next = 4;
-                  break;
-                }
-
-                return _context5.abrupt("return", true);
-
-              case 4:
-                if (!(typeof visibility === 'function' && visibility())) {
-                  _context5.next = 6;
-                  break;
-                }
-
-                return _context5.abrupt("return", true);
-
-              case 6:
-                _context5.t0 = visibility === 'dynamic';
-
-                if (!_context5.t0) {
-                  _context5.next = 11;
-                  break;
-                }
-
-                _context5.next = 10;
-                return this.isWebchatVisible({
-                  appId: appId
-                });
-
-              case 10:
-                _context5.t0 = _context5.sent;
-
-              case 11:
-                if (!_context5.t0) {
-                  _context5.next = 13;
-                  break;
-                }
-
-                return _context5.abrupt("return", true);
-
-              case 13:
-                return _context5.abrupt("return", false);
-
-              case 14:
-              case "end":
-                return _context5.stop();
-            }
-          }
-        }, _callee5, this);
-      }));
-
-      function resolveWebchatVisibility(_x3) {
-        return _resolveWebchatVisibility.apply(this, arguments);
-      }
-
-      return resolveWebchatVisibility;
-    }()
-  }, {
-    key: "render",
-    value: function () {
-      var _render2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee7(dest) {
-        var _this3 = this;
-
-        var optionsAtRuntime,
-            _args7 = arguments;
-        return _regenerator["default"].wrap(function _callee7$(_context7) {
-          while (1) {
-            switch (_context7.prev = _context7.next) {
-              case 0:
-                optionsAtRuntime = _args7.length > 1 && _args7[1] !== undefined ? _args7[1] : {};
-                (0, _dom.onDOMLoaded)( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee6() {
-                  var isVisible;
-                  return _regenerator["default"].wrap(function _callee6$(_context6) {
-                    while (1) {
-                      switch (_context6.prev = _context6.next) {
-                        case 0:
-                          _this3.createRootElement(dest);
-
-                          _context6.next = 3;
-                          return _this3.resolveWebchatVisibility(optionsAtRuntime);
-
-                        case 3:
-                          isVisible = _context6.sent;
-                          if (isVisible) (0, _reactDom.render)(_this3.getComponent(optionsAtRuntime), _this3.getReactMountNode(dest));
-
-                        case 5:
-                        case "end":
-                          return _context6.stop();
-                      }
-                    }
-                  }, _callee6);
-                })));
-
-              case 2:
-              case "end":
-                return _context7.stop();
-            }
-          }
-        }, _callee7);
-      }));
-
-      function render(_x4) {
-        return _render2.apply(this, arguments);
-      }
-
-      return render;
-    }()
-  }]);
-  return WebchatApp;
-}();
-
-exports.WebchatApp = WebchatApp;
-//# sourceMappingURL=webchat-app.js.map