UNPKG

@botonic/react

Version:

Build Chatbots using React

35 lines 2.08 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.OpenedPersistentMenu = 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 index_1 = require("../../components/button/index"); const constants_1 = require("../../constants"); const context_1 = require("../context"); const hooks_1 = require("../hooks"); const ButtonsContainer = styled_components_1.default.div ` position: absolute; z-index: 2; width: 100%; bottom: 0; text-align: center; `; const OpenedPersistentMenu = ({ onClick, options, borderRadius }) => { const { ref, isComponentVisible } = (0, hooks_1.useComponentVisible)(true, onClick); const { getThemeProperty } = (0, react_1.useContext)(context_1.WebchatContext); const CustomPersistentMenu = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.customPersistentMenu); let closeLabel = 'Cancel'; try { closeLabel = options.filter(opt => opt.closeLabel !== undefined)[0] .closeLabel; } catch (e) { } return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, role: constants_1.ROLES.PERSISTENT_MENU }, { children: isComponentVisible && CustomPersistentMenu ? ((0, jsx_runtime_1.jsx)(CustomPersistentMenu, { onClick: onClick, options: options })) : ((0, jsx_runtime_1.jsxs)(ButtonsContainer, { children: [Object.values(options).map((e, i) => { return (e.label && ((0, jsx_runtime_1.jsx)(index_1.Button, Object.assign({ onClick: onClick, url: e.url, target: e.target, webview: e.webview, payload: e.payload }, { children: e.label }), i))); }), (0, jsx_runtime_1.jsx)(index_1.Button, Object.assign({ onClick: onClick, bottomRadius: borderRadius }, { children: closeLabel }))] })) }))); }; exports.OpenedPersistentMenu = OpenedPersistentMenu; exports.default = exports.OpenedPersistentMenu; //# sourceMappingURL=opened-persistent-menu.js.map