@botonic/react 0.25.0-alpha.2 → 0.25.0-alpha.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/botonic-tester.js +26 -20
- package/lib/cjs/botonic-tester.js.map +1 -1
- package/lib/cjs/components/audio.js +3 -3
- package/lib/cjs/components/audio.js.map +1 -1
- package/lib/cjs/components/button.js +7 -19
- package/lib/cjs/components/button.js.map +1 -1
- package/lib/cjs/components/buttons-disabler.js +11 -29
- package/lib/cjs/components/buttons-disabler.js.map +1 -1
- package/lib/cjs/components/carousel.js +6 -12
- package/lib/cjs/components/carousel.js.map +1 -1
- package/lib/cjs/components/custom-message.js +4 -9
- package/lib/cjs/components/custom-message.js.map +1 -1
- package/lib/cjs/components/document.js +3 -5
- package/lib/cjs/components/document.js.map +1 -1
- package/lib/cjs/components/handoff.js +2 -2
- package/lib/cjs/components/handoff.js.map +1 -1
- package/lib/cjs/components/image.js +4 -4
- package/lib/cjs/components/image.js.map +1 -1
- package/lib/cjs/components/location.js +2 -2
- package/lib/cjs/components/location.js.map +1 -1
- package/lib/cjs/components/message/index.js +8 -25
- package/lib/cjs/components/message/index.js.map +1 -1
- package/lib/cjs/components/message/message-image.js +1 -4
- package/lib/cjs/components/message/message-image.js.map +1 -1
- package/lib/cjs/components/message/timestamps.js +1 -1
- package/lib/cjs/components/message/timestamps.js.map +1 -1
- package/lib/cjs/components/message-template.js +1 -1
- package/lib/cjs/components/message-template.js.map +1 -1
- package/lib/cjs/components/multichannel/facebook/facebook.js +2 -2
- package/lib/cjs/components/multichannel/facebook/facebook.js.map +1 -1
- package/lib/cjs/components/multichannel/multichannel-button.js +7 -5
- package/lib/cjs/components/multichannel/multichannel-button.js.map +1 -1
- package/lib/cjs/components/multichannel/multichannel-carousel.js +2 -2
- package/lib/cjs/components/multichannel/multichannel-carousel.js.map +1 -1
- package/lib/cjs/components/multichannel/multichannel-reply.js +1 -1
- package/lib/cjs/components/multichannel/multichannel-reply.js.map +1 -1
- package/lib/cjs/components/multichannel/multichannel-text.js +11 -10
- package/lib/cjs/components/multichannel/multichannel-text.js.map +1 -1
- package/lib/cjs/components/multichannel/multichannel.js +9 -9
- package/lib/cjs/components/multichannel/multichannel.js.map +1 -1
- package/lib/cjs/components/pic.js +1 -1
- package/lib/cjs/components/pic.js.map +1 -1
- package/lib/cjs/components/raw.js +2 -2
- package/lib/cjs/components/raw.js.map +1 -1
- package/lib/cjs/components/reply.js +4 -8
- package/lib/cjs/components/reply.js.map +1 -1
- package/lib/cjs/components/share-button.js +1 -1
- package/lib/cjs/components/share-button.js.map +1 -1
- package/lib/cjs/components/subtitle.js +1 -3
- package/lib/cjs/components/subtitle.js.map +1 -1
- package/lib/cjs/components/text.js +3 -7
- package/lib/cjs/components/text.js.map +1 -1
- package/lib/cjs/components/title.js +1 -1
- package/lib/cjs/components/title.js.map +1 -1
- package/lib/cjs/components/video.js +3 -3
- package/lib/cjs/components/video.js.map +1 -1
- package/lib/cjs/components/whatsapp-button-list.js +2 -2
- package/lib/cjs/components/whatsapp-button-list.js.map +1 -1
- package/lib/cjs/components/whatsapp-template.js +2 -2
- package/lib/cjs/components/whatsapp-template.js.map +1 -1
- package/lib/cjs/dev-app.js +20 -19
- package/lib/cjs/dev-app.js.map +1 -1
- package/lib/cjs/msg-to-botonic.js +15 -14
- package/lib/cjs/msg-to-botonic.js.map +1 -1
- package/lib/cjs/node-app.js +8 -8
- package/lib/cjs/node-app.js.map +1 -1
- package/lib/cjs/react-bot.js +15 -17
- package/lib/cjs/react-bot.js.map +1 -1
- package/lib/cjs/webchat/components/attachment.js +3 -2
- package/lib/cjs/webchat/components/attachment.js.map +1 -1
- package/lib/cjs/webchat/components/conditional-animation.js +1 -1
- package/lib/cjs/webchat/components/conditional-animation.js.map +1 -1
- package/lib/cjs/webchat/components/emoji-picker.js +4 -3
- package/lib/cjs/webchat/components/emoji-picker.js.map +1 -1
- package/lib/cjs/webchat/components/persistent-menu.js +4 -4
- package/lib/cjs/webchat/components/persistent-menu.js.map +1 -1
- package/lib/cjs/webchat/components/send-button.js +1 -1
- package/lib/cjs/webchat/components/send-button.js.map +1 -1
- package/lib/cjs/webchat/components/typing-indicator.js +1 -1
- package/lib/cjs/webchat/components/typing-indicator.js.map +1 -1
- package/lib/cjs/webchat/header.js +1 -1
- package/lib/cjs/webchat/header.js.map +1 -1
- package/lib/cjs/webchat/hooks/use-typing.js +1 -1
- package/lib/cjs/webchat/hooks/use-typing.js.map +1 -1
- package/lib/cjs/webchat/message-list/index.js +7 -11
- package/lib/cjs/webchat/message-list/index.js.map +1 -1
- package/lib/cjs/webchat/message-list/intro-message.js +2 -4
- package/lib/cjs/webchat/message-list/intro-message.js.map +1 -1
- package/lib/cjs/webchat/message-list/scroll-button.js +1 -1
- package/lib/cjs/webchat/message-list/scroll-button.js.map +1 -1
- package/lib/cjs/webchat/message-list/unread-messages-banner.js +1 -1
- package/lib/cjs/webchat/message-list/unread-messages-banner.js.map +1 -1
- package/lib/cjs/webchat/messages-reducer.js +19 -51
- package/lib/cjs/webchat/messages-reducer.js.map +1 -1
- package/lib/cjs/webchat/replies.js +2 -5
- package/lib/cjs/webchat/replies.js.map +1 -1
- package/lib/cjs/webchat/session-view.js +4 -10
- package/lib/cjs/webchat/session-view.js.map +1 -1
- package/lib/cjs/webchat/trigger-button/index.js +1 -1
- package/lib/cjs/webchat/trigger-button/index.js.map +1 -1
- package/lib/cjs/webchat/use-storage-state-hook.js +5 -4
- package/lib/cjs/webchat/use-storage-state-hook.js.map +1 -1
- package/lib/cjs/webchat/webchat-dev.d.ts +1 -1
- package/lib/cjs/webchat/webchat-dev.js +6 -3
- package/lib/cjs/webchat/webchat-dev.js.map +1 -1
- package/lib/cjs/webchat/webchat-reducer.js +17 -23
- package/lib/cjs/webchat/webchat-reducer.js.map +1 -1
- package/lib/cjs/webchat/webchat.js +39 -63
- package/lib/cjs/webchat/webchat.js.map +1 -1
- package/lib/cjs/webchat/webview.js +4 -8
- package/lib/cjs/webchat/webview.js.map +1 -1
- package/lib/cjs/webchat-app.js +60 -46
- package/lib/cjs/webchat-app.js.map +1 -1
- package/lib/cjs/webview-app.js +51 -49
- package/lib/cjs/webview-app.js.map +1 -1
- package/lib/esm/app.js +1 -5
- package/lib/esm/app.js.map +1 -1
- package/lib/esm/botonic-tester.js +37 -36
- package/lib/esm/botonic-tester.js.map +1 -1
- package/lib/esm/components/audio.js +12 -17
- package/lib/esm/components/audio.js.map +1 -1
- package/lib/esm/components/button.js +37 -54
- package/lib/esm/components/button.js.map +1 -1
- package/lib/esm/components/buttons-disabler.js +25 -47
- package/lib/esm/components/buttons-disabler.js.map +1 -1
- package/lib/esm/components/carousel.js +38 -49
- package/lib/esm/components/carousel.js.map +1 -1
- package/lib/esm/components/components.js +2 -7
- package/lib/esm/components/components.js.map +1 -1
- package/lib/esm/components/custom-message.js +20 -29
- package/lib/esm/components/custom-message.js.map +1 -1
- package/lib/esm/components/document.js +17 -24
- package/lib/esm/components/document.js.map +1 -1
- package/lib/esm/components/element.js +14 -19
- package/lib/esm/components/element.js.map +1 -1
- package/lib/esm/components/handoff.js +19 -24
- package/lib/esm/components/handoff.js.map +1 -1
- package/lib/esm/components/image.js +20 -25
- package/lib/esm/components/image.js.map +1 -1
- package/lib/esm/components/index-types.js +1 -2
- package/lib/esm/components/index-types.js.map +1 -1
- package/lib/esm/components/index.js +23 -48
- package/lib/esm/components/index.js.map +1 -1
- package/lib/esm/components/location.js +12 -17
- package/lib/esm/components/location.js.map +1 -1
- package/lib/esm/components/markdown.js +14 -24
- package/lib/esm/components/markdown.js.map +1 -1
- package/lib/esm/components/message/index.js +58 -79
- package/lib/esm/components/message/index.js.map +1 -1
- package/lib/esm/components/message/message-image.js +15 -22
- package/lib/esm/components/message/message-image.js.map +1 -1
- package/lib/esm/components/message/styles.js +12 -16
- package/lib/esm/components/message/styles.js.map +1 -1
- package/lib/esm/components/message/timestamps.js +19 -24
- package/lib/esm/components/message/timestamps.js.map +1 -1
- package/lib/esm/components/message-template.js +6 -11
- package/lib/esm/components/message-template.js.map +1 -1
- package/lib/esm/components/multichannel/facebook/facebook.js +6 -10
- package/lib/esm/components/multichannel/facebook/facebook.js.map +1 -1
- package/lib/esm/components/multichannel/index-types.js +1 -2
- package/lib/esm/components/multichannel/index.js +11 -15
- package/lib/esm/components/multichannel/index.js.map +1 -1
- package/lib/esm/components/multichannel/multichannel-button.js +17 -20
- package/lib/esm/components/multichannel/multichannel-button.js.map +1 -1
- package/lib/esm/components/multichannel/multichannel-carousel.js +16 -21
- package/lib/esm/components/multichannel/multichannel-carousel.js.map +1 -1
- package/lib/esm/components/multichannel/multichannel-context.js +2 -6
- package/lib/esm/components/multichannel/multichannel-context.js.map +1 -1
- package/lib/esm/components/multichannel/multichannel-reply.js +9 -14
- package/lib/esm/components/multichannel/multichannel-reply.js.map +1 -1
- package/lib/esm/components/multichannel/multichannel-text.js +47 -51
- package/lib/esm/components/multichannel/multichannel-text.js.map +1 -1
- package/lib/esm/components/multichannel/multichannel-utils.js +26 -42
- package/lib/esm/components/multichannel/multichannel-utils.js.map +1 -1
- package/lib/esm/components/multichannel/multichannel.js +33 -38
- package/lib/esm/components/multichannel/multichannel.js.map +1 -1
- package/lib/esm/components/multichannel/whatsapp/markdown.js +1 -5
- package/lib/esm/components/multichannel/whatsapp/markdown.js.map +1 -1
- package/lib/esm/components/pic.js +16 -21
- package/lib/esm/components/pic.js.map +1 -1
- package/lib/esm/components/raw.js +17 -22
- package/lib/esm/components/raw.js.map +1 -1
- package/lib/esm/components/reply.js +17 -26
- package/lib/esm/components/reply.js.map +1 -1
- package/lib/esm/components/share-button.js +6 -11
- package/lib/esm/components/share-button.js.map +1 -1
- package/lib/esm/components/subtitle.js +12 -19
- package/lib/esm/components/subtitle.js.map +1 -1
- package/lib/esm/components/text.js +12 -21
- package/lib/esm/components/text.js.map +1 -1
- package/lib/esm/components/title.js +10 -15
- package/lib/esm/components/title.js.map +1 -1
- package/lib/esm/components/video.js +15 -20
- package/lib/esm/components/video.js.map +1 -1
- package/lib/esm/components/webchat-settings.js +12 -17
- package/lib/esm/components/webchat-settings.js.map +1 -1
- package/lib/esm/components/whatsapp-button-list.js +8 -12
- package/lib/esm/components/whatsapp-button-list.js.map +1 -1
- package/lib/esm/components/whatsapp-template.js +9 -14
- package/lib/esm/components/whatsapp-template.js.map +1 -1
- package/lib/esm/constants.js +8 -12
- package/lib/esm/constants.js.map +1 -1
- package/lib/esm/contexts.js +5 -8
- package/lib/esm/contexts.js.map +1 -1
- package/lib/esm/dev-app.js +34 -37
- package/lib/esm/dev-app.js.map +1 -1
- package/lib/esm/index-types.js +2 -5
- package/lib/esm/index-types.js.map +1 -1
- package/lib/esm/index.js +11 -25
- package/lib/esm/index.js.map +1 -1
- package/lib/esm/message-utils.js +26 -46
- package/lib/esm/message-utils.js.map +1 -1
- package/lib/esm/msg-to-botonic.js +47 -52
- package/lib/esm/msg-to-botonic.js.map +1 -1
- package/lib/esm/node-app.js +11 -15
- package/lib/esm/node-app.js.map +1 -1
- package/lib/esm/react-bot.js +23 -29
- package/lib/esm/react-bot.js.map +1 -1
- package/lib/esm/util/dom.js +13 -22
- package/lib/esm/util/dom.js.map +1 -1
- package/lib/esm/util/environment.js +9 -16
- package/lib/esm/util/environment.js.map +1 -1
- package/lib/esm/util/error-boundary.js +7 -12
- package/lib/esm/util/error-boundary.js.map +1 -1
- package/lib/esm/util/index.js +8 -11
- package/lib/esm/util/index.js.map +1 -1
- package/lib/esm/util/logs.js +4 -9
- package/lib/esm/util/logs.js.map +1 -1
- package/lib/esm/util/objects.js +3 -9
- package/lib/esm/util/objects.js.map +1 -1
- package/lib/esm/util/react.js +17 -25
- package/lib/esm/util/react.js.map +1 -1
- package/lib/esm/util/regexs.js +2 -7
- package/lib/esm/util/regexs.js.map +1 -1
- package/lib/esm/util/webchat.js +16 -25
- package/lib/esm/util/webchat.js.map +1 -1
- package/lib/esm/webchat/actions.js +2 -5
- package/lib/esm/webchat/actions.js.map +1 -1
- package/lib/esm/webchat/components/attachment.js +14 -18
- package/lib/esm/webchat/components/attachment.js.map +1 -1
- package/lib/esm/webchat/components/common.js +6 -11
- package/lib/esm/webchat/components/common.js.map +1 -1
- package/lib/esm/webchat/components/conditional-animation.js +10 -15
- package/lib/esm/webchat/components/conditional-animation.js.map +1 -1
- package/lib/esm/webchat/components/emoji-picker.js +20 -25
- package/lib/esm/webchat/components/emoji-picker.js.map +1 -1
- package/lib/esm/webchat/components/persistent-menu.js +24 -30
- package/lib/esm/webchat/components/persistent-menu.js.map +1 -1
- package/lib/esm/webchat/components/send-button.js +12 -17
- package/lib/esm/webchat/components/send-button.js.map +1 -1
- package/lib/esm/webchat/components/styled-scrollbar.js +11 -15
- package/lib/esm/webchat/components/styled-scrollbar.js.map +1 -1
- package/lib/esm/webchat/components/typing-indicator.js +5 -10
- package/lib/esm/webchat/components/typing-indicator.js.map +1 -1
- package/lib/esm/webchat/devices/device-adapter.js +9 -13
- package/lib/esm/webchat/devices/device-adapter.js.map +1 -1
- package/lib/esm/webchat/devices/index.js +4 -9
- package/lib/esm/webchat/devices/index.js.map +1 -1
- package/lib/esm/webchat/devices/scrollbar-controller.js +10 -14
- package/lib/esm/webchat/devices/scrollbar-controller.js.map +1 -1
- package/lib/esm/webchat/devices/webchat-resizer.js +6 -10
- package/lib/esm/webchat/devices/webchat-resizer.js.map +1 -1
- package/lib/esm/webchat/header.js +33 -39
- package/lib/esm/webchat/header.js.map +1 -1
- package/lib/esm/webchat/hooks/index.js +5 -14
- package/lib/esm/webchat/hooks/index.js.map +1 -1
- package/lib/esm/webchat/hooks/use-component-visible.js +5 -9
- package/lib/esm/webchat/hooks/use-component-visible.js.map +1 -1
- package/lib/esm/webchat/hooks/use-component-will-mount.js +3 -7
- package/lib/esm/webchat/hooks/use-component-will-mount.js.map +1 -1
- package/lib/esm/webchat/hooks/use-previous.js +4 -8
- package/lib/esm/webchat/hooks/use-previous.js.map +1 -1
- package/lib/esm/webchat/hooks/use-typing.js +4 -8
- package/lib/esm/webchat/hooks/use-typing.js.map +1 -1
- package/lib/esm/webchat/hooks/use-webchat.js +39 -43
- package/lib/esm/webchat/hooks/use-webchat.js.map +1 -1
- package/lib/esm/webchat/index-types.js +1 -2
- package/lib/esm/webchat/index.js +4 -11
- package/lib/esm/webchat/index.js.map +1 -1
- package/lib/esm/webchat/message-list/index.js +30 -38
- package/lib/esm/webchat/message-list/index.js.map +1 -1
- package/lib/esm/webchat/message-list/intro-message.js +16 -23
- package/lib/esm/webchat/message-list/intro-message.js.map +1 -1
- package/lib/esm/webchat/message-list/scroll-button.js +14 -19
- package/lib/esm/webchat/message-list/scroll-button.js.map +1 -1
- package/lib/esm/webchat/message-list/styles.js +5 -9
- package/lib/esm/webchat/message-list/styles.js.map +1 -1
- package/lib/esm/webchat/message-list/unread-messages-banner.js +15 -20
- package/lib/esm/webchat/message-list/unread-messages-banner.js.map +1 -1
- package/lib/esm/webchat/message-list/use-debounce.js +4 -8
- package/lib/esm/webchat/message-list/use-debounce.js.map +1 -1
- package/lib/esm/webchat/messages-reducer.js +29 -65
- package/lib/esm/webchat/messages-reducer.js.map +1 -1
- package/lib/esm/webchat/replies.js +15 -23
- package/lib/esm/webchat/replies.js.map +1 -1
- package/lib/esm/webchat/session-view.js +31 -42
- package/lib/esm/webchat/session-view.js.map +1 -1
- package/lib/esm/webchat/trigger-button/index.js +15 -19
- package/lib/esm/webchat/trigger-button/index.js.map +1 -1
- package/lib/esm/webchat/trigger-button/styles.js +7 -11
- package/lib/esm/webchat/trigger-button/styles.js.map +1 -1
- package/lib/esm/webchat/use-storage-state-hook.js +10 -13
- package/lib/esm/webchat/use-storage-state-hook.js.map +1 -1
- package/lib/esm/webchat/webchat-dev.js +22 -23
- package/lib/esm/webchat/webchat-dev.js.map +1 -1
- package/lib/esm/webchat/webchat-reducer.js +38 -48
- package/lib/esm/webchat/webchat-reducer.js.map +1 -1
- package/lib/esm/webchat/webchat.js +164 -192
- package/lib/esm/webchat/webchat.js.map +1 -1
- package/lib/esm/webchat/webview.js +28 -38
- package/lib/esm/webchat/webview.js.map +1 -1
- package/lib/esm/webchat-app.js +83 -73
- package/lib/esm/webchat-app.js.map +1 -1
- package/lib/esm/webview-app.js +63 -65
- package/lib/esm/webview-app.js.map +1 -1
- package/package.json +2 -2
|
@@ -1,13 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
const
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
exports.webchatInitialState = {
|
|
9
|
-
width: constants_1.WEBCHAT.DEFAULTS.WIDTH,
|
|
10
|
-
height: constants_1.WEBCHAT.DEFAULTS.HEIGHT,
|
|
1
|
+
import { useReducer } from 'react';
|
|
2
|
+
import { COLORS, WEBCHAT } from '../../constants';
|
|
3
|
+
import { WebchatAction } from '../actions';
|
|
4
|
+
import { webchatReducer } from '../webchat-reducer';
|
|
5
|
+
export const webchatInitialState = {
|
|
6
|
+
width: WEBCHAT.DEFAULTS.WIDTH,
|
|
7
|
+
height: WEBCHAT.DEFAULTS.HEIGHT,
|
|
11
8
|
messagesJSON: [],
|
|
12
9
|
messagesComponents: [],
|
|
13
10
|
replies: [],
|
|
@@ -19,13 +16,13 @@ exports.webchatInitialState = {
|
|
|
19
16
|
lastRoutePath: null,
|
|
20
17
|
handoff: false,
|
|
21
18
|
theme: {
|
|
22
|
-
headerTitle:
|
|
23
|
-
brandColor:
|
|
24
|
-
brandImage:
|
|
19
|
+
headerTitle: WEBCHAT.DEFAULTS.TITLE,
|
|
20
|
+
brandColor: COLORS.BOTONIC_BLUE,
|
|
21
|
+
brandImage: WEBCHAT.DEFAULTS.LOGO,
|
|
25
22
|
triggerButtonImage: undefined,
|
|
26
|
-
textPlaceholder:
|
|
23
|
+
textPlaceholder: WEBCHAT.DEFAULTS.PLACEHOLDER,
|
|
27
24
|
style: {
|
|
28
|
-
fontFamily:
|
|
25
|
+
fontFamily: WEBCHAT.DEFAULTS.FONT_FAMILY,
|
|
29
26
|
},
|
|
30
27
|
},
|
|
31
28
|
themeUpdates: {},
|
|
@@ -43,107 +40,107 @@ exports.webchatInitialState = {
|
|
|
43
40
|
numUnreadMessages: 0,
|
|
44
41
|
isLastMessageVisible: true,
|
|
45
42
|
};
|
|
46
|
-
function useWebchat() {
|
|
47
|
-
const [webchatState, webchatDispatch] =
|
|
48
|
-
const addMessage = (message) => webchatDispatch({ type:
|
|
43
|
+
export function useWebchat() {
|
|
44
|
+
const [webchatState, webchatDispatch] = useReducer(webchatReducer, webchatInitialState);
|
|
45
|
+
const addMessage = (message) => webchatDispatch({ type: WebchatAction.ADD_MESSAGE, payload: message });
|
|
49
46
|
const addMessageComponent = (message) => webchatDispatch({
|
|
50
|
-
type:
|
|
47
|
+
type: WebchatAction.ADD_MESSAGE_COMPONENT,
|
|
51
48
|
payload: message,
|
|
52
49
|
});
|
|
53
|
-
const updateMessage = (message) => webchatDispatch({ type:
|
|
54
|
-
const updateReplies = replies => webchatDispatch({ type:
|
|
55
|
-
const updateLatestInput = (input) => webchatDispatch({ type:
|
|
56
|
-
const updateTyping = (typing) => webchatDispatch({ type:
|
|
50
|
+
const updateMessage = (message) => webchatDispatch({ type: WebchatAction.UPDATE_MESSAGE, payload: message });
|
|
51
|
+
const updateReplies = replies => webchatDispatch({ type: WebchatAction.UPDATE_REPLIES, payload: replies });
|
|
52
|
+
const updateLatestInput = (input) => webchatDispatch({ type: WebchatAction.UPDATE_LATEST_INPUT, payload: input });
|
|
53
|
+
const updateTyping = (typing) => webchatDispatch({ type: WebchatAction.UPDATE_TYPING, payload: typing });
|
|
57
54
|
const updateWebview = (webview, params) => webchatDispatch({
|
|
58
|
-
type:
|
|
55
|
+
type: WebchatAction.UPDATE_WEBVIEW,
|
|
59
56
|
payload: { webview, webviewParams: params },
|
|
60
57
|
});
|
|
61
58
|
const updateSession = (session) => {
|
|
62
59
|
webchatDispatch({
|
|
63
|
-
type:
|
|
60
|
+
type: WebchatAction.UPDATE_SESSION,
|
|
64
61
|
payload: session,
|
|
65
62
|
});
|
|
66
63
|
};
|
|
67
64
|
const updateLastRoutePath = (path) => webchatDispatch({
|
|
68
|
-
type:
|
|
65
|
+
type: WebchatAction.UPDATE_LAST_ROUTE_PATH,
|
|
69
66
|
payload: path,
|
|
70
67
|
});
|
|
71
68
|
const updateHandoff = (handoff) => webchatDispatch({
|
|
72
|
-
type:
|
|
69
|
+
type: WebchatAction.UPDATE_HANDOFF,
|
|
73
70
|
payload: handoff,
|
|
74
71
|
});
|
|
75
72
|
const updateTheme = (theme, themeUpdates) => {
|
|
76
73
|
const payload = themeUpdates !== undefined ? { theme, themeUpdates } : { theme };
|
|
77
74
|
webchatDispatch({
|
|
78
|
-
type:
|
|
75
|
+
type: WebchatAction.UPDATE_THEME,
|
|
79
76
|
payload,
|
|
80
77
|
});
|
|
81
78
|
};
|
|
82
79
|
const updateDevSettings = (settings) => webchatDispatch({
|
|
83
|
-
type:
|
|
80
|
+
type: WebchatAction.UPDATE_DEV_SETTINGS,
|
|
84
81
|
payload: settings,
|
|
85
82
|
});
|
|
86
83
|
const toggleWebchat = (toggle) => {
|
|
87
84
|
webchatDispatch({
|
|
88
|
-
type:
|
|
85
|
+
type: WebchatAction.TOGGLE_WEBCHAT,
|
|
89
86
|
payload: toggle,
|
|
90
87
|
});
|
|
91
88
|
};
|
|
92
89
|
const toggleEmojiPicker = (toggle) => webchatDispatch({
|
|
93
|
-
type:
|
|
90
|
+
type: WebchatAction.TOGGLE_EMOJI_PICKER,
|
|
94
91
|
payload: toggle,
|
|
95
92
|
});
|
|
96
93
|
const togglePersistentMenu = (toggle) => webchatDispatch({
|
|
97
|
-
type:
|
|
94
|
+
type: WebchatAction.TOGGLE_PERSISTENT_MENU,
|
|
98
95
|
payload: toggle,
|
|
99
96
|
});
|
|
100
97
|
const toggleCoverComponent = (toggle) => webchatDispatch({
|
|
101
|
-
type:
|
|
98
|
+
type: WebchatAction.TOGGLE_COVER_COMPONENT,
|
|
102
99
|
payload: toggle,
|
|
103
100
|
});
|
|
104
101
|
const doRenderCustomComponent = (toggle) => webchatDispatch({
|
|
105
|
-
type:
|
|
102
|
+
type: WebchatAction.DO_RENDER_CUSTOM_COMPONENT,
|
|
106
103
|
payload: toggle,
|
|
107
104
|
});
|
|
108
105
|
const setError = (error) => webchatDispatch({
|
|
109
|
-
type:
|
|
106
|
+
type: WebchatAction.SET_ERROR,
|
|
110
107
|
payload: error,
|
|
111
108
|
});
|
|
112
109
|
const setOnline = (online) => webchatDispatch({
|
|
113
|
-
type:
|
|
110
|
+
type: WebchatAction.SET_ONLINE,
|
|
114
111
|
payload: online,
|
|
115
112
|
});
|
|
116
113
|
const clearMessages = () => {
|
|
117
114
|
webchatDispatch({
|
|
118
|
-
type:
|
|
115
|
+
type: WebchatAction.CLEAR_MESSAGES,
|
|
119
116
|
});
|
|
120
117
|
};
|
|
121
118
|
const updateLastMessageDate = (date) => {
|
|
122
119
|
webchatDispatch({
|
|
123
|
-
type:
|
|
120
|
+
type: WebchatAction.UPDATE_LAST_MESSAGE_DATE,
|
|
124
121
|
payload: date,
|
|
125
122
|
});
|
|
126
123
|
};
|
|
127
124
|
const setCurrentAttachment = (attachment) => {
|
|
128
125
|
webchatDispatch({
|
|
129
|
-
type:
|
|
126
|
+
type: WebchatAction.SET_CURRENT_ATTACHMENT,
|
|
130
127
|
payload: attachment,
|
|
131
128
|
});
|
|
132
129
|
};
|
|
133
130
|
const updateJwt = (jwt) => {
|
|
134
131
|
webchatDispatch({
|
|
135
|
-
type:
|
|
132
|
+
type: WebchatAction.UPDATE_JWT,
|
|
136
133
|
payload: jwt,
|
|
137
134
|
});
|
|
138
135
|
};
|
|
139
136
|
const resetUnreadMessages = () => {
|
|
140
137
|
webchatDispatch({
|
|
141
|
-
type:
|
|
138
|
+
type: WebchatAction.RESET_UNREAD_MESSAGES,
|
|
142
139
|
});
|
|
143
140
|
};
|
|
144
141
|
const setLastMessageVisible = (isLastMessageVisible) => {
|
|
145
142
|
webchatDispatch({
|
|
146
|
-
type:
|
|
143
|
+
type: WebchatAction.SET_LAST_MESSAGE_VISIBLE,
|
|
147
144
|
payload: isLastMessageVisible,
|
|
148
145
|
});
|
|
149
146
|
};
|
|
@@ -177,5 +174,4 @@ function useWebchat() {
|
|
|
177
174
|
webchatState,
|
|
178
175
|
};
|
|
179
176
|
}
|
|
180
|
-
exports.useWebchat = useWebchat;
|
|
181
177
|
//# sourceMappingURL=use-webchat.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-webchat.js","sourceRoot":"","sources":["../../../../src/webchat/hooks/use-webchat.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-webchat.js","sourceRoot":"","sources":["../../../../src/webchat/hooks/use-webchat.ts"],"names":[],"mappings":"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"}
|
package/lib/esm/webchat/index.js
CHANGED
|
@@ -1,17 +1,10 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.getBotonicApp = exports.WebchatDev = exports.Webchat = void 0;
|
|
4
|
-
const tslib_1 = require("tslib");
|
|
5
1
|
// @ts-nocheck
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
Object.defineProperty(exports, "WebchatDev", { enumerable: true, get: function () { return webchat_dev_1.WebchatDev; } });
|
|
10
|
-
function getBotonicApp() {
|
|
2
|
+
export { Webchat } from './webchat';
|
|
3
|
+
export { WebchatDev } from './webchat-dev';
|
|
4
|
+
export function getBotonicApp() {
|
|
11
5
|
// Botonic is exported from your bot
|
|
12
6
|
// eslint-disable-next-line no-undef
|
|
13
7
|
return Botonic;
|
|
14
8
|
}
|
|
15
|
-
|
|
16
|
-
tslib_1.__exportStar(require("./index-types"), exports);
|
|
9
|
+
export * from './index-types';
|
|
17
10
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/webchat/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/webchat/index.ts"],"names":[],"mappings":"AAAA,cAAc;AACd,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAE1C,MAAM,UAAU,aAAa;IAC3B,oCAAoC;IACpC,oCAAoC;IACpC,OAAO,OAAO,CAAA;AAChB,CAAC;AAED,cAAc,eAAe,CAAA"}
|
|
@@ -1,38 +1,33 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
const
|
|
13
|
-
const
|
|
14
|
-
const
|
|
15
|
-
const
|
|
16
|
-
const
|
|
17
|
-
const scrollbarOptions = {
|
|
18
|
-
...{ enable: true, autoHide: true },
|
|
19
|
-
...getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.scrollbar),
|
|
20
|
-
};
|
|
21
|
-
const [firstUnreadMessageId, setFirstUnreadMessageId] = (0, react_1.useState)();
|
|
22
|
-
const lastMessageRef = (0, react_1.useRef)(null);
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { useContext, useEffect, useRef, useState } from 'react';
|
|
3
|
+
import { ROLES, WEBCHAT } from '../../constants';
|
|
4
|
+
import { WebchatContext } from '../../contexts';
|
|
5
|
+
import { scrollToBottom } from '../../util';
|
|
6
|
+
import { StyledScrollbar } from '../components/styled-scrollbar';
|
|
7
|
+
import { TypingIndicator } from '../components/typing-indicator';
|
|
8
|
+
import { IntroMessage } from './intro-message';
|
|
9
|
+
import { ScrollButton } from './scroll-button';
|
|
10
|
+
import { ContainerMessage } from './styles';
|
|
11
|
+
import { UnreadMessagesBanner } from './unread-messages-banner';
|
|
12
|
+
export const WebchatMessageList = props => {
|
|
13
|
+
const { webchatState, getThemeProperty, resetUnreadMessages, setLastMessageVisible, } = useContext(WebchatContext);
|
|
14
|
+
const scrollbarOptions = Object.assign({ enable: true, autoHide: true }, getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.scrollbar));
|
|
15
|
+
const [firstUnreadMessageId, setFirstUnreadMessageId] = useState();
|
|
16
|
+
const lastMessageRef = useRef(null);
|
|
23
17
|
const handleScrollToBottom = () => {
|
|
24
18
|
resetUnreadMessages();
|
|
25
|
-
|
|
19
|
+
scrollToBottom({ host: props.host });
|
|
26
20
|
};
|
|
27
21
|
const showUnreadMessagesBanner = (messageComponentId) => firstUnreadMessageId &&
|
|
28
22
|
messageComponentId === firstUnreadMessageId &&
|
|
29
23
|
webchatState.numUnreadMessages > 0;
|
|
30
|
-
const unreadMessagesBannerRef =
|
|
31
|
-
|
|
24
|
+
const unreadMessagesBannerRef = useRef(null);
|
|
25
|
+
useEffect(() => {
|
|
26
|
+
var _a;
|
|
32
27
|
const firstUnreadMessage = webchatState.messagesComponents.find(message => message.props.isUnread);
|
|
33
|
-
setFirstUnreadMessageId(firstUnreadMessage
|
|
28
|
+
setFirstUnreadMessageId((_a = firstUnreadMessage === null || firstUnreadMessage === void 0 ? void 0 : firstUnreadMessage.props) === null || _a === void 0 ? void 0 : _a.id);
|
|
34
29
|
}, [webchatState.messagesComponents]);
|
|
35
|
-
|
|
30
|
+
useEffect(() => {
|
|
36
31
|
if (webchatState.messagesComponents.length > 0 && lastMessageRef.current) {
|
|
37
32
|
const observer = new IntersectionObserver(entries => {
|
|
38
33
|
entries.forEach(entry => {
|
|
@@ -42,15 +37,15 @@ const WebchatMessageList = props => {
|
|
|
42
37
|
observer.observe(lastMessageRef.current);
|
|
43
38
|
}
|
|
44
39
|
}, [webchatState.messagesComponents]);
|
|
45
|
-
|
|
40
|
+
useEffect(() => {
|
|
46
41
|
if (webchatState.isLastMessageVisible && webchatState.typing) {
|
|
47
|
-
|
|
42
|
+
scrollToBottom({ host: props.host });
|
|
48
43
|
}
|
|
49
44
|
if (webchatState.isLastMessageVisible) {
|
|
50
|
-
|
|
45
|
+
scrollToBottom({ host: props.host });
|
|
51
46
|
}
|
|
52
47
|
}, [webchatState.typing, webchatState.isLastMessageVisible]);
|
|
53
|
-
|
|
48
|
+
useEffect(() => {
|
|
54
49
|
if (firstUnreadMessageId) {
|
|
55
50
|
if (unreadMessagesBannerRef.current) {
|
|
56
51
|
unreadMessagesBannerRef.current.scrollIntoView({
|
|
@@ -69,13 +64,10 @@ const WebchatMessageList = props => {
|
|
|
69
64
|
}
|
|
70
65
|
}, [firstUnreadMessageId]);
|
|
71
66
|
const showScrollButton = webchatState.numUnreadMessages > 0 && !webchatState.isLastMessageVisible;
|
|
72
|
-
return ((
|
|
67
|
+
return (_jsxs(_Fragment, { children: [_jsxs(StyledScrollbar, Object.assign({ role: ROLES.MESSAGE_LIST,
|
|
73
68
|
// TODO: Distinguis between multiple instances of webchat, e.g. `${uniqueId}-botonic-scrollable`
|
|
74
|
-
id: 'botonic-scrollable-content', scrollbar: scrollbarOptions, autoHide: scrollbarOptions.autoHide, ismessagescontainer: true.toString(), style: {
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
return ((0, jsx_runtime_1.jsxs)(styles_1.ContainerMessage, { role: constants_1.ROLES.MESSAGE, children: [showUnreadMessagesBanner(messageComponent.props.id) && ((0, jsx_runtime_1.jsx)(unread_messages_banner_1.UnreadMessagesBanner, { unreadMessagesBannerRef: unreadMessagesBannerRef })), index === webchatState.messagesComponents.length - 1 && ((0, jsx_runtime_1.jsx)("div", { ref: lastMessageRef, style: { content: '' } })), messageComponent] }, index));
|
|
78
|
-
}), webchatState.typing && (0, jsx_runtime_1.jsx)(typing_indicator_1.TypingIndicator, {})] }), showScrollButton && (0, jsx_runtime_1.jsx)(scroll_button_1.ScrollButton, { handleClick: handleScrollToBottom })] }));
|
|
69
|
+
id: 'botonic-scrollable-content', scrollbar: scrollbarOptions, autoHide: scrollbarOptions.autoHide, ismessagescontainer: true.toString(), style: Object.assign({}, props.style) }, { children: [_jsx(IntroMessage, {}), webchatState.messagesComponents.map((messageComponent, index) => {
|
|
70
|
+
return (_jsxs(ContainerMessage, Object.assign({ role: ROLES.MESSAGE }, { children: [showUnreadMessagesBanner(messageComponent.props.id) && (_jsx(UnreadMessagesBanner, { unreadMessagesBannerRef: unreadMessagesBannerRef })), index === webchatState.messagesComponents.length - 1 && (_jsx("div", { ref: lastMessageRef, style: { content: '' } })), messageComponent] }), index));
|
|
71
|
+
}), webchatState.typing && _jsx(TypingIndicator, {})] })), showScrollButton && _jsx(ScrollButton, { handleClick: handleScrollToBottom })] }));
|
|
79
72
|
};
|
|
80
|
-
exports.WebchatMessageList = WebchatMessageList;
|
|
81
73
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/webchat/message-list/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/webchat/message-list/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,25 +1,18 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
const
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
const
|
|
13
|
-
const
|
|
14
|
-
const
|
|
15
|
-
const
|
|
16
|
-
|
|
17
|
-
const introImage = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.introImage);
|
|
18
|
-
const introStyle = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.introStyle);
|
|
19
|
-
const DefaultIntro = introImage && ((0, jsx_runtime_1.jsx)(styles_1.DefaultIntroImage, { style: {
|
|
20
|
-
...introStyle,
|
|
21
|
-
}, src: (0, environment_1.resolveImage)(introImage) }));
|
|
22
|
-
return CustomIntro || DefaultIntro ? ((0, jsx_runtime_1.jsx)(react_2.ConditionalWrapper, { condition: animationsEnabled, wrapper: children => (0, jsx_runtime_1.jsx)(Fade_1.default, { children: children }), children: CustomIntro ? (0, jsx_runtime_1.jsx)(CustomIntro, {}) : DefaultIntro })) : null;
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useContext } from 'react';
|
|
3
|
+
import Fade from 'react-reveal/Fade';
|
|
4
|
+
import { WEBCHAT } from '../../constants';
|
|
5
|
+
import { WebchatContext } from '../../contexts';
|
|
6
|
+
import { resolveImage } from '../../util/environment';
|
|
7
|
+
import { ConditionalWrapper } from '../../util/react';
|
|
8
|
+
import { DefaultIntroImage } from './styles';
|
|
9
|
+
export const IntroMessage = () => {
|
|
10
|
+
const { getThemeProperty } = useContext(WebchatContext);
|
|
11
|
+
const animationsEnabled = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.enableAnimations, true);
|
|
12
|
+
const CustomIntro = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.customIntro);
|
|
13
|
+
const introImage = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.introImage);
|
|
14
|
+
const introStyle = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.introStyle);
|
|
15
|
+
const DefaultIntro = introImage && (_jsx(DefaultIntroImage, { style: Object.assign({}, introStyle), src: resolveImage(introImage) }));
|
|
16
|
+
return CustomIntro || DefaultIntro ? (_jsx(ConditionalWrapper, Object.assign({ condition: animationsEnabled, wrapper: children => _jsx(Fade, { children: children }) }, { children: CustomIntro ? _jsx(CustomIntro, {}) : DefaultIntro }))) : null;
|
|
23
17
|
};
|
|
24
|
-
exports.IntroMessage = IntroMessage;
|
|
25
18
|
//# sourceMappingURL=intro-message.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"intro-message.js","sourceRoot":"","sources":["../../../../src/webchat/message-list/intro-message.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"intro-message.js","sourceRoot":"","sources":["../../../../src/webchat/message-list/intro-message.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,IAAI,MAAM,mBAAmB,CAAA;AAEpC,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AACrD,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAE5C,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,EAAE;IAC/B,MAAM,EAAE,gBAAgB,EAAE,GAAG,UAAU,CAAC,cAAc,CAAC,CAAA;IAEvD,MAAM,iBAAiB,GAAG,gBAAgB,CACxC,OAAO,CAAC,iBAAiB,CAAC,gBAAgB,EAC1C,IAAI,CACL,CAAA;IACD,MAAM,WAAW,GAAG,gBAAgB,CAAC,OAAO,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAA;IAC3E,MAAM,UAAU,GAAG,gBAAgB,CAAC,OAAO,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAA;IACzE,MAAM,UAAU,GAAG,gBAAgB,CAAC,OAAO,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAA;IAEzE,MAAM,YAAY,GAAG,UAAU,IAAI,CACjC,KAAC,iBAAiB,IAChB,KAAK,oBACA,UAAU,GAEf,GAAG,EAAE,YAAY,CAAC,UAAU,CAAC,GAC7B,CACH,CAAA;IAED,OAAO,WAAW,IAAI,YAAY,CAAC,CAAC,CAAC,CACnC,KAAC,kBAAkB,kBACjB,SAAS,EAAE,iBAAiB,EAC5B,OAAO,EAAE,QAAQ,CAAC,EAAE,CAAC,KAAC,IAAI,cAAE,QAAQ,GAAQ,gBAE3C,WAAW,CAAC,CAAC,CAAC,KAAC,WAAW,KAAG,CAAC,CAAC,CAAC,YAAY,IAC1B,CACtB,CAAC,CAAC,CAAC,IAAI,CAAA;AACV,CAAC,CAAA"}
|
|
@@ -1,21 +1,16 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
const
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
const
|
|
13
|
-
const
|
|
14
|
-
|
|
15
|
-
const show = (0, use_debounce_1.useDebounce)();
|
|
16
|
-
const CustomScrollButton = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.scrollButtonCustom, undefined);
|
|
17
|
-
const scrollButtonEnabled = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.scrollButtonEnabled, CustomScrollButton);
|
|
18
|
-
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: scrollButtonEnabled && show ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: CustomScrollButton ? ((0, jsx_runtime_1.jsx)(CustomScrollButton, { handleScrollToBottom: handleClick })) : ((0, jsx_runtime_1.jsx)(styles_1.ContainerScrollButton, { onClick: handleClick, children: (0, jsx_runtime_1.jsx)("img", { src: (0, environment_1.resolveImage)(arrow_scroll_down_svg_1.default) }) })) })) : null }));
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { useContext } from 'react';
|
|
3
|
+
import ArrowScrollDown from '../../assets/arrow-scroll-down.svg';
|
|
4
|
+
import { WEBCHAT } from '../../constants';
|
|
5
|
+
import { WebchatContext } from '../../contexts';
|
|
6
|
+
import { resolveImage } from '../../util/environment';
|
|
7
|
+
import { ContainerScrollButton } from './styles';
|
|
8
|
+
import { useDebounce } from './use-debounce';
|
|
9
|
+
export const ScrollButton = ({ handleClick, }) => {
|
|
10
|
+
const { getThemeProperty } = useContext(WebchatContext);
|
|
11
|
+
const show = useDebounce();
|
|
12
|
+
const CustomScrollButton = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.scrollButtonCustom, undefined);
|
|
13
|
+
const scrollButtonEnabled = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.scrollButtonEnabled, CustomScrollButton);
|
|
14
|
+
return (_jsx(_Fragment, { children: scrollButtonEnabled && show ? (_jsx(_Fragment, { children: CustomScrollButton ? (_jsx(CustomScrollButton, { handleScrollToBottom: handleClick })) : (_jsx(ContainerScrollButton, Object.assign({ onClick: handleClick }, { children: _jsx("img", { src: resolveImage(ArrowScrollDown) }) }))) })) : null }));
|
|
19
15
|
};
|
|
20
|
-
exports.ScrollButton = ScrollButton;
|
|
21
16
|
//# sourceMappingURL=scroll-button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scroll-button.js","sourceRoot":"","sources":["../../../../src/webchat/message-list/scroll-button.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"scroll-button.js","sourceRoot":"","sources":["../../../../src/webchat/message-list/scroll-button.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,eAAe,MAAM,oCAAoC,CAAA;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AACrD,OAAO,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAA;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAM5C,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAC3B,WAAW,GACO,EAAe,EAAE;IACnC,MAAM,EAAE,gBAAgB,EAAE,GAAG,UAAU,CAAC,cAAc,CAAC,CAAA;IAEvD,MAAM,IAAI,GAAG,WAAW,EAAE,CAAA;IAE1B,MAAM,kBAAkB,GAAG,gBAAgB,CACzC,OAAO,CAAC,iBAAiB,CAAC,kBAAkB,EAC5C,SAAS,CACV,CAAA;IAED,MAAM,mBAAmB,GAAG,gBAAgB,CAC1C,OAAO,CAAC,iBAAiB,CAAC,mBAAmB,EAC7C,kBAAkB,CACnB,CAAA;IAED,OAAO,CACL,4BACG,mBAAmB,IAAI,IAAI,CAAC,CAAC,CAAC,CAC7B,4BACG,kBAAkB,CAAC,CAAC,CAAC,CACpB,KAAC,kBAAkB,IAAC,oBAAoB,EAAE,WAAW,GAAI,CAC1D,CAAC,CAAC,CAAC,CACF,KAAC,qBAAqB,kBAAC,OAAO,EAAE,WAAW,gBACzC,cAAK,GAAG,EAAE,YAAY,CAAC,eAAe,CAAC,GAAI,IACrB,CACzB,GACA,CACJ,CAAC,CAAC,CAAC,IAAI,GACP,CACJ,CAAA;AACH,CAAC,CAAA"}
|
|
@@ -1,9 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
exports.ContainerUnreadMessagesBanner = exports.ContainerScrollButton = exports.DefaultIntroImage = exports.ContainerMessage = void 0;
|
|
4
|
-
const tslib_1 = require("tslib");
|
|
5
|
-
const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
|
|
6
|
-
exports.ContainerMessage = styled_components_1.default.div `
|
|
1
|
+
import styled from 'styled-components';
|
|
2
|
+
export const ContainerMessage = styled.div `
|
|
7
3
|
display: flex;
|
|
8
4
|
overflow-x: hidden;
|
|
9
5
|
flex-direction: column;
|
|
@@ -11,11 +7,11 @@ exports.ContainerMessage = styled_components_1.default.div `
|
|
|
11
7
|
white-space: pre;
|
|
12
8
|
word-wrap: break-word;
|
|
13
9
|
`;
|
|
14
|
-
|
|
10
|
+
export const DefaultIntroImage = styled.img `
|
|
15
11
|
max-height: 50%;
|
|
16
12
|
width: 100%;
|
|
17
13
|
`;
|
|
18
|
-
|
|
14
|
+
export const ContainerScrollButton = styled.div `
|
|
19
15
|
position: absolute;
|
|
20
16
|
right: 10px;
|
|
21
17
|
bottom: 65px;
|
|
@@ -30,7 +26,7 @@ exports.ContainerScrollButton = styled_components_1.default.div `
|
|
|
30
26
|
height: 37px;
|
|
31
27
|
border-radius: 50%;
|
|
32
28
|
`;
|
|
33
|
-
|
|
29
|
+
export const ContainerUnreadMessagesBanner = styled.div `
|
|
34
30
|
display: flex;
|
|
35
31
|
justify-content: center;
|
|
36
32
|
align-items: center;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/webchat/message-list/styles.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/webchat/message-list/styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;CAOzC,CAAA;AAED,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAA;;;CAG1C,CAAA;AAED,MAAM,CAAC,MAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;CAc9C,CAAA;AAED,MAAM,CAAC,MAAM,6BAA6B,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;CAgBtD,CAAA"}
|
|
@@ -1,21 +1,17 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
const
|
|
9
|
-
const
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
const
|
|
13
|
-
const
|
|
14
|
-
|
|
15
|
-
const notificationsBannerEnabled = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.notificationsBannerEnabled, undefined);
|
|
16
|
-
const notificationsEnabled = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.notificationsEnabled, CustomUnreadMessagesBanner || notificationsBannerEnabled);
|
|
17
|
-
const text = getThemeProperty(constants_1.WEBCHAT.CUSTOM_PROPERTIES.notificationsBannerText, 'unread messages');
|
|
18
|
-
(0, react_1.useEffect)(() => {
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { useContext, useEffect } from 'react';
|
|
3
|
+
import ArrowDown from '../../assets/arrow-down.svg';
|
|
4
|
+
import { WEBCHAT } from '../../constants';
|
|
5
|
+
import { WebchatContext } from '../../contexts';
|
|
6
|
+
import { resolveImage } from '../../util/environment';
|
|
7
|
+
import { ContainerUnreadMessagesBanner } from './styles';
|
|
8
|
+
export const UnreadMessagesBanner = ({ unreadMessagesBannerRef, }) => {
|
|
9
|
+
const { getThemeProperty, webchatState } = useContext(WebchatContext);
|
|
10
|
+
const CustomUnreadMessagesBanner = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.notificationsBannerCustom, undefined);
|
|
11
|
+
const notificationsBannerEnabled = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.notificationsBannerEnabled, undefined);
|
|
12
|
+
const notificationsEnabled = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.notificationsEnabled, CustomUnreadMessagesBanner || notificationsBannerEnabled);
|
|
13
|
+
const text = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.notificationsBannerText, 'unread messages');
|
|
14
|
+
useEffect(() => {
|
|
19
15
|
if (webchatState.isWebchatOpen && unreadMessagesBannerRef.current) {
|
|
20
16
|
unreadMessagesBannerRef.current.scrollIntoView({
|
|
21
17
|
behavior: 'smooth',
|
|
@@ -23,7 +19,6 @@ const UnreadMessagesBanner = ({ unreadMessagesBannerRef, }) => {
|
|
|
23
19
|
});
|
|
24
20
|
}
|
|
25
21
|
}, [webchatState.isWebchatOpen, unreadMessagesBannerRef]);
|
|
26
|
-
return ((
|
|
22
|
+
return (_jsx(_Fragment, { children: notificationsEnabled ? (_jsx("div", Object.assign({ ref: unreadMessagesBannerRef }, { children: CustomUnreadMessagesBanner ? (_jsx(CustomUnreadMessagesBanner, {})) : (_jsxs(ContainerUnreadMessagesBanner, { children: [_jsx("img", { src: resolveImage(ArrowDown) }), webchatState.numUnreadMessages, " ", text] })) }))) : null }));
|
|
27
23
|
};
|
|
28
|
-
exports.UnreadMessagesBanner = UnreadMessagesBanner;
|
|
29
24
|
//# sourceMappingURL=unread-messages-banner.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"unread-messages-banner.js","sourceRoot":"","sources":["../../../../src/webchat/message-list/unread-messages-banner.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"unread-messages-banner.js","sourceRoot":"","sources":["../../../../src/webchat/message-list/unread-messages-banner.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEpD,OAAO,SAAS,MAAM,6BAA6B,CAAA;AACnD,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AACrD,OAAO,EAAE,6BAA6B,EAAE,MAAM,UAAU,CAAA;AAMxD,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,EACnC,uBAAuB,GACG,EAAe,EAAE;IAC3C,MAAM,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,UAAU,CAAC,cAAc,CAAC,CAAA;IAErE,MAAM,0BAA0B,GAAG,gBAAgB,CACjD,OAAO,CAAC,iBAAiB,CAAC,yBAAyB,EACnD,SAAS,CACV,CAAA;IAED,MAAM,0BAA0B,GAAG,gBAAgB,CACjD,OAAO,CAAC,iBAAiB,CAAC,0BAA0B,EACpD,SAAS,CACV,CAAA;IAED,MAAM,oBAAoB,GAAG,gBAAgB,CAC3C,OAAO,CAAC,iBAAiB,CAAC,oBAAoB,EAC9C,0BAA0B,IAAI,0BAA0B,CACzD,CAAA;IAED,MAAM,IAAI,GAAG,gBAAgB,CAC3B,OAAO,CAAC,iBAAiB,CAAC,uBAAuB,EACjD,iBAAiB,CAClB,CAAA;IAED,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,YAAY,CAAC,aAAa,IAAI,uBAAuB,CAAC,OAAO,EAAE;YACjE,uBAAuB,CAAC,OAAO,CAAC,cAAc,CAAC;gBAC7C,QAAQ,EAAE,QAAQ;gBAClB,KAAK,EAAE,QAAQ;aAChB,CAAC,CAAA;SACH;IACH,CAAC,EAAE,CAAC,YAAY,CAAC,aAAa,EAAE,uBAAuB,CAAC,CAAC,CAAA;IAEzD,OAAO,CACL,4BACG,oBAAoB,CAAC,CAAC,CAAC,CACtB,4BAAK,GAAG,EAAE,uBAAuB,gBAC9B,0BAA0B,CAAC,CAAC,CAAC,CAC5B,KAAC,0BAA0B,KAAG,CAC/B,CAAC,CAAC,CAAC,CACF,MAAC,6BAA6B,eAC5B,cAAK,GAAG,EAAE,YAAY,CAAC,SAAS,CAAC,GAAI,EACpC,YAAY,CAAC,iBAAiB,OAAG,IAAI,IACR,CACjC,IACG,CACP,CAAC,CAAC,CAAC,IAAI,GACP,CACJ,CAAA;AACH,CAAC,CAAA"}
|
|
@@ -1,10 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
function useDebounce(delay) {
|
|
6
|
-
const [show, setShow] = (0, react_1.useState)(false);
|
|
7
|
-
(0, react_1.useEffect)(() => {
|
|
1
|
+
import { useEffect, useState } from 'react';
|
|
2
|
+
export function useDebounce(delay) {
|
|
3
|
+
const [show, setShow] = useState(false);
|
|
4
|
+
useEffect(() => {
|
|
8
5
|
const timeoutId = setTimeout(() => {
|
|
9
6
|
setShow(true);
|
|
10
7
|
}, delay || 500);
|
|
@@ -14,5 +11,4 @@ function useDebounce(delay) {
|
|
|
14
11
|
}, []);
|
|
15
12
|
return show;
|
|
16
13
|
}
|
|
17
|
-
exports.useDebounce = useDebounce;
|
|
18
14
|
//# sourceMappingURL=use-debounce.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-debounce.js","sourceRoot":"","sources":["../../../../src/webchat/message-list/use-debounce.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-debounce.js","sourceRoot":"","sources":["../../../../src/webchat/message-list/use-debounce.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAE3C,MAAM,UAAU,WAAW,CAAC,KAAc;IACxC,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IACvC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE;YAChC,OAAO,CAAC,IAAI,CAAC,CAAA;QACf,CAAC,EAAE,KAAK,IAAI,GAAG,CAAC,CAAA;QAEhB,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,SAAS,CAAC,CAAA;QACzB,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,IAAI,CAAA;AACb,CAAC"}
|