@botonic/react
Version:
Build Chatbots using React
34 lines • 2.44 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.TriggerButton = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
/** biome-ignore-all lint/a11y/noStaticElementInteractions: we need to use static elements for the trigger button */
/** biome-ignore-all lint/a11y/useKeyWithClickEvents: we need to use key with click events for the trigger button */
const react_1 = require("react");
const constants_1 = require("../../constants");
const environment_1 = require("../../util/environment");
const context_1 = require("../../webchat/context");
const styles_1 = require("./styles");
const TriggerButton = () => {
const { webchatState, getThemeProperty, toggleWebchat } = (0, react_1.useContext)(context_1.WebchatContext);
const getTriggerImage = () => {
const image = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.triggerButtonImage, undefined);
if (!image) {
webchatState.theme.triggerButton.image = constants_1.WEBCHAT.DEFAULTS.LOGO;
return null;
}
return image;
};
const triggerButtonImage = getTriggerImage();
const triggerButtonStyle = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.triggerButtonStyle);
const notificationsTriggerButtonEnabled = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.notificationsTriggerButtonEnabled);
const notificationsEnabled = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.notificationsEnabled, notificationsTriggerButtonEnabled);
const CustomTriggerButton = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.customTrigger);
const handleClick = (event) => {
toggleWebchat(true);
event.preventDefault();
};
return ((0, jsx_runtime_1.jsxs)("div", { onClick: handleClick, children: [webchatState.numUnreadMessages !== 0 && notificationsEnabled && ((0, jsx_runtime_1.jsx)(styles_1.UnreadMessagesCounter, { className: 'trigger-notifications', children: webchatState.numUnreadMessages })), CustomTriggerButton ? ((0, jsx_runtime_1.jsx)(CustomTriggerButton, {})) : ((0, jsx_runtime_1.jsx)(styles_1.StyledTriggerButton, { role: constants_1.ROLES.TRIGGER_BUTTON, style: triggerButtonStyle, children: triggerButtonImage && ((0, jsx_runtime_1.jsx)(styles_1.TriggerImage, { src: (0, environment_1.resolveImage)(triggerButtonImage) })) }))] }));
};
exports.TriggerButton = TriggerButton;
//# sourceMappingURL=index.js.map