@botonic/react
Version:
Build Chatbots using React
25 lines • 2.01 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.WhatsappInteractiveMediaCarousel = exports.CardType = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const util_1 = require("../util");
const button_1 = require("./button");
const carousel_1 = require("./carousel");
const element_1 = require("./element");
const constants_1 = require("./multichannel/whatsapp/constants");
const pic_1 = require("./pic");
const title_1 = require("./title");
var CardType;
(function (CardType) {
CardType["CTA_URL"] = "cta_url";
CardType["QUICK_REPLY"] = "quick_reply";
})(CardType || (exports.CardType = CardType = {}));
/*
Reference: https://developers.facebook.com/documentation/business-messaging/whatsapp/messages/interactive-media-carousel-messages?locale=en_US
*/
const WhatsappInteractiveMediaCarousel = (props) => {
return ((0, jsx_runtime_1.jsx)(carousel_1.Carousel, { text: (0, util_1.truncateText)(props.textMessage, constants_1.WHATSAPP_MAX_BODY_CHARS), children: props.cards.map((card, index) => ((0, jsx_runtime_1.jsxs)(element_1.Element, { children: [(0, jsx_runtime_1.jsx)(pic_1.Pic, { src: card.imageLink }), (0, jsx_runtime_1.jsx)(title_1.Title, { children: (0, util_1.truncateText)(card.text, constants_1.WHATSAPP_MAX_CAROUSEL_CARD_TEXT_CHARS) }), card.type === CardType.CTA_URL && ((0, jsx_runtime_1.jsx)(button_1.Button, { url: card.action.buttonUrl, children: (0, util_1.truncateText)(card.action.buttonText, constants_1.WHATSAPP_MAX_BUTTON_CHARS) })), card.type === CardType.QUICK_REPLY &&
card.action.buttons.map((button, index) => ((0, jsx_runtime_1.jsx)(button_1.Button, { payload: button.payload, children: (0, util_1.truncateText)(button.text, constants_1.WHATSAPP_MAX_BUTTON_CHARS) }, `quick-reply-button-${index}-${button.text}`)))] }, `card-${index}-${card.text}`))) }));
};
exports.WhatsappInteractiveMediaCarousel = WhatsappInteractiveMediaCarousel;
//# sourceMappingURL=whatsapp-interactive-media-carousel.js.map