@axos-web-dev/shared-components 2.0.0-dev.18-apy → 2.0.0-dev.18-apy.2

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.
Files changed (62) hide show
  1. package/dist/ATMLocator/ATMLocator.js +1 -1
  2. package/dist/Auth/ErrorAlert.js +1 -1
  3. package/dist/Button/Button.js +1 -1
  4. package/dist/Calculators/ApyCalculator/ApyCalculator.css.d.ts +0 -1
  5. package/dist/Calculators/ApyCalculator/ApyCalculator.css.js +23 -25
  6. package/dist/Calculators/ApyCalculator/index.js +28 -9
  7. package/dist/Calculators/MarginTradingCalculator/index.js +1 -1
  8. package/dist/Carousel/index.js +1 -1
  9. package/dist/Chatbot/AnimatedGradientBorder.css.d.ts +2 -0
  10. package/dist/Chatbot/AnimatedGradientBorder.css.js +6 -2
  11. package/dist/Chatbot/Bubble.d.ts +1 -1
  12. package/dist/Chatbot/Bubble.js +92 -102
  13. package/dist/Chatbot/Chat.js +1 -2
  14. package/dist/Chatbot/ChatWindow.css.js +35 -35
  15. package/dist/Chatbot/Chatbot.d.ts +1 -1
  16. package/dist/Chatbot/Chatbot.js +1 -5
  17. package/dist/Chatbot/useHeadlessChat.js +1 -2
  18. package/dist/Chevron/index.js +1 -1
  19. package/dist/Comparison/Comparison.js +1 -1
  20. package/dist/ExecutiveBio/ExecutiveBio.js +1 -1
  21. package/dist/FaqAccordion/index.js +1 -1
  22. package/dist/FooterSiteMap/AxosBank/FooterSiteMap.js +1 -1
  23. package/dist/Forms/ApplyNow.js +1 -1
  24. package/dist/Forms/BoatMooringLocation.d.ts +4 -1
  25. package/dist/Forms/BoatMooringLocation.js +89 -8
  26. package/dist/Forms/ContactUsBusiness.js +1 -1
  27. package/dist/Forms/ContactUsBusinessNameEmail.js +1 -1
  28. package/dist/Forms/ContactUsNMLSId.js +1 -1
  29. package/dist/Forms/CpraRequest.js +1 -1
  30. package/dist/Forms/CraPublicFile.js +1 -1
  31. package/dist/Forms/EmailOnly.js +1 -1
  32. package/dist/Forms/MortgageRate/MortgageRateForm.js +1 -1
  33. package/dist/Forms/MortgageRate/MortgageRateWatch.js +1 -1
  34. package/dist/Forms/MortgageWarehouseLending.js +1 -1
  35. package/dist/Forms/SuccesForm.js +1 -1
  36. package/dist/Hyperlink/index.js +1 -1
  37. package/dist/ImageLink/ImageLink.js +1 -1
  38. package/dist/ImageLink/ImageLinkSet.js +1 -1
  39. package/dist/ImageLink/index.js +1 -1
  40. package/dist/Insight/Featured/CategorySelector.js +1 -1
  41. package/dist/Insight/Featured/Featured.js +1 -1
  42. package/dist/Insight/Featured/Header.js +1 -1
  43. package/dist/Modal/Modal.js +1 -1
  44. package/dist/NavigationMenu/AxosALTS/index.js +1 -1
  45. package/dist/NavigationMenu/AxosBank/MobileMenu/MobileMenu.js +1 -1
  46. package/dist/NavigationMenu/AxosBank/NavBar.module.js +39 -39
  47. package/dist/NavigationMenu/AxosBank/SubNavBar.js +1 -1
  48. package/dist/NavigationMenu/AxosBank/index.js +1 -1
  49. package/dist/NavigationMenu/LaVictoire/index.js +1 -1
  50. package/dist/NavigationMenu/Navbar.js +1 -1
  51. package/dist/NavigationMenu/SignInNavButton.js +1 -1
  52. package/dist/SetContainer/SetContainer.js +1 -1
  53. package/dist/SocialMediaBar/iconsRepository.js +1 -1
  54. package/dist/VideoTile/VideoTile.js +1 -1
  55. package/dist/VideoWrapper/index.js +1 -1
  56. package/dist/assets/Calculators/ApyCalculator/ApyCalculator.css +70 -76
  57. package/dist/assets/Chatbot/AnimatedGradientBorder.css +39 -8
  58. package/dist/assets/Chatbot/ChatWindow.css +77 -67
  59. package/dist/assets/NavigationMenu/AxosBank/NavBar.css +88 -88
  60. package/dist/assets/themes/axos.css +1 -1
  61. package/dist/assets/themes/ufb.css +1 -1
  62. package/package.json +2 -2
@@ -55,6 +55,7 @@ import "react-dom";
55
55
  import "../Auth/SignInPassword.js";
56
56
  /* empty css */
57
57
  /* empty css */
58
+ import "next/image.js";
58
59
  import "../Calculators/ApyCalculator/ApyCalculator.css.js";
59
60
  import "../Table/Table.css.js";
60
61
  import "../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -76,7 +77,6 @@ import "../Chatbot/Chatbot.js";
76
77
  import "../Chatbot/store/messages.js";
77
78
  /* empty css */
78
79
  import "../Comparison/Comparison.css.js";
79
- import "next/image.js";
80
80
  import "../HeroBanner/LargeBanner.css.js";
81
81
  import "../HeroBanner/HeroBanner.css.js";
82
82
  import "../HeroBanner/SelectionBanner.css.js";
@@ -40,6 +40,7 @@ import "../ArticlesSet/ArticlesSet.css.js";
40
40
  import "../Calculators/calculator.css.js";
41
41
  import "../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
42
42
  import "../Modal/contextApi/store.js";
43
+ import "next/image.js";
43
44
  import "../Calculators/ApyCalculator/ApyCalculator.css.js";
44
45
  import "../Table/Table.css.js";
45
46
  import "../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -72,7 +73,6 @@ import "../Chatbot/store/messages.js";
72
73
  import { Hyperlink } from "../Hyperlink/index.js";
73
74
  /* empty css */
74
75
  import "../Comparison/Comparison.css.js";
75
- import "next/image.js";
76
76
  import "../HeroBanner/LargeBanner.css.js";
77
77
  import "../HeroBanner/HeroBanner.css.js";
78
78
  import "../HeroBanner/SelectionBanner.css.js";
@@ -24,6 +24,7 @@ import "../IconBillboard/IconBillboard.css.js";
24
24
  import "../Calculators/calculator.css.js";
25
25
  import "../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
26
26
  import { useGlobalContext } from "../Modal/contextApi/store.js";
27
+ import "next/image.js";
27
28
  import "../Calculators/ApyCalculator/ApyCalculator.css.js";
28
29
  import "../Table/Table.css.js";
29
30
  import "../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -79,7 +80,6 @@ import "../Chatbot/Chatbot.js";
79
80
  import "../Chatbot/store/messages.js";
80
81
  /* empty css */
81
82
  import "../Comparison/Comparison.css.js";
82
- import "next/image.js";
83
83
  import "../HeroBanner/LargeBanner.css.js";
84
84
  import "../HeroBanner/HeroBanner.css.js";
85
85
  import "../HeroBanner/SelectionBanner.css.js";
@@ -32,7 +32,6 @@ export declare const field_error: string;
32
32
  export declare const relative: string;
33
33
  export declare const label_symbol: string;
34
34
  export declare const percent: string;
35
- export declare const prefix_pad: string;
36
35
  export declare const submit_section: string;
37
36
  export declare const span_12: string;
38
37
  export declare const form_disclosure: string;
@@ -20,30 +20,29 @@ var field_error = "_1vox1xjf";
20
20
  var relative = "_1vox1xjg";
21
21
  var label_symbol = "_1vox1xjh";
22
22
  var percent = "_1vox1xji";
23
- var prefix_pad = "_1vox1xjj";
24
- var submit_section = "_1vox1xjk";
25
- var span_12 = "_1vox1xjl";
26
- var form_disclosure = "_1vox1xjm";
27
- var marketing = "_1vox1xjn";
28
- var header_theme = createRuntimeFn({ defaultClassName: "_1vox1xjo", variantClassNames: { variant: { primary: "_1vox1xjp", secondary: "_1vox1xjq", tertiary: "_1vox1xjr", quaternary: "_1vox1xjs" } }, defaultVariants: {}, compoundVariants: [] });
29
- var mt_8 = "_1vox1xjt";
30
- var pis_0 = "_1vox1xju";
31
- var listbox_button = "_1vox1xjv";
32
- var chevron_icon = "_1vox1xjw";
33
- var listbox_options = "_1vox1xjx";
34
- var listbox_option = "_1vox1xjy";
35
- var results_wrapper = "_1vox1xjz";
36
- var optional_badge = "_1vox1xj10";
37
- var scrambling = "_1vox1xj12";
38
- var result_card = "_1vox1xj13";
39
- var result_section = "_1vox1xj14";
40
- var result_value_label = "_1vox1xj15";
41
- var result_value = "_1vox1xj16";
42
- var result_item = "_1vox1xj17";
43
- var result_item_label = "_1vox1xj18";
44
- var result_item_value = "_1vox1xj19";
45
- var marketingTile = "_1vox1xj1a";
46
- var bodyContent = "_1vox1xj1b";
23
+ var submit_section = "_1vox1xjj";
24
+ var span_12 = "_1vox1xjk";
25
+ var form_disclosure = "_1vox1xjl";
26
+ var marketing = "_1vox1xjm";
27
+ var header_theme = createRuntimeFn({ defaultClassName: "_1vox1xjn", variantClassNames: { variant: { primary: "_1vox1xjo", secondary: "_1vox1xjp", tertiary: "_1vox1xjq", quaternary: "_1vox1xjr" } }, defaultVariants: {}, compoundVariants: [] });
28
+ var mt_8 = "_1vox1xjs";
29
+ var pis_0 = "_1vox1xjt";
30
+ var listbox_button = "_1vox1xju";
31
+ var chevron_icon = "_1vox1xjv";
32
+ var listbox_options = "_1vox1xjw";
33
+ var listbox_option = "_1vox1xjx";
34
+ var results_wrapper = "_1vox1xjy";
35
+ var optional_badge = "_1vox1xjz";
36
+ var scrambling = "_1vox1xj11";
37
+ var result_card = "_1vox1xj12";
38
+ var result_section = "_1vox1xj13";
39
+ var result_value_label = "_1vox1xj14";
40
+ var result_value = "_1vox1xj15";
41
+ var result_item = "_1vox1xj16";
42
+ var result_item_label = "_1vox1xj17";
43
+ var result_item_value = "_1vox1xj18";
44
+ var marketingTile = "_1vox1xj19";
45
+ var bodyContent = "_1vox1xj1a";
47
46
  export {
48
47
  apy_calculator,
49
48
  apy_calculator_form,
@@ -70,7 +69,6 @@ export {
70
69
  optional_badge,
71
70
  percent,
72
71
  pis_0,
73
- prefix_pad,
74
72
  relative,
75
73
  result_card,
76
74
  result_item,
@@ -2,6 +2,7 @@
2
2
  import { jsxs, jsx } from "react/jsx-runtime";
3
3
  import { useGlobalContext } from "../../Modal/contextApi/store.js";
4
4
  import { getVariant } from "../../utils/getVariant.js";
5
+ import Image from "next/image.js";
5
6
  import { Field, Label, Input, Description, Listbox, ListboxButton, ListboxOptions, ListboxOption } from "@headlessui/react";
6
7
  import { useState, useCallback, useEffect, useRef } from "react";
7
8
  import { apy_calculator, section_header, header_theme, mt_8, calculator_section, apy_calculator_form, fieldset, field_row, relative, field_label, field_row_input, field_row_input_error, field_error, label_symbol, percent, listbox_button, chevron_icon, listbox_options, listbox_option, optional_badge, form_disclosure, results_wrapper, result_card, result_section, result_value, scrambling, result_value_label, result_item, result_item_label, result_item_value, container } from "./ApyCalculator.css.js";
@@ -98,7 +99,9 @@ const ApyCalculator = ({
98
99
  formatWithCommas(1e4)
99
100
  );
100
101
  const [APY, setAPY] = useState(AXOS_ONE_APY);
102
+ const [APYDisplay, setAPYDisplay] = useState(APY.toString());
101
103
  const [months, setMonths] = useState(12);
104
+ const [monthsDisplay, setMonthsDisplay] = useState(months.toString());
102
105
  const [monthlyDeposits, setMonthlyDeposits] = useState(100);
103
106
  const [monthlyDepositsDisplay, setMonthlyDepositsDisplay] = useState(
104
107
  formatWithCommas(100)
@@ -121,6 +124,18 @@ const ApyCalculator = ({
121
124
  setMonthlyDeposits(num);
122
125
  setMonthlyDepositsDisplay(formatWithCommas(num));
123
126
  };
127
+ const handleMonthsChange = (e) => {
128
+ const raw = e.target.value;
129
+ const num = parseInt(raw.replace(/[^0-9]/g, ""), 10);
130
+ setMonths(num);
131
+ setMonthsDisplay(num > 0 ? num.toString() : "");
132
+ };
133
+ const handleAPYChange = (e) => {
134
+ const raw = e.target.value;
135
+ const num = parseFloat(raw.replace(/[^0-9.]/g, ""));
136
+ setAPY(num);
137
+ setAPYDisplay(raw);
138
+ };
124
139
  const [endingBalanceRaw, setEndingBalanceRaw] = useState(0);
125
140
  const [totalDepositsRaw, setTotalDepositsRaw] = useState(0);
126
141
  const [interestEarnedRaw, setInterestEarnedRaw] = useState(0);
@@ -193,7 +208,7 @@ const ApyCalculator = ({
193
208
  className: `${apy_calculator} containment flex between gap_24`,
194
209
  style: { paddingBlock: "0px" },
195
210
  children: [
196
- /* @__PURE__ */ jsx("div", { className: `${calculator_section}`, children: /* @__PURE__ */ jsx("form", { id: "calculator_form", className: `${apy_calculator_form}`, children: /* @__PURE__ */ jsxs("div", { className: `${fieldset}`, children: [
211
+ /* @__PURE__ */ jsx("div", { className: calculator_section, children: /* @__PURE__ */ jsx("form", { id: "calculator_form", className: apy_calculator_form, children: /* @__PURE__ */ jsxs("div", { className: fieldset, children: [
197
212
  /* @__PURE__ */ jsxs(
198
213
  Field,
199
214
  {
@@ -243,11 +258,12 @@ const ApyCalculator = ({
243
258
  {
244
259
  className: `${field_row_input} ${fieldErrors.APY ? ` ${field_row_input_error}` : ""}`,
245
260
  id: "apy",
246
- type: "number",
261
+ type: "text",
262
+ inputMode: "numeric",
247
263
  name: "apy",
248
264
  min: 0,
249
- value: APY,
250
- onChange: (e) => setAPY(parseFloat(e.target.value)),
265
+ value: APYDisplay,
266
+ onChange: handleAPYChange,
251
267
  "aria-invalid": !!fieldErrors.APY,
252
268
  "aria-describedby": fieldErrors.APY ? "apy-error" : void 0
253
269
  }
@@ -271,10 +287,11 @@ const ApyCalculator = ({
271
287
  className: `${field_row_input}${fieldErrors.months ? ` ${field_row_input_error}` : ""}`,
272
288
  id: "months",
273
289
  min: 1,
274
- type: "number",
290
+ type: "text",
291
+ inputMode: "numeric",
275
292
  name: "months",
276
- value: months,
277
- onChange: (e) => setMonths(parseInt(e.target.value)),
293
+ value: monthsDisplay,
294
+ onChange: handleMonthsChange,
278
295
  "aria-invalid": !!fieldErrors.months,
279
296
  "aria-describedby": fieldErrors.months ? "months-error" : void 0
280
297
  }
@@ -390,12 +407,14 @@ const ApyCalculator = ({
390
407
  "aria-label": `Interest earned: ${interestEarnedDisplay}`,
391
408
  children: [
392
409
  /* @__PURE__ */ jsx(
393
- "img",
410
+ Image,
394
411
  {
395
412
  src: "https://www.axos.com/images/5IyqVlv7El9K7hAX0vIGWG/axb-25th-growth-lg.png",
396
413
  alt: "",
397
414
  height: 135,
398
- className: "img_fluid"
415
+ width: 165,
416
+ className: "img_fluid",
417
+ priority: true
399
418
  }
400
419
  ),
401
420
  /* @__PURE__ */ jsx(
@@ -27,6 +27,7 @@ import "../../Article/Article.css.js";
27
27
  import "../../ArticlesSet/ArticlesSet.css.js";
28
28
  import "../AnnualFeeCalculator/AnnualFeeCalculator.css.js";
29
29
  import { useGlobalContext } from "../../Modal/contextApi/store.js";
30
+ import "next/image.js";
30
31
  import "../../Table/Table.css.js";
31
32
  import "../AxosOneCalculator/BalanceAPYCalculator.css.js";
32
33
  import "../BalanceAPYCalculator/BalanceAPYCalculator.css.js";
@@ -80,7 +81,6 @@ import "../../Chatbot/Chatbot.js";
80
81
  import "../../Chatbot/store/messages.js";
81
82
  /* empty css */
82
83
  import "../../Comparison/Comparison.css.js";
83
- import "next/image.js";
84
84
  import "../../HeroBanner/LargeBanner.css.js";
85
85
  import "../../HeroBanner/HeroBanner.css.js";
86
86
  import "../../HeroBanner/SelectionBanner.css.js";
@@ -25,6 +25,7 @@ import "../ArticlesSet/ArticlesSet.css.js";
25
25
  import "../Calculators/calculator.css.js";
26
26
  import "../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
27
27
  import "../Modal/contextApi/store.js";
28
+ import "next/image.js";
28
29
  import "../Calculators/ApyCalculator/ApyCalculator.css.js";
29
30
  import "../Table/Table.css.js";
30
31
  import "../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -81,7 +82,6 @@ import "../Chatbot/Chatbot.js";
81
82
  import "../Chatbot/store/messages.js";
82
83
  /* empty css */
83
84
  import "../Comparison/Comparison.css.js";
84
- import "next/image.js";
85
85
  import "../HeroBanner/LargeBanner.css.js";
86
86
  import "../HeroBanner/HeroBanner.css.js";
87
87
  import "../HeroBanner/SelectionBanner.css.js";
@@ -2,4 +2,6 @@ export declare const angle: `var(--${string})`;
2
2
  export declare const offsetVar: `var(--${string})`;
3
3
  export declare const gradientBorder: string;
4
4
  export declare const gradientBorderUfb: string;
5
+ export declare const inputFocusKeyframes: string;
5
6
  export declare const gradientFocus: string;
7
+ export declare const shadowAnimation: string;
@@ -7,11 +7,15 @@ var angle = "var(--angle)";
7
7
  var offsetVar = "var(--offset)";
8
8
  var gradientBorder = "ic6iil2";
9
9
  var gradientBorderUfb = "ic6iil3";
10
- var gradientFocus = "ic6iil4";
10
+ var inputFocusKeyframes = "ic6iil4";
11
+ var gradientFocus = "ic6iil5";
12
+ var shadowAnimation = "ic6iil8";
11
13
  export {
12
14
  angle,
13
15
  gradientBorder,
14
16
  gradientBorderUfb,
15
17
  gradientFocus,
16
- offsetVar
18
+ inputFocusKeyframes,
19
+ offsetVar,
20
+ shadowAnimation
17
21
  };
@@ -1,6 +1,6 @@
1
1
  import { PropsWithChildren } from 'react';
2
2
 
3
- export declare const Bubble: ({ children, onClick, project, }: PropsWithChildren & {
3
+ export declare const Bubble: ({ children, onClick, }: PropsWithChildren & {
4
4
  onClick?: () => void;
5
5
  project: "axos" | "ufb" | "Axos" | "Ufb";
6
6
  }) => import("react/jsx-runtime").JSX.Element;
@@ -3,117 +3,107 @@ import { jsx, jsxs } from "react/jsx-runtime";
3
3
  import { vars } from "../themes/axos.css.js";
4
4
  import clsx from "clsx";
5
5
  import { AnimatePresence, motion } from "framer-motion";
6
- import { gradientBorder, gradientBorderUfb } from "./AnimatedGradientBorder.css.js";
6
+ import { shadowAnimation } from "./AnimatedGradientBorder.css.js";
7
7
  import { inner, svgFill, bubbleText, bubbleButton, bubbleWrapper } from "./Bubble.css.js";
8
8
  import { useOpenChat } from "./store/chat.js";
9
9
  const Bubble = ({
10
10
  children,
11
11
  onClick = () => {
12
- },
13
- project = "Axos"
12
+ }
14
13
  }) => {
15
14
  const isOpen = useOpenChat((state) => state.isOpen);
16
- return /* @__PURE__ */ jsx(
17
- "div",
18
- {
19
- className: clsx(
20
- bubbleWrapper,
21
- ["axos", "Axos"].includes(project) ? gradientBorder : gradientBorderUfb
22
- ),
23
- children: /* @__PURE__ */ jsx("div", { className: inner, children: /* @__PURE__ */ jsxs("button", { className: clsx(bubbleButton, inner), onClick, children: [
24
- /* @__PURE__ */ jsx(AnimatePresence, { children: !isOpen ? /* @__PURE__ */ jsx("div", { className: "bubble-circle", children: /* @__PURE__ */ jsxs(
25
- motion.svg,
26
- {
27
- xmlns: "http://www.w3.org/2000/svg",
28
- initial: { scale: 0.1, opacity: 0 },
29
- animate: {
30
- scale: 1,
31
- opacity: 1,
32
- transition: {
33
- default: { type: "spring" },
34
- opacity: { ease: [0, 0.71, 0.2, 1.01] }
35
- }
36
- },
37
- width: "24",
38
- height: "24",
39
- viewBox: "0 0 24 24",
40
- fill: "none",
41
- children: [
42
- /* @__PURE__ */ jsx(
43
- "path",
44
- {
45
- d: "M12.5277 6.78937C12.8911 6.78937 13.1852 7.08251 13.1853 7.44452C13.1852 7.80654 12.8911 8.10056 12.5277 8.10056H7.26386C6.5371 8.10064 5.94791 8.68761 5.94789 9.41175V14.6565C5.9479 15.3806 6.5371 15.9676 7.26386 15.9677H8.97488C9.12012 15.9678 9.23818 16.0854 9.23825 16.2301V19.6861L12.8932 16.0445C12.9424 15.9956 13.0092 15.9679 13.0786 15.9677H16.4765C17.2032 15.9676 17.7925 15.3806 17.7925 14.6565V13.273C17.7925 12.9111 18.0868 12.6172 18.45 12.617C18.8134 12.617 19.1084 12.9109 19.1084 13.273V14.6565C19.1084 16.1048 17.9301 17.2788 16.4765 17.2789H13.5149L10.169 20.6135C9.33997 21.4393 7.92245 20.8542 7.92229 19.6861V17.2789H7.26386C5.81026 17.2788 4.63193 16.1048 4.63193 14.6565V9.41175C4.63194 7.96341 5.81027 6.78945 7.26386 6.78937H12.5277Z",
46
- fill: vars.chatbot.bubble.icon
47
- }
48
- ),
49
- /* @__PURE__ */ jsx(
50
- "path",
51
- {
52
- d: "M11.2126 4.1661C11.5758 4.16638 11.8701 4.46027 11.8702 4.82214C11.87 5.18394 11.5757 5.47701 11.2126 5.47729H5.29036C4.20017 5.47729 3.31606 6.35831 3.31596 7.44452V10.7229C3.31577 11.0849 3.02083 11.3781 2.65753 11.3781C2.29436 11.3779 2.0002 11.0848 2 10.7229V7.44452C2.0001 5.63411 3.47333 4.1661 5.29036 4.1661H11.2126Z",
53
- fill: vars.chatbot.bubble.icon
54
- }
55
- ),
56
- /* @__PURE__ */ jsx(
57
- "path",
58
- {
59
- d: "M17.7145 4.47582C17.9558 3.84136 18.8779 3.84142 19.1192 4.47582L19.6459 5.8611C19.7218 6.06058 19.8835 6.2175 20.0885 6.29132L21.511 6.80454C22.163 7.03936 22.163 7.93626 21.511 8.17107L20.0885 8.6843C19.8835 8.75812 19.7218 8.91504 19.6459 9.11452L19.1192 10.4998C18.8779 11.1342 17.9558 11.1343 17.7145 10.4998L17.1878 9.11452C17.1119 8.91508 16.9502 8.75811 16.7453 8.6843L15.3227 8.17107C14.6708 7.93622 14.6708 7.0394 15.3227 6.80454L16.7453 6.29132C16.9502 6.21751 17.1119 6.06054 17.1878 5.8611L17.7145 4.47582Z",
60
- fill: vars.chatbot.bubble.icon
61
- }
62
- )
63
- ]
15
+ return /* @__PURE__ */ jsx("div", { className: clsx(bubbleWrapper, shadowAnimation), children: /* @__PURE__ */ jsx("div", { className: inner, children: /* @__PURE__ */ jsxs("button", { className: clsx(bubbleButton, inner), onClick, children: [
16
+ /* @__PURE__ */ jsx(AnimatePresence, { children: !isOpen ? /* @__PURE__ */ jsx("div", { className: "bubble-circle", children: /* @__PURE__ */ jsxs(
17
+ motion.svg,
18
+ {
19
+ xmlns: "http://www.w3.org/2000/svg",
20
+ initial: { scale: 0.1, opacity: 0 },
21
+ animate: {
22
+ scale: 1,
23
+ opacity: 1,
24
+ transition: {
25
+ default: { type: "spring" },
26
+ opacity: { ease: [0, 0.71, 0.2, 1.01] }
64
27
  }
65
- ) }) : /* @__PURE__ */ jsx("span", { className: "close-icon", children: /* @__PURE__ */ jsxs(
66
- motion.svg,
67
- {
68
- xmlns: "http://www.w3.org/2000/svg",
69
- width: "24",
70
- height: "24",
71
- viewBox: "0 0 24 24",
72
- fill: "none",
73
- initial: { opacity: 0, rotate: 0, scale: 0.1 },
74
- animate: {
75
- opacity: 1,
76
- rotate: -360,
77
- scale: 1,
78
- transition: {
79
- default: { type: "spring" },
80
- opacity: { ease: "linear" },
81
- scale: { ease: "linear" }
82
- }
83
- },
84
- children: [
85
- /* @__PURE__ */ jsx(
86
- "path",
87
- {
88
- className: svgFill,
89
- d: "M23.7096 0.892655L23.1073 0.290383C22.7202 -0.0967942 22.0749 -0.0967942 21.6447 0.290383L13.6 8.33506L15.6649 10.4L23.7096 2.35533C24.0968 1.92513 24.0968 1.27983 23.7096 0.892655Z",
90
- fill: "#98DDFF"
91
- }
92
- ),
93
- /* @__PURE__ */ jsx(
94
- "path",
95
- {
96
- className: svgFill,
97
- d: "M2.44278 0.293744C2.04123 -0.0979148 1.37197 -0.0979148 0.925804 0.293744L0.301162 0.902989C-0.100387 1.29465 -0.100387 1.94742 0.301162 2.38259L10.1168 12L0.301162 21.6174C-0.100387 22.0091 -0.100387 22.6618 0.301162 23.097L0.925804 23.7063C1.32735 24.0979 1.99661 24.0979 2.44278 23.7063L14.4 12.0435L2.44278 0.293744Z",
98
- fill: "#98DDFF"
99
- }
100
- ),
101
- /* @__PURE__ */ jsx(
102
- "path",
103
- {
104
- className: svgFill,
105
- d: "M23.7096 23.1073L23.1073 23.7096C22.7202 24.0968 22.0749 24.0968 21.6447 23.7096L13.6 15.6649L15.6649 13.6L23.7096 21.6446C24.0968 22.0748 24.0968 22.7201 23.7096 23.1073Z",
106
- fill: "#98DDFF"
107
- }
108
- )
109
- ]
28
+ },
29
+ width: "24",
30
+ height: "24",
31
+ viewBox: "0 0 24 24",
32
+ fill: "none",
33
+ children: [
34
+ /* @__PURE__ */ jsx(
35
+ "path",
36
+ {
37
+ d: "M12.5277 6.78937C12.8911 6.78937 13.1852 7.08251 13.1853 7.44452C13.1852 7.80654 12.8911 8.10056 12.5277 8.10056H7.26386C6.5371 8.10064 5.94791 8.68761 5.94789 9.41175V14.6565C5.9479 15.3806 6.5371 15.9676 7.26386 15.9677H8.97488C9.12012 15.9678 9.23818 16.0854 9.23825 16.2301V19.6861L12.8932 16.0445C12.9424 15.9956 13.0092 15.9679 13.0786 15.9677H16.4765C17.2032 15.9676 17.7925 15.3806 17.7925 14.6565V13.273C17.7925 12.9111 18.0868 12.6172 18.45 12.617C18.8134 12.617 19.1084 12.9109 19.1084 13.273V14.6565C19.1084 16.1048 17.9301 17.2788 16.4765 17.2789H13.5149L10.169 20.6135C9.33997 21.4393 7.92245 20.8542 7.92229 19.6861V17.2789H7.26386C5.81026 17.2788 4.63193 16.1048 4.63193 14.6565V9.41175C4.63194 7.96341 5.81027 6.78945 7.26386 6.78937H12.5277Z",
38
+ fill: vars.chatbot.bubble.icon
39
+ }
40
+ ),
41
+ /* @__PURE__ */ jsx(
42
+ "path",
43
+ {
44
+ d: "M11.2126 4.1661C11.5758 4.16638 11.8701 4.46027 11.8702 4.82214C11.87 5.18394 11.5757 5.47701 11.2126 5.47729H5.29036C4.20017 5.47729 3.31606 6.35831 3.31596 7.44452V10.7229C3.31577 11.0849 3.02083 11.3781 2.65753 11.3781C2.29436 11.3779 2.0002 11.0848 2 10.7229V7.44452C2.0001 5.63411 3.47333 4.1661 5.29036 4.1661H11.2126Z",
45
+ fill: vars.chatbot.bubble.icon
46
+ }
47
+ ),
48
+ /* @__PURE__ */ jsx(
49
+ "path",
50
+ {
51
+ d: "M17.7145 4.47582C17.9558 3.84136 18.8779 3.84142 19.1192 4.47582L19.6459 5.8611C19.7218 6.06058 19.8835 6.2175 20.0885 6.29132L21.511 6.80454C22.163 7.03936 22.163 7.93626 21.511 8.17107L20.0885 8.6843C19.8835 8.75812 19.7218 8.91504 19.6459 9.11452L19.1192 10.4998C18.8779 11.1342 17.9558 11.1343 17.7145 10.4998L17.1878 9.11452C17.1119 8.91508 16.9502 8.75811 16.7453 8.6843L15.3227 8.17107C14.6708 7.93622 14.6708 7.0394 15.3227 6.80454L16.7453 6.29132C16.9502 6.21751 17.1119 6.06054 17.1878 5.8611L17.7145 4.47582Z",
52
+ fill: vars.chatbot.bubble.icon
53
+ }
54
+ )
55
+ ]
56
+ }
57
+ ) }) : /* @__PURE__ */ jsx("span", { className: "close-icon", children: /* @__PURE__ */ jsxs(
58
+ motion.svg,
59
+ {
60
+ xmlns: "http://www.w3.org/2000/svg",
61
+ width: "24",
62
+ height: "24",
63
+ viewBox: "0 0 24 24",
64
+ fill: "none",
65
+ initial: { opacity: 0, rotate: 0, scale: 0.1 },
66
+ animate: {
67
+ opacity: 1,
68
+ rotate: -360,
69
+ scale: 1,
70
+ transition: {
71
+ default: { type: "spring" },
72
+ opacity: { ease: "linear" },
73
+ scale: { ease: "linear" }
110
74
  }
111
- ) }) }),
112
- /* @__PURE__ */ jsx("div", { className: bubbleText, children: "Ask Evo AI" }),
113
- children
114
- ] }) })
115
- }
116
- );
75
+ },
76
+ children: [
77
+ /* @__PURE__ */ jsx(
78
+ "path",
79
+ {
80
+ className: svgFill,
81
+ d: "M23.7096 0.892655L23.1073 0.290383C22.7202 -0.0967942 22.0749 -0.0967942 21.6447 0.290383L13.6 8.33506L15.6649 10.4L23.7096 2.35533C24.0968 1.92513 24.0968 1.27983 23.7096 0.892655Z",
82
+ fill: "#98DDFF"
83
+ }
84
+ ),
85
+ /* @__PURE__ */ jsx(
86
+ "path",
87
+ {
88
+ className: svgFill,
89
+ d: "M2.44278 0.293744C2.04123 -0.0979148 1.37197 -0.0979148 0.925804 0.293744L0.301162 0.902989C-0.100387 1.29465 -0.100387 1.94742 0.301162 2.38259L10.1168 12L0.301162 21.6174C-0.100387 22.0091 -0.100387 22.6618 0.301162 23.097L0.925804 23.7063C1.32735 24.0979 1.99661 24.0979 2.44278 23.7063L14.4 12.0435L2.44278 0.293744Z",
90
+ fill: "#98DDFF"
91
+ }
92
+ ),
93
+ /* @__PURE__ */ jsx(
94
+ "path",
95
+ {
96
+ className: svgFill,
97
+ d: "M23.7096 23.1073L23.1073 23.7096C22.7202 24.0968 22.0749 24.0968 21.6447 23.7096L13.6 15.6649L15.6649 13.6L23.7096 21.6446C24.0968 22.0748 24.0968 22.7201 23.7096 23.1073Z",
98
+ fill: "#98DDFF"
99
+ }
100
+ )
101
+ ]
102
+ }
103
+ ) }) }),
104
+ /* @__PURE__ */ jsx("div", { className: bubbleText, children: "Ask Evo AI" }),
105
+ children
106
+ ] }) }) });
117
107
  };
118
108
  export {
119
109
  Bubble
@@ -32,8 +32,7 @@ function Chat() {
32
32
  let memberJoinedHandler;
33
33
  let chatConnectedHandler;
34
34
  async function initChat() {
35
- const { Client, consoleLoggerHandler, Logger } = await import("@ujet/websdk-headless");
36
- Logger.addHandler(consoleLoggerHandler);
35
+ const { Client } = await import("@ujet/websdk-headless");
37
36
  clientRef.current = new Client({
38
37
  companyId,
39
38
  tenant,
@@ -4,41 +4,41 @@ import '../assets/Chatbot/ChatWindow.css';import '../assets/Chatbot/Chatbot.css'
4
4
  /* empty css */
5
5
  /* empty css */
6
6
  /* empty css */
7
- var windowStyle = "_13n1jqk0";
8
- var windowOpenStyle = "_13n1jqk1";
9
- var windowBarStyle = "_13n1jqk2";
10
- var left_bar_section = "_13n1jqk3";
11
- var chat_title = "_13n1jqk4";
12
- var buttonss_section = "_13n1jqk5";
13
- var button_bar = "_13n1jqk6";
14
- var button_reset = "_13n1jqk7";
15
- var arrowFill = "_13n1jqk8";
16
- var inputStyle = "_13n1jqk9";
17
- var autoResize = "_13n1jqka";
18
- var sendButtonStyle = "_13n1jqkb";
19
- var messagesContainerStyle = "_13n1jqkc";
20
- var notificationStyle = "_13n1jqkd";
21
- var messageStyle = "_13n1jqke";
22
- var inline_button_wrapper = "_13n1jqkf";
23
- var inline_button = "_13n1jqkg";
24
- var endChatButtonStyle = "_13n1jqkh";
25
- var noAnswerButton = "_13n1jqki";
26
- var chatbotMenu = "_13n1jqkj";
27
- var chatbotMenuItem = "_13n1jqkk";
28
- var chatNetworkStatus = "_13n1jqkl";
29
- var chatEndDialogOverlay = "_13n1jqkm";
30
- var chatFinishDialog = "_13n1jqkn";
31
- var thankyou_overlay = "_13n1jqko";
32
- var thankyou_message = "_13n1jqkp";
33
- var thankyou_image = "_13n1jqkq";
34
- var chatEndCircle = "_13n1jqkr";
35
- var user_msg = "_13n1jqks";
36
- var agent_msg = "_13n1jqkt";
37
- var shimmerText = "_13n1jqkv";
38
- var tableMsg = "_13n1jqkw";
39
- var tableHead = "_13n1jqkx";
40
- var tableCell = "_13n1jqky";
41
- var trMortgageTable = "_13n1jqkz";
7
+ var windowStyle = "_13n1jqk1";
8
+ var windowOpenStyle = "_13n1jqk2";
9
+ var windowBarStyle = "_13n1jqk3";
10
+ var left_bar_section = "_13n1jqk4";
11
+ var chat_title = "_13n1jqk5";
12
+ var buttonss_section = "_13n1jqk6";
13
+ var button_bar = "_13n1jqk7";
14
+ var button_reset = "_13n1jqk8";
15
+ var arrowFill = "_13n1jqk9";
16
+ var inputStyle = "_13n1jqka";
17
+ var autoResize = "_13n1jqkb";
18
+ var sendButtonStyle = "_13n1jqkc";
19
+ var messagesContainerStyle = "_13n1jqkd";
20
+ var notificationStyle = "_13n1jqke";
21
+ var messageStyle = "_13n1jqkf";
22
+ var inline_button_wrapper = "_13n1jqkg";
23
+ var inline_button = "_13n1jqkh";
24
+ var endChatButtonStyle = "_13n1jqki";
25
+ var noAnswerButton = "_13n1jqkj";
26
+ var chatbotMenu = "_13n1jqkk";
27
+ var chatbotMenuItem = "_13n1jqkl";
28
+ var chatNetworkStatus = "_13n1jqkm";
29
+ var chatEndDialogOverlay = "_13n1jqkn";
30
+ var chatFinishDialog = "_13n1jqko";
31
+ var thankyou_overlay = "_13n1jqkp";
32
+ var thankyou_message = "_13n1jqkq";
33
+ var thankyou_image = "_13n1jqkr";
34
+ var chatEndCircle = "_13n1jqks";
35
+ var user_msg = "_13n1jqkt";
36
+ var agent_msg = "_13n1jqku";
37
+ var shimmerText = "_13n1jqkw";
38
+ var tableMsg = "_13n1jqkx";
39
+ var tableHead = "_13n1jqky";
40
+ var tableCell = "_13n1jqkz";
41
+ var trMortgageTable = "_13n1jqk10";
42
42
  export {
43
43
  agent_msg,
44
44
  arrowFill,
@@ -8,7 +8,7 @@ type InitalizeChatbot = {
8
8
  host: string;
9
9
  authUrl: string;
10
10
  };
11
- export declare const Chatbot: ({ project, projectEnv, menuOption, debug, config, }: {
11
+ export declare const Chatbot: ({ project, projectEnv, menuOption, config, }: {
12
12
  project?: "axos" | "ufb" | "Axos" | "Ufb";
13
13
  projectEnv?: "dev" | "qa" | "uat" | "stg" | "prod";
14
14
  menuOption?: "Support Virtual Agent" | string;
@@ -22,7 +22,6 @@ const Chatbot = ({
22
22
  project = "axos",
23
23
  projectEnv = "dev",
24
24
  menuOption = "Support Virtual Agent",
25
- debug = false,
26
25
  config
27
26
  }) => {
28
27
  const {
@@ -231,10 +230,7 @@ const Chatbot = ({
231
230
  clientRef.current?.off("chat.connected", onChatConnectedHandler);
232
231
  };
233
232
  const createClient = async () => {
234
- const { Client, Logger, consoleLoggerHandler } = await import("@ujet/websdk-headless");
235
- if (projectEnv !== "prod" || debug) {
236
- Logger.addHandler(consoleLoggerHandler);
237
- }
233
+ const { Client } = await import("@ujet/websdk-headless");
238
234
  if (clientRef.current) return;
239
235
  const client = new Client({
240
236
  companyId: config.companyId,
@@ -76,8 +76,7 @@ function useHeadlessChat({
76
76
  let chatTimeoutHandler;
77
77
  async function init() {
78
78
  setStatus("connecting");
79
- const { Client, Logger, consoleLoggerHandler } = await import("@ujet/websdk-headless");
80
- if (debug) Logger.addHandler(consoleLoggerHandler);
79
+ const { Client } = await import("@ujet/websdk-headless");
81
80
  try {
82
81
  clientRef.current = new Client({
83
82
  companyId,