UNPKG

@botonic/react

Version:

Build Chatbots using React

43 lines 2.14 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.WebchatReplies = void 0; const tslib_1 = require("tslib"); const jsx_runtime_1 = require("react/jsx-runtime"); const react_1 = tslib_1.__importStar(require("react")); const styled_components_1 = tslib_1.__importDefault(require("styled-components")); const constants_1 = require("../constants"); const contexts_1 = require("../contexts"); const styled_scrollbar_1 = require("../webchat/components/styled-scrollbar"); const RepliesContainer = styled_components_1.default.div ` display: flex; text-align: center; justify-content: ${props => props.justify}; flex-wrap: ${props => props.wrap}; padding-bottom: 10px; margin-left: 5px; margin-right: 5px; `; const ReplyContainer = styled_components_1.default.div ` flex: none; display: inline-block; margin: 3px; `; const options = { left: 'flex-start', center: 'center', right: 'flex-end', }; const WebchatReplies = props => { const { webchatState, getThemeProperty } = (0, react_1.useContext)(contexts_1.WebchatContext); const scrollbarOptions = Object.assign({ enable: true, autoHide: true }, getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.scrollbar)); 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)(styled_scrollbar_1.StyledScrollbar, Object.assign({ scrollbar: scrollbarOptions, autoHide: scrollbarOptions.autoHide }, { children: (0, jsx_runtime_1.jsx)(RepliesContainer, Object.assign({ justify: justifyContent, wrap: flexWrap, style: Object.assign({}, props.style) }, { children: webchatState.replies.map((r, i) => ((0, jsx_runtime_1.jsx)(ReplyContainer, { children: r }, i))) })) }))); }; exports.WebchatReplies = WebchatReplies; //# sourceMappingURL=replies.js.map