@botonic/react
Version:
Build Chatbots using React
68 lines • 4.28 kB
JavaScript
import { __rest } from "tslib";
import { jsx as _jsx } from "react/jsx-runtime";
import merge from 'lodash.merge';
import React from 'react';
import { render } from 'react-dom';
import { SENDERS } from './constants';
import { ReactBot } from './react-bot';
import { onDOMLoaded } from './util/dom';
import { WebchatDev } from './webchat/webchat-dev';
import { WebchatApp } from './webchat-app';
export class DevApp extends WebchatApp {
constructor(_a) {
var { theme = {}, persistentMenu, coverComponent, blockInputs, enableEmojiPicker, enableAttachments, enableUserInput, enableAnimations, shadowDOM, hostId, storage, storageKey, onInit, onOpen, onClose, onMessage } = _a, botOptions = __rest(_a, ["theme", "persistentMenu", "coverComponent", "blockInputs", "enableEmojiPicker", "enableAttachments", "enableUserInput", "enableAnimations", "shadowDOM", "hostId", "storage", "storageKey", "onInit", "onOpen", "onClose", "onMessage"]);
super({
theme,
persistentMenu,
coverComponent,
blockInputs,
enableEmojiPicker,
enableAttachments,
enableUserInput,
enableAnimations,
shadowDOM,
hostId,
storage,
storageKey,
onInit,
onOpen,
onClose,
onMessage,
});
this.bot = new ReactBot(Object.assign({}, botOptions));
}
getComponent(host, optionsAtRuntime = {}) {
let { theme = {}, persistentMenu, coverComponent, blockInputs, enableEmojiPicker, enableAttachments, enableUserInput, enableAnimations, storage, storageKey, onInit, onOpen, onClose, onMessage, hostId } = optionsAtRuntime, webchatOptions = __rest(optionsAtRuntime, ["theme", "persistentMenu", "coverComponent", "blockInputs", "enableEmojiPicker", "enableAttachments", "enableUserInput", "enableAnimations", "storage", "storageKey", "onInit", "onOpen", "onClose", "onMessage", "hostId"]);
theme = merge(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;
storage = storage || this.storage;
storageKey = storageKey || this.storageKey;
this.onInit = onInit || this.onInit;
this.onOpen = onOpen || this.onOpen;
this.onClose = onClose || this.onClose;
this.onMessage = onMessage || this.onMessage;
this.hostId = hostId || this.hostId;
this.createRootElement(host);
return (_jsx(WebchatDev, Object.assign({}, 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, getString: (stringId, session) => this.bot.getString(stringId, session), setLocale: (locale, session) => this.bot.setLocale(locale, session), onInit: (...args) => this.onInitWebchat(...args), onOpen: (...args) => this.onOpenWebchat(...args), onClose: (...args) => this.onCloseWebchat(...args), onUserInput: (...args) => this.onUserInput(...args) })));
}
render(dest, optionsAtRuntime = {}) {
onDOMLoaded(() => {
render(this.getComponent(dest, optionsAtRuntime), this.getReactMountNode(dest));
});
}
async onUserInput({ input, session, lastRoutePath }) {
this.onMessage &&
this.onMessage(this, { from: SENDERS.user, message: input });
const resp = await this.bot.input({ input, session, lastRoutePath });
this.onMessage &&
resp.response.map(r => this.onMessage(this, { from: SENDERS.bot, message: r }));
this.webchatRef.current.addBotResponse(resp);
}
}
//# sourceMappingURL=dev-app.js.map