@axos-web-dev/shared-components 2.2.5 → 2.2.6
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/dist/ATMLocator/ATMLocator.js +1 -0
- package/dist/Auth/ErrorAlert.js +1 -0
- package/dist/Button/Button.js +1 -0
- package/dist/Calculators/Calculator.js +2 -1
- package/dist/Calculators/MarginTradingCalculator/index.js +1 -0
- package/dist/Carousel/index.js +1 -0
- package/dist/Chatbot/AudioManager.d.ts +19 -0
- package/dist/Chatbot/AudioManager.js +61 -0
- package/dist/Chatbot/ChatWindow.css.d.ts +2 -0
- package/dist/Chatbot/ChatWindow.css.js +34 -30
- package/dist/Chatbot/ChatWindow.js +382 -363
- package/dist/Chatbot/Chatbot.d.ts +3 -0
- package/dist/Chatbot/Chatbot.js +24 -1
- package/dist/Chatbot/ExpandChatToggle.d.ts +8 -0
- package/dist/Chatbot/ExpandChatToggle.js +74 -0
- package/dist/Chatbot/index.js +5 -2
- package/dist/Chatbot/store/chat.d.ts +8 -0
- package/dist/Chatbot/store/chat.js +14 -2
- package/dist/Chevron/index.js +1 -0
- package/dist/Comparison/Comparison.js +1 -0
- package/dist/ExecutiveBio/ExecutiveBio.js +1 -0
- package/dist/FaqAccordion/index.js +1 -0
- package/dist/FooterSiteMap/AxosBank/FooterSiteMap.js +1 -0
- package/dist/Forms/ApplyNow.js +1 -0
- package/dist/Forms/ContactUsBusiness.js +1 -0
- package/dist/Forms/ContactUsBusinessNameEmail.js +1 -0
- package/dist/Forms/ContactUsNMLSId.js +1 -0
- package/dist/Forms/CpraRequest.js +1 -0
- package/dist/Forms/CraPublicFile.js +1 -0
- package/dist/Forms/EmailOnly.js +1 -0
- package/dist/Forms/MortgageRate/MortgageRateForm.js +1 -0
- package/dist/Forms/MortgageRate/MortgageRateWatch.js +1 -0
- package/dist/Forms/MortgageWarehouseLending.js +1 -0
- package/dist/Forms/SuccesForm.js +2 -1
- package/dist/Hyperlink/index.js +1 -0
- package/dist/ImageLink/ImageLink.js +1 -0
- package/dist/ImageLink/ImageLinkSet.js +1 -0
- package/dist/ImageLink/index.js +1 -0
- package/dist/Insight/Featured/CategorySelector.js +1 -0
- package/dist/Insight/Featured/Featured.js +1 -0
- package/dist/Insight/Featured/Header.js +1 -0
- package/dist/Modal/Modal.js +1 -0
- package/dist/NavigationMenu/AxosALTS/index.js +1 -0
- package/dist/NavigationMenu/AxosBank/MobileMenu/MobileMenu.js +1 -0
- package/dist/NavigationMenu/AxosBank/SubNavBar.js +1 -0
- package/dist/NavigationMenu/AxosBank/index.js +1 -0
- package/dist/NavigationMenu/LaVictoire/index.js +1 -0
- package/dist/NavigationMenu/Navbar.js +1 -0
- package/dist/NavigationMenu/SignInNavButton.js +1 -0
- package/dist/SetContainer/SetContainer.js +1 -0
- package/dist/SocialMediaBar/iconsRepository.js +1 -0
- package/dist/VideoTile/VideoTile.js +1 -0
- package/dist/VideoWrapper/index.js +1 -0
- package/dist/assets/Chatbot/ChatWindow.css +69 -57
- package/dist/assets/notification.mp3.js +4 -0
- package/dist/main.js +5 -2
- package/dist/utils/useVisibility.d.ts +1 -0
- package/dist/utils/useVisibility.js +18 -0
- package/dist/vite-env.d.js +1 -0
- package/package.json +1 -1
- package/dist/Chatbot/Chat.d.ts +0 -1
- package/dist/Chatbot/Chat.js +0 -158
- package/dist/Chatbot/useHeadlessChat.d.ts +0 -27
- package/dist/Chatbot/useHeadlessChat.js +0 -240
package/dist/Chatbot/Chatbot.js
CHANGED
|
@@ -1,12 +1,18 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsxs, jsx } from "react/jsx-runtime";
|
|
3
|
+
import { usePageVisibility } from "../utils/useVisibility.js";
|
|
3
4
|
import { useRef, useState, useEffect } from "react";
|
|
4
5
|
import { useMount, useUnmount } from "react-use";
|
|
6
|
+
import notificationSound from "../assets/notification.mp3.js";
|
|
7
|
+
import AudioManager from "./AudioManager.js";
|
|
5
8
|
import { Bubble } from "./Bubble.js";
|
|
6
9
|
import { chatbotAXB, chatbotUFB } from "./Chatbot.css.js";
|
|
7
10
|
import { ChatWindow } from "./ChatWindow.js";
|
|
8
11
|
import { useOpenChat } from "./store/chat.js";
|
|
9
12
|
import { useMessages } from "./store/messages.js";
|
|
13
|
+
const audioManager = new AudioManager();
|
|
14
|
+
audioManager.installUjetAudioOverride(notificationSound);
|
|
15
|
+
audioManager.setSoundEnabled(false);
|
|
10
16
|
const Chatbot = ({
|
|
11
17
|
project = "axos",
|
|
12
18
|
projectEnv = "dev",
|
|
@@ -14,6 +20,7 @@ const Chatbot = ({
|
|
|
14
20
|
config
|
|
15
21
|
}) => {
|
|
16
22
|
const {
|
|
23
|
+
isOpen,
|
|
17
24
|
hasOpenedOnce,
|
|
18
25
|
toggle,
|
|
19
26
|
reset,
|
|
@@ -23,6 +30,7 @@ const Chatbot = ({
|
|
|
23
30
|
unblockInput,
|
|
24
31
|
blockInput
|
|
25
32
|
} = useOpenChat();
|
|
33
|
+
const isVisible = usePageVisibility();
|
|
26
34
|
const { addMessage, addMessages, clearMessages, messages } = useMessages();
|
|
27
35
|
const clientRef = useRef(null);
|
|
28
36
|
const menuRef = useRef(null);
|
|
@@ -305,6 +313,7 @@ const Chatbot = ({
|
|
|
305
313
|
}
|
|
306
314
|
};
|
|
307
315
|
const handleClick = async () => {
|
|
316
|
+
audioManager.setSoundEnabled(true);
|
|
308
317
|
toggle();
|
|
309
318
|
if (hasStarted) return;
|
|
310
319
|
if (!hasOpenedOnce) {
|
|
@@ -391,6 +400,19 @@ const Chatbot = ({
|
|
|
391
400
|
console.error("Error sending preview message:", error);
|
|
392
401
|
}
|
|
393
402
|
};
|
|
403
|
+
useEffect(() => {
|
|
404
|
+
if (chatRef.current) {
|
|
405
|
+
if (isVisible && isOpen) {
|
|
406
|
+
audioManager.setSoundEnabled(false);
|
|
407
|
+
}
|
|
408
|
+
if (isVisible && !isOpen) {
|
|
409
|
+
audioManager.setSoundEnabled(true);
|
|
410
|
+
}
|
|
411
|
+
if (!isVisible) {
|
|
412
|
+
audioManager.setSoundEnabled(true);
|
|
413
|
+
}
|
|
414
|
+
}
|
|
415
|
+
}, [isOpen, isVisible]);
|
|
394
416
|
return menusLoaded && /* @__PURE__ */ jsxs(
|
|
395
417
|
"div",
|
|
396
418
|
{
|
|
@@ -417,5 +439,6 @@ const Chatbot = ({
|
|
|
417
439
|
);
|
|
418
440
|
};
|
|
419
441
|
export {
|
|
420
|
-
Chatbot
|
|
442
|
+
Chatbot,
|
|
443
|
+
audioManager
|
|
421
444
|
};
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { vars } from "../themes/axos.css.js";
|
|
3
|
+
import '../assets/themes/victorie.css';import '../assets/themes/ufb.css';import '../assets/themes/premier.css';import '../assets/themes/axos.css';/* empty css */
|
|
4
|
+
/* empty css */
|
|
5
|
+
/* empty css */
|
|
6
|
+
/* empty css */
|
|
7
|
+
import clsx from "clsx";
|
|
8
|
+
import { button_bar, expandToggleStyle } from "./ChatWindow.css.js";
|
|
9
|
+
const ExpandChatToggle = ({
|
|
10
|
+
isExpanded,
|
|
11
|
+
onToggle
|
|
12
|
+
}) => {
|
|
13
|
+
return /* @__PURE__ */ jsx(
|
|
14
|
+
"button",
|
|
15
|
+
{
|
|
16
|
+
type: "button",
|
|
17
|
+
onClick: onToggle,
|
|
18
|
+
className: clsx(button_bar, expandToggleStyle),
|
|
19
|
+
style: { border: "none", cursor: "pointer", padding: 0, lineHeight: 1 },
|
|
20
|
+
"aria-label": isExpanded ? "Collapse chat window" : "Expand chat window",
|
|
21
|
+
title: isExpanded ? "Collapse" : "Expand",
|
|
22
|
+
children: isExpanded ? (
|
|
23
|
+
// Collapse: inward corners — shown when panel is expanded (shrink toward bottom-right)
|
|
24
|
+
/* @__PURE__ */ jsxs(
|
|
25
|
+
"svg",
|
|
26
|
+
{
|
|
27
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
28
|
+
width: 16,
|
|
29
|
+
height: 16,
|
|
30
|
+
viewBox: "0 0 24 24",
|
|
31
|
+
fill: "none",
|
|
32
|
+
stroke: vars.chatbot.window.headerText,
|
|
33
|
+
strokeWidth: 2,
|
|
34
|
+
strokeLinecap: "round",
|
|
35
|
+
strokeLinejoin: "round",
|
|
36
|
+
"aria-hidden": true,
|
|
37
|
+
children: [
|
|
38
|
+
/* @__PURE__ */ jsx("polyline", { points: "20 14 14 14 14 20" }),
|
|
39
|
+
/* @__PURE__ */ jsx("polyline", { points: "4 10 10 10 10 4" }),
|
|
40
|
+
/* @__PURE__ */ jsx("line", { x1: "14", y1: "14", x2: "21", y2: "21" }),
|
|
41
|
+
/* @__PURE__ */ jsx("line", { x1: "10", y1: "10", x2: "3", y2: "3" })
|
|
42
|
+
]
|
|
43
|
+
}
|
|
44
|
+
)
|
|
45
|
+
) : (
|
|
46
|
+
// Expand: outward corners — shown when panel is compact (grow toward top-left)
|
|
47
|
+
/* @__PURE__ */ jsxs(
|
|
48
|
+
"svg",
|
|
49
|
+
{
|
|
50
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
51
|
+
width: 16,
|
|
52
|
+
height: 16,
|
|
53
|
+
viewBox: "0 0 24 24",
|
|
54
|
+
fill: "none",
|
|
55
|
+
stroke: vars.chatbot.window.headerText,
|
|
56
|
+
strokeWidth: 2,
|
|
57
|
+
strokeLinecap: "round",
|
|
58
|
+
strokeLinejoin: "round",
|
|
59
|
+
"aria-hidden": true,
|
|
60
|
+
children: [
|
|
61
|
+
/* @__PURE__ */ jsx("polyline", { points: "9 3 3 3 3 9" }),
|
|
62
|
+
/* @__PURE__ */ jsx("polyline", { points: "15 21 21 21 21 15" }),
|
|
63
|
+
/* @__PURE__ */ jsx("line", { x1: "3", y1: "3", x2: "10", y2: "10" }),
|
|
64
|
+
/* @__PURE__ */ jsx("line", { x1: "21", y1: "21", x2: "14", y2: "14" })
|
|
65
|
+
]
|
|
66
|
+
}
|
|
67
|
+
)
|
|
68
|
+
)
|
|
69
|
+
}
|
|
70
|
+
);
|
|
71
|
+
};
|
|
72
|
+
export {
|
|
73
|
+
ExpandChatToggle
|
|
74
|
+
};
|
package/dist/Chatbot/index.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { Bubble } from "./Bubble.js";
|
|
3
3
|
import { borderHoverGradient, bubbleButton, bubbleText, bubbleWrapper, inner, svgFill } from "./Bubble.css.js";
|
|
4
|
-
import { Chatbot } from "./Chatbot.js";
|
|
4
|
+
import { Chatbot, audioManager } from "./Chatbot.js";
|
|
5
5
|
import { chatbotAXB, chatbotUFB } from "./Chatbot.css.js";
|
|
6
6
|
import { ChatWindow } from "./ChatWindow.js";
|
|
7
|
-
import { agent_msg, arrowFill, autoResize, button_bar, button_reset, buttonss_section, chatEndCircle, chatEndDialogOverlay, chatFinishDialog, chatNetworkStatus, chat_title, chatbotMenu, chatbotMenuItem, endChatButtonStyle, inline_button, inline_button_wrapper, inputStyle, left_bar_section, messageStyle, messagesContainerStyle, noAnswerButton, notificationStyle, sendButtonStyle, shimmerText, thankyou_image, thankyou_message, thankyou_overlay, user_msg, windowBarStyle, windowOpenStyle, windowStyle } from "./ChatWindow.css.js";
|
|
7
|
+
import { agent_msg, arrowFill, autoResize, button_bar, button_reset, buttonss_section, chatEndCircle, chatEndDialogOverlay, chatFinishDialog, chatNetworkStatus, chat_title, chatbotMenu, chatbotMenuItem, endChatButtonStyle, expandToggleStyle, inline_button, inline_button_wrapper, inputStyle, left_bar_section, messageStyle, messagesContainerStyle, noAnswerButton, notificationStyle, sendButtonStyle, shimmerText, thankyou_image, thankyou_message, thankyou_overlay, user_msg, windowBarStyle, windowExpandedStyle, windowOpenStyle, windowStyle } from "./ChatWindow.css.js";
|
|
8
8
|
import { useOpenChat } from "./store/chat.js";
|
|
9
9
|
import { useMessages } from "./store/messages.js";
|
|
10
10
|
export {
|
|
@@ -13,6 +13,7 @@ export {
|
|
|
13
13
|
Chatbot,
|
|
14
14
|
agent_msg,
|
|
15
15
|
arrowFill,
|
|
16
|
+
audioManager,
|
|
16
17
|
autoResize,
|
|
17
18
|
borderHoverGradient,
|
|
18
19
|
bubbleButton,
|
|
@@ -31,6 +32,7 @@ export {
|
|
|
31
32
|
chatbotMenuItem,
|
|
32
33
|
chatbotUFB,
|
|
33
34
|
endChatButtonStyle,
|
|
35
|
+
expandToggleStyle,
|
|
34
36
|
inline_button,
|
|
35
37
|
inline_button_wrapper,
|
|
36
38
|
inner,
|
|
@@ -50,6 +52,7 @@ export {
|
|
|
50
52
|
useOpenChat,
|
|
51
53
|
user_msg,
|
|
52
54
|
windowBarStyle,
|
|
55
|
+
windowExpandedStyle,
|
|
53
56
|
windowOpenStyle,
|
|
54
57
|
windowStyle
|
|
55
58
|
};
|
|
@@ -7,6 +7,7 @@ interface OpenChatState {
|
|
|
7
7
|
reset: () => void;
|
|
8
8
|
showThankyouMessage: boolean;
|
|
9
9
|
displayThankyouMessage: () => void;
|
|
10
|
+
hideDisplayThankyouMessage: () => void;
|
|
10
11
|
toggleThankyouMessage?: () => void;
|
|
11
12
|
hasEscalated?: boolean;
|
|
12
13
|
startEscalation?: () => void;
|
|
@@ -14,6 +15,13 @@ interface OpenChatState {
|
|
|
14
15
|
isBlockedInput?: boolean;
|
|
15
16
|
blockInput?: () => void;
|
|
16
17
|
unblockInput?: () => void;
|
|
18
|
+
hasStarted: boolean;
|
|
19
|
+
setChatStarted: () => void;
|
|
20
|
+
resetChatStarted: () => void;
|
|
21
|
+
chatStatus: "idle" | "connected" | "connecting" | "ending" | "ended";
|
|
22
|
+
setChatStatus: (status: "idle" | "connected" | "connecting" | "ending" | "ended") => void;
|
|
23
|
+
isWindowExpanded: boolean;
|
|
24
|
+
toggleWindowExpanded: () => void;
|
|
17
25
|
}
|
|
18
26
|
export declare const useOpenChat: import('zustand').UseBoundStore<import('zustand').StoreApi<OpenChatState>>;
|
|
19
27
|
export {};
|
|
@@ -4,6 +4,10 @@ const useOpenChat = create((set, get) => ({
|
|
|
4
4
|
hasOpenedOnce: false,
|
|
5
5
|
showThankyouMessage: false,
|
|
6
6
|
hasEscalated: false,
|
|
7
|
+
hasStarted: false,
|
|
8
|
+
chatStatus: "idle",
|
|
9
|
+
isWindowExpanded: false,
|
|
10
|
+
toggleWindowExpanded: () => set((state) => ({ isWindowExpanded: !state.isWindowExpanded })),
|
|
7
11
|
toggle: () => set((state) => ({ isOpen: !state.isOpen, hasOpenedOnce: true })),
|
|
8
12
|
open: () => {
|
|
9
13
|
const alreadyOpened = get().hasOpenedOnce;
|
|
@@ -18,15 +22,23 @@ const useOpenChat = create((set, get) => ({
|
|
|
18
22
|
isOpen: false,
|
|
19
23
|
showThankyouMessage: false,
|
|
20
24
|
hasEscalated: false,
|
|
21
|
-
isBlockedInput: false
|
|
25
|
+
isBlockedInput: false,
|
|
26
|
+
hasStarted: false,
|
|
27
|
+
isWindowExpanded: false
|
|
22
28
|
}),
|
|
23
29
|
displayThankyouMessage: () => set({ showThankyouMessage: true }),
|
|
30
|
+
hideDisplayThankyouMessage: () => set({ showThankyouMessage: false }),
|
|
24
31
|
toggleThankyouMessage: () => set((state) => ({ showThankyouMessage: !state.showThankyouMessage })),
|
|
25
32
|
startEscalation: () => set({ hasEscalated: true }),
|
|
26
33
|
endEscalation: () => set({ hasEscalated: false }),
|
|
27
34
|
isBlockedInput: false,
|
|
28
35
|
blockInput: () => set({ isBlockedInput: true }),
|
|
29
|
-
unblockInput: () => set({ isBlockedInput: false })
|
|
36
|
+
unblockInput: () => set({ isBlockedInput: false }),
|
|
37
|
+
setChatStarted: () => set({ hasStarted: true }),
|
|
38
|
+
resetChatStarted: () => set({ hasStarted: false }),
|
|
39
|
+
setChatStatus: (status) => set({
|
|
40
|
+
chatStatus: status
|
|
41
|
+
})
|
|
30
42
|
}));
|
|
31
43
|
export {
|
|
32
44
|
useOpenChat
|
package/dist/Chevron/index.js
CHANGED
package/dist/Forms/ApplyNow.js
CHANGED
package/dist/Forms/EmailOnly.js
CHANGED
package/dist/Forms/SuccesForm.js
CHANGED
|
@@ -61,8 +61,9 @@ import "../Carousel/index.js";
|
|
|
61
61
|
/* empty css */
|
|
62
62
|
/* empty css */
|
|
63
63
|
import "../Chatbot/store/chat.js";
|
|
64
|
-
import "
|
|
64
|
+
import "../Chatbot/Chatbot.js";
|
|
65
65
|
/* empty css */
|
|
66
|
+
import "react-use";
|
|
66
67
|
/* empty css */
|
|
67
68
|
import "../Chatbot/store/messages.js";
|
|
68
69
|
/* empty css */
|
package/dist/Hyperlink/index.js
CHANGED
package/dist/ImageLink/index.js
CHANGED
package/dist/Modal/Modal.js
CHANGED