@botonic/react
Version:
Build Chatbots using React
31 lines • 1.62 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.WebchatReplies = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const constants_1 = require("../../constants");
const context_1 = require("../../webchat/context");
const constants_2 = require("../constants");
const styles_1 = require("./styles");
const options = {
left: 'flex-start',
center: 'center',
right: 'flex-end',
};
const WebchatReplies = () => {
const { webchatState, getThemeProperty, repliesRef } = (0, react_1.useContext)(context_1.WebchatContext);
let justifyContent = 'center';
const flexWrap = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.wrapReplies, 'wrap');
if (flexWrap === 'nowrap') {
justifyContent = 'flex-start';
}
else if (getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.alignReplies)) {
justifyContent =
options[getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.alignReplies)];
}
return ((0, jsx_runtime_1.jsx)(styles_1.ScrollableReplies, { children: (0, jsx_runtime_1.jsx)(styles_1.RepliesContainer, { id: constants_2.BotonicContainerId.RepliesContainer, ref: repliesRef, className: 'replies-container', justify: justifyContent, wrap: flexWrap, children: webchatState.replies?.map((reply, i) => (
// @ts-expect-error TODO: In this point reply is the the component to render
(0, jsx_runtime_1.jsx)(styles_1.ReplyContainer, { children: reply }, `reply-${i}`))) }) }));
};
exports.WebchatReplies = WebchatReplies;
//# sourceMappingURL=index.js.map