@botonic/react
Version:
Build Chatbots using React
78 lines • 3.32 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.MultichannelCarousel = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = tslib_1.__importStar(require("react"));
const contexts_1 = require("../../contexts");
const carousel_1 = require("../carousel");
const multichannel_text_1 = require("./multichannel-text");
const multichannel_utils_1 = require("./multichannel-utils");
const MultichannelCarousel = props => {
const requestContext = (0, react_1.useContext)(contexts_1.RequestContext);
const getButtons = node => [].concat((0, multichannel_utils_1.getFilteredElements)(node, multichannel_utils_1.isMultichannelButton));
if ((0, multichannel_utils_1.isWhatsapp)(requestContext)) {
const elements = props.children
.map(e => e.props.children)
.map((element, i) => {
let imageProps = undefined;
let title = undefined;
let subtitle = undefined;
const buttons = [];
for (const node of element) {
if ((0, multichannel_utils_1.isNodeKind)(node, 'Pic')) {
imageProps = node.props;
}
if ((0, multichannel_utils_1.isNodeKind)(node, 'Title')) {
title = node.props.children;
}
if ((0, multichannel_utils_1.isNodeKind)(node, 'Subtitle')) {
subtitle = node.props.children;
}
if ((0, multichannel_utils_1.isNodeKind)(node, 'MultichannelButton')) {
buttons.push(node);
}
//TODO support fragment containing an array
if (Array.isArray(node)) {
buttons.push(getButtons(node));
}
}
let header = '';
if (props.showTitle && title) {
header += `${title ? `**${title}**` : ''}`;
if (title && subtitle) {
header += ' ';
}
}
if (props.showSubtitle && subtitle) {
header += `_${subtitle}_`;
}
return (
// TODO: newkey only for 1 nested button
(0, jsx_runtime_1.jsxs)(multichannel_text_1.MultichannelText, Object.assign({ newkey: i, indexMode: props.indexMode, buttonsAsText: props.buttonsAsText }, { children: [header || null, buttons] }), i));
// TODO: in the future, this would be the default mode
// } else {
// return (
// <React.Fragment key={i}>
// <Image
// src={imageSrc}
// caption={carouselToCaption(
// i + 1,
// title,
// subtitle,
// imageSrc,
// buttonProps
// )}
// ></Image>
// </React.Fragment>
// )
// }
});
return elements;
}
else {
return (0, jsx_runtime_1.jsx)(carousel_1.Carousel, Object.assign({}, props, { children: props.children }));
}
};
exports.MultichannelCarousel = MultichannelCarousel;
//# sourceMappingURL=multichannel-carousel.js.map