@envive-ai/react-toolkit-v3 0.3.6 → 0.3.7
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/AnimatedText/AnimatedText.d.cts +3 -3
- package/dist/AnimatedText/AnimatedText.d.ts +3 -3
- package/dist/CSSVariablesEditor/CssVariablesEditorComponent.d.cts +2 -2
- package/dist/CSSVariablesEditor/CssVariablesEditorComponent.d.ts +2 -2
- package/dist/Carousel/Carousel.d.cts +2 -2
- package/dist/Carousel/Carousel.d.ts +2 -2
- package/dist/ChatFooter/ChatFooter.d.cts +2 -2
- package/dist/ChatFooter/ChatFooter.d.ts +2 -2
- package/dist/ChatFooter/components/index.d.cts +5 -5
- package/dist/ChatFooter/components/index.d.ts +5 -5
- package/dist/ChatFooter/hooks/useGetContainerProperties.cjs +2 -2
- package/dist/ChatFooter/hooks/useGetContainerProperties.js +2 -2
- package/dist/ChatHeader/ChatHeader.cjs +3 -2
- package/dist/ChatHeader/ChatHeader.d.cts +3 -2
- package/dist/ChatHeader/ChatHeader.d.ts +3 -2
- package/dist/ChatHeader/ChatHeader.js +3 -2
- package/dist/ChatHeader/components/Handle.cjs +27 -1
- package/dist/ChatHeader/components/Handle.js +27 -1
- package/dist/ChatHeader/types/index.d.cts +2 -0
- package/dist/ChatHeader/types/index.d.ts +2 -0
- package/dist/ChatPreview/ChatPreview.d.cts +2 -2
- package/dist/ChatPreview/ChatPreview.d.ts +2 -2
- package/dist/ChatPreviewComparison/ChatPreviewComparison.d.cts +2 -2
- package/dist/ChatPreviewComparison/ChatPreviewComparison.d.ts +2 -2
- package/dist/ChatPreviewLoading/ChatPreviewLoading.d.cts +2 -2
- package/dist/ChatPreviewLoading/ChatPreviewLoading.d.ts +2 -2
- package/dist/Container/Container.d.cts +176 -176
- package/dist/Container/Container.d.ts +176 -176
- package/dist/DesignTokens/DesignTokensComponent.d.cts +2 -2
- package/dist/DesignTokens/DesignTokensComponent.d.ts +2 -2
- package/dist/DocumentRetrievalCard/DocumentRetrievalCard.d.cts +2 -2
- package/dist/DocumentRetrievalCard/DocumentRetrievalCard.d.ts +2 -2
- package/dist/FloatingButton/FloatingButton.cjs +2 -1
- package/dist/FloatingButton/FloatingButton.d.cts +4 -3
- package/dist/FloatingButton/FloatingButton.d.ts +4 -3
- package/dist/FloatingButton/FloatingButton.js +2 -1
- package/dist/FloatingButton/components/Container.cjs +2 -2
- package/dist/FloatingButton/components/Container.js +2 -2
- package/dist/FloatingButton/hooks/useGetContainerProperties.cjs +2 -2
- package/dist/FloatingButton/hooks/useGetContainerProperties.js +2 -2
- package/dist/FloatingButton/types/types.cjs +4 -4
- package/dist/FloatingButton/types/types.d.cts +8 -4
- package/dist/FloatingButton/types/types.d.ts +8 -4
- package/dist/FloatingButton/types/types.js +4 -4
- package/dist/FloatingChat/FloatingChat.cjs +106 -39
- package/dist/FloatingChat/FloatingChat.d.cts +3 -2
- package/dist/FloatingChat/FloatingChat.d.ts +3 -2
- package/dist/FloatingChat/FloatingChat.js +108 -41
- package/dist/FloatingChat/components/AgentMessage.cjs +3 -2
- package/dist/FloatingChat/components/AgentMessage.js +3 -2
- package/dist/FloatingChat/components/ChatMessages.cjs +59 -41
- package/dist/FloatingChat/components/ChatMessages.js +58 -40
- package/dist/FloatingChat/components/Layout.cjs +2 -2
- package/dist/FloatingChat/components/Layout.js +2 -2
- package/dist/FloatingChat/components/ModalSheet.cjs +184 -0
- package/dist/FloatingChat/components/ModalSheet.js +182 -0
- package/dist/FloatingChat/components/SalesAgentProductCardsCarousel.cjs +3 -2
- package/dist/FloatingChat/components/SalesAgentProductCardsCarousel.js +3 -2
- package/dist/FloatingChat/components/index.cjs +1 -0
- package/dist/FloatingChat/components/index.js +1 -0
- package/dist/FloatingChat/hooks/useChatSuggestions.cjs +25 -0
- package/dist/FloatingChat/hooks/useChatSuggestions.js +24 -0
- package/dist/FloatingChat/hooks/useFilteredChatMessages.cjs +24 -0
- package/dist/FloatingChat/hooks/useFilteredChatMessages.js +23 -0
- package/dist/FloatingChat/hooks/usePreventScroll.cjs +117 -0
- package/dist/FloatingChat/hooks/usePreventScroll.js +116 -0
- package/dist/FloatingChat/hooks/useSnapCalculator.cjs +37 -0
- package/dist/FloatingChat/hooks/useSnapCalculator.js +35 -0
- package/dist/FloatingChat/hooks/useSnapControl.cjs +82 -0
- package/dist/FloatingChat/hooks/useSnapControl.js +81 -0
- package/dist/FloatingChat/hooks/useSnapSetup.cjs +59 -0
- package/dist/FloatingChat/hooks/useSnapSetup.js +58 -0
- package/dist/FloatingChat/types/types.d.cts +4 -0
- package/dist/FloatingChat/types/types.d.ts +4 -0
- package/dist/Image/Image.d.cts +2 -2
- package/dist/Image/Image.d.ts +2 -2
- package/dist/ImageGallery/ImageGallery.d.cts +2 -2
- package/dist/ImageGallery/ImageGallery.d.ts +2 -2
- package/dist/MarkdownProcessor/MarkdownProcessor.d.cts +2 -2
- package/dist/MarkdownProcessor/MarkdownProcessor.d.ts +2 -2
- package/dist/PromptButton/PromptButton.d.cts +2 -2
- package/dist/PromptButton/PromptButton.d.ts +2 -2
- package/dist/PromptButtonCarouselWithImage/PromptButtonCarouselWithImage.d.cts +2 -2
- package/dist/PromptButtonCarouselWithImage/PromptButtonCarouselWithImage.d.ts +2 -2
- package/dist/PromptCarousel/PromptCarousel.cjs +0 -1
- package/dist/PromptCarousel/PromptCarousel.d.cts +2 -2
- package/dist/PromptCarousel/PromptCarousel.d.ts +2 -2
- package/dist/PromptCarousel/PromptCarousel.js +0 -1
- package/dist/ReviewCard/ReviewCard.d.cts +2 -2
- package/dist/ReviewCard/ReviewCard.d.ts +2 -2
- package/dist/ReviewCard/components/index.d.cts +6 -6
- package/dist/ReviewCard/components/index.d.ts +6 -6
- package/dist/SalesAgentProductCard/SalesAgentProductCard.d.cts +2 -2
- package/dist/SalesAgentProductCard/SalesAgentProductCard.d.ts +2 -2
- package/dist/SalesAgentProductCard/components/index.d.cts +2 -2
- package/dist/SalesAgentProductCard/components/index.d.ts +8 -8
- package/dist/SocialProof/SocialProof.cjs +9 -2
- package/dist/SocialProof/SocialProof.d.cts +2 -2
- package/dist/SocialProof/SocialProof.d.ts +2 -2
- package/dist/SocialProof/SocialProof.js +9 -2
- package/dist/SocialProof/hooks/index.cjs +1 -0
- package/dist/SocialProof/hooks/index.js +3 -0
- package/dist/SocialProof/hooks/useSocialProofCount.cjs +48 -0
- package/dist/SocialProof/hooks/useSocialProofCount.d.cts +15 -0
- package/dist/SocialProof/hooks/useSocialProofCount.d.ts +15 -0
- package/dist/SocialProof/hooks/useSocialProofCount.js +46 -0
- package/dist/SocialProof/index.cjs +5 -1
- package/dist/SocialProof/index.d.cts +3 -2
- package/dist/SocialProof/index.d.ts +3 -2
- package/dist/SocialProof/index.js +4 -2
- package/dist/SocialProof/types/types.cjs +8 -1
- package/dist/SocialProof/types/types.d.cts +16 -6
- package/dist/SocialProof/types/types.d.ts +16 -6
- package/dist/SocialProof/types/types.js +7 -1
- package/dist/Stack/Stack.d.cts +2 -2
- package/dist/TitledPromptCarousel/TitledPromptCarousel.d.cts +2 -2
- package/dist/TitledPromptCarousel/TitledPromptCarousel.d.ts +2 -2
- package/dist/TypingAnimation/TypingAnimation.d.cts +2 -2
- package/dist/TypingAnimation/TypingAnimation.d.ts +2 -2
- package/dist/Typography/Typography.d.cts +4 -4
- package/dist/Typography/Typography.d.ts +4 -4
- package/dist/WidgetTextField/WidgetTextField.d.cts +2 -2
- package/dist/WidgetTextField/WidgetTextField.d.ts +2 -2
- package/dist/WidgetWrapper/WidgetWrapper.d.cts +2 -2
- package/dist/WidgetWrapperWithTitle/WidgetWrapperWithTitle.d.cts +2 -2
- package/dist/WidgetWrapperWithTitle/WidgetWrapperWithTitle.d.ts +2 -2
- package/dist/styles.css +1 -1
- package/package.json +1 -1
- package/src/components/ChatFooter/hooks/useGetContainerProperties.ts +2 -2
- package/src/components/ChatHeader/ChatHeader.tsx +2 -0
- package/src/components/ChatHeader/components/Handle.tsx +29 -1
- package/src/components/ChatHeader/types/index.ts +3 -0
- package/src/components/FloatingButton/FloatingButton.tsx +2 -0
- package/src/components/FloatingButton/components/Container.tsx +3 -0
- package/src/components/FloatingButton/hooks/useGetContainerProperties.ts +2 -1
- package/src/components/FloatingButton/types/types.ts +9 -4
- package/src/components/FloatingChat/FloatingChat.tsx +160 -59
- package/src/components/FloatingChat/components/AgentMessage.tsx +3 -0
- package/src/components/FloatingChat/components/ChatMessages.tsx +25 -0
- package/src/components/FloatingChat/components/Layout.tsx +2 -2
- package/src/components/FloatingChat/components/ModalSheet.tsx +288 -0
- package/src/components/FloatingChat/components/SalesAgentProductCardsCarousel.tsx +7 -2
- package/src/components/FloatingChat/components/index.ts +3 -0
- package/src/components/FloatingChat/hooks/useChatSuggestions.ts +49 -0
- package/src/components/FloatingChat/hooks/useFilteredChatMessages.ts +43 -0
- package/src/components/FloatingChat/hooks/usePreventScroll.ts +207 -0
- package/src/components/FloatingChat/hooks/useSnapCalculator.ts +41 -0
- package/src/components/FloatingChat/hooks/useSnapControl.ts +131 -0
- package/src/components/FloatingChat/hooks/useSnapSetup.ts +106 -0
- package/src/components/FloatingChat/types/types.ts +4 -0
- package/src/components/PromptCarousel/PromptCarousel.tsx +0 -1
- package/src/components/SocialProof/SocialProof.tsx +8 -2
- package/src/components/SocialProof/__tests__/SocialProof.test.tsx +66 -17
- package/src/components/SocialProof/hooks/index.ts +2 -0
- package/src/components/SocialProof/hooks/useSocialProofCount.ts +67 -0
- package/src/components/SocialProof/index.ts +2 -1
- package/src/components/SocialProof/types/types.ts +18 -6
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { AnimatedTextProps } from "./types/types.cjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react184 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/components/AnimatedText/AnimatedText.d.ts
|
|
5
|
-
declare const AnimatedText:
|
|
5
|
+
declare const AnimatedText: react184.MemoExoticComponent<({
|
|
6
6
|
sequence,
|
|
7
7
|
typingDuration,
|
|
8
8
|
transition,
|
|
9
9
|
loop,
|
|
10
10
|
getNodeWrapper
|
|
11
|
-
}: AnimatedTextProps) =>
|
|
11
|
+
}: AnimatedTextProps) => react184.ReactNode>;
|
|
12
12
|
//#endregion
|
|
13
13
|
export { AnimatedText };
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { AnimatedTextProps } from "./types/types.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react184 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/components/AnimatedText/AnimatedText.d.ts
|
|
5
|
-
declare const AnimatedText:
|
|
5
|
+
declare const AnimatedText: react184.MemoExoticComponent<({
|
|
6
6
|
sequence,
|
|
7
7
|
typingDuration,
|
|
8
8
|
transition,
|
|
9
9
|
loop,
|
|
10
10
|
getNodeWrapper
|
|
11
|
-
}: AnimatedTextProps) =>
|
|
11
|
+
}: AnimatedTextProps) => react184.ReactNode>;
|
|
12
12
|
//#endregion
|
|
13
13
|
export { AnimatedText };
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as react_jsx_runtime18 from "react/jsx-runtime";
|
|
2
2
|
|
|
3
3
|
//#region src/components/CSSVariablesEditor/CssVariablesEditorComponent.d.ts
|
|
4
4
|
declare const CssVariablesEditorComponent: ({
|
|
5
5
|
selectedMerchantName
|
|
6
6
|
}: {
|
|
7
7
|
selectedMerchantName: string;
|
|
8
|
-
}) =>
|
|
8
|
+
}) => react_jsx_runtime18.JSX.Element;
|
|
9
9
|
//#endregion
|
|
10
10
|
export { CssVariablesEditorComponent };
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as react_jsx_runtime33 from "react/jsx-runtime";
|
|
2
2
|
|
|
3
3
|
//#region src/components/CSSVariablesEditor/CssVariablesEditorComponent.d.ts
|
|
4
4
|
declare const CssVariablesEditorComponent: ({
|
|
5
5
|
selectedMerchantName
|
|
6
6
|
}: {
|
|
7
7
|
selectedMerchantName: string;
|
|
8
|
-
}) =>
|
|
8
|
+
}) => react_jsx_runtime33.JSX.Element;
|
|
9
9
|
//#endregion
|
|
10
10
|
export { CssVariablesEditorComponent };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { CarouselProps } from "./types/types.cjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime25 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/Carousel/Carousel.d.ts
|
|
5
5
|
declare const Carousel: ({
|
|
@@ -11,6 +11,6 @@ declare const Carousel: ({
|
|
|
11
11
|
badgeLabel,
|
|
12
12
|
theme,
|
|
13
13
|
hideNavigation
|
|
14
|
-
}: CarouselProps) =>
|
|
14
|
+
}: CarouselProps) => react_jsx_runtime25.JSX.Element;
|
|
15
15
|
//#endregion
|
|
16
16
|
export { Carousel };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { CarouselProps } from "./types/types.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime31 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/Carousel/Carousel.d.ts
|
|
5
5
|
declare const Carousel: ({
|
|
@@ -11,6 +11,6 @@ declare const Carousel: ({
|
|
|
11
11
|
badgeLabel,
|
|
12
12
|
theme,
|
|
13
13
|
hideNavigation
|
|
14
|
-
}: CarouselProps) =>
|
|
14
|
+
}: CarouselProps) => react_jsx_runtime31.JSX.Element;
|
|
15
15
|
//#endregion
|
|
16
16
|
export { Carousel };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ChatFooterProps } from "./types/types.cjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime32 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/ChatFooter/ChatFooter.d.ts
|
|
5
5
|
declare const ChatFooter: ({
|
|
@@ -18,6 +18,6 @@ declare const ChatFooter: ({
|
|
|
18
18
|
disabled,
|
|
19
19
|
isLoadingPromptSuggestions,
|
|
20
20
|
disabledInput
|
|
21
|
-
}: ChatFooterProps) =>
|
|
21
|
+
}: ChatFooterProps) => react_jsx_runtime32.JSX.Element;
|
|
22
22
|
//#endregion
|
|
23
23
|
export { ChatFooter };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ChatFooterProps } from "./types/types.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime26 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/ChatFooter/ChatFooter.d.ts
|
|
5
5
|
declare const ChatFooter: ({
|
|
@@ -18,6 +18,6 @@ declare const ChatFooter: ({
|
|
|
18
18
|
disabled,
|
|
19
19
|
isLoadingPromptSuggestions,
|
|
20
20
|
disabledInput
|
|
21
|
-
}: ChatFooterProps) =>
|
|
21
|
+
}: ChatFooterProps) => react_jsx_runtime26.JSX.Element;
|
|
22
22
|
//#endregion
|
|
23
23
|
export { ChatFooter };
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { LayoutProps } from "./Layout.cjs";
|
|
2
2
|
import { PromptSuggestionsProps } from "./PromptSuggestions.cjs";
|
|
3
3
|
import { TextFieldProps } from "../../TextField/types/index.cjs";
|
|
4
|
-
import * as
|
|
5
|
-
import * as
|
|
4
|
+
import * as react181 from "react";
|
|
5
|
+
import * as react_jsx_runtime30 from "react/jsx-runtime";
|
|
6
6
|
|
|
7
7
|
//#region src/components/ChatFooter/components/index.d.ts
|
|
8
8
|
declare const ChatFooterComponents: {
|
|
@@ -17,13 +17,13 @@ declare const ChatFooterComponents: {
|
|
|
17
17
|
testId,
|
|
18
18
|
className,
|
|
19
19
|
style
|
|
20
|
-
}: LayoutProps) =>
|
|
20
|
+
}: LayoutProps) => react_jsx_runtime30.JSX.Element;
|
|
21
21
|
EnviveLogo: ({
|
|
22
22
|
style
|
|
23
23
|
}: {
|
|
24
24
|
className?: string;
|
|
25
25
|
style?: React.CSSProperties;
|
|
26
|
-
}) =>
|
|
26
|
+
}) => react181.ReactElement<react181.SVGProps<SVGSVGElement>, string | react181.JSXElementConstructor<any>>;
|
|
27
27
|
PromptSuggestions: ({
|
|
28
28
|
theme,
|
|
29
29
|
suggestions,
|
|
@@ -31,7 +31,7 @@ declare const ChatFooterComponents: {
|
|
|
31
31
|
className,
|
|
32
32
|
style,
|
|
33
33
|
disabled
|
|
34
|
-
}: PromptSuggestionsProps) =>
|
|
34
|
+
}: PromptSuggestionsProps) => react_jsx_runtime30.JSX.Element;
|
|
35
35
|
TextField: ({
|
|
36
36
|
theme,
|
|
37
37
|
placeholder,
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { LayoutProps } from "./Layout.js";
|
|
2
2
|
import { PromptSuggestionsProps } from "./PromptSuggestions.js";
|
|
3
3
|
import { TextFieldProps } from "../../TextField/types/index.js";
|
|
4
|
-
import * as
|
|
5
|
-
import * as
|
|
4
|
+
import * as react10 from "react";
|
|
5
|
+
import * as react_jsx_runtime24 from "react/jsx-runtime";
|
|
6
6
|
|
|
7
7
|
//#region src/components/ChatFooter/components/index.d.ts
|
|
8
8
|
declare const ChatFooterComponents: {
|
|
@@ -17,13 +17,13 @@ declare const ChatFooterComponents: {
|
|
|
17
17
|
testId,
|
|
18
18
|
className,
|
|
19
19
|
style
|
|
20
|
-
}: LayoutProps) =>
|
|
20
|
+
}: LayoutProps) => react_jsx_runtime24.JSX.Element;
|
|
21
21
|
EnviveLogo: ({
|
|
22
22
|
style
|
|
23
23
|
}: {
|
|
24
24
|
className?: string;
|
|
25
25
|
style?: React.CSSProperties;
|
|
26
|
-
}) =>
|
|
26
|
+
}) => react10.ReactElement<react10.SVGProps<SVGSVGElement>, string | react10.JSXElementConstructor<any>>;
|
|
27
27
|
PromptSuggestions: ({
|
|
28
28
|
theme,
|
|
29
29
|
suggestions,
|
|
@@ -31,7 +31,7 @@ declare const ChatFooterComponents: {
|
|
|
31
31
|
className,
|
|
32
32
|
style,
|
|
33
33
|
disabled
|
|
34
|
-
}: PromptSuggestionsProps) =>
|
|
34
|
+
}: PromptSuggestionsProps) => react_jsx_runtime24.JSX.Element;
|
|
35
35
|
TextField: ({
|
|
36
36
|
theme,
|
|
37
37
|
placeholder,
|
|
@@ -8,8 +8,8 @@ const useGetContainerProperties = ({ isScrolled, theme }) => {
|
|
|
8
8
|
baseClassName: "envive-tw-w-full envive-tw-opacity-90 envive-tw-backdrop-blur-[12px] envive-tw-border-border-light ",
|
|
9
9
|
themeContainerClassNames: (0, react.useMemo)(() => {
|
|
10
10
|
return {
|
|
11
|
-
[require_theme.Theme.STANDARD]: `${isScrolled ? "" : "envive-tw-border-t envive-tw-p-4"}`,
|
|
12
|
-
[require_theme.Theme.MODERN]: `${isScrolled ? "" : "envive-tw-border-t envive-tw-p-4"}`,
|
|
11
|
+
[require_theme.Theme.STANDARD]: `${isScrolled ? "envive-tw-p-4" : "envive-tw-border-t envive-tw-p-4"}`,
|
|
12
|
+
[require_theme.Theme.MODERN]: `${isScrolled ? "envive-tw-p-4" : "envive-tw-border-t envive-tw-p-4"}`,
|
|
13
13
|
[require_theme.Theme.MINIMAL]: `${isScrolled ? "envive-tw-bg-white envive-tw-pt-2 envive-tw-pb-4 envive-tw-px-4 envive-tw-border-t" : "envive-tw-border-t envive-tw-p-4"}`
|
|
14
14
|
}[theme] ?? "";
|
|
15
15
|
}, [theme, isScrolled])
|
|
@@ -7,8 +7,8 @@ const useGetContainerProperties = ({ isScrolled, theme }) => {
|
|
|
7
7
|
baseClassName: "envive-tw-w-full envive-tw-opacity-90 envive-tw-backdrop-blur-[12px] envive-tw-border-border-light ",
|
|
8
8
|
themeContainerClassNames: useMemo(() => {
|
|
9
9
|
return {
|
|
10
|
-
[Theme.STANDARD]: `${isScrolled ? "" : "envive-tw-border-t envive-tw-p-4"}`,
|
|
11
|
-
[Theme.MODERN]: `${isScrolled ? "" : "envive-tw-border-t envive-tw-p-4"}`,
|
|
10
|
+
[Theme.STANDARD]: `${isScrolled ? "envive-tw-p-4" : "envive-tw-border-t envive-tw-p-4"}`,
|
|
11
|
+
[Theme.MODERN]: `${isScrolled ? "envive-tw-p-4" : "envive-tw-border-t envive-tw-p-4"}`,
|
|
12
12
|
[Theme.MINIMAL]: `${isScrolled ? "envive-tw-bg-white envive-tw-pt-2 envive-tw-pb-4 envive-tw-px-4 envive-tw-border-t" : "envive-tw-border-t envive-tw-p-4"}`
|
|
13
13
|
}[theme] ?? "";
|
|
14
14
|
}, [theme, isScrolled])
|
|
@@ -7,14 +7,15 @@ const require_useHeaderLogoSelector = require('./hooks/useHeaderLogoSelector.cjs
|
|
|
7
7
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
8
8
|
|
|
9
9
|
//#region src/components/ChatHeader/ChatHeader.tsx
|
|
10
|
-
const ChatHeader = ({ theme = require_theme.Theme.GLOBAL_CUSTOM, variant = require_index.ChatHeaderVariant.LIGHT, logoLight, logoDark, centralizeCXToggle = true, showCXToggle, selectedOption = require_index.ChatHeaderOptions.ASSISTANT, leftToggleLabel, rightToggleLabel, logoInToggle, showLogo, showHandle, showMainContent = true, handleState, headerBgColor, onClose, onToggle }) => {
|
|
10
|
+
const ChatHeader = ({ theme = require_theme.Theme.GLOBAL_CUSTOM, variant = require_index.ChatHeaderVariant.LIGHT, logoLight, logoDark, centralizeCXToggle = true, showCXToggle, selectedOption = require_index.ChatHeaderOptions.ASSISTANT, leftToggleLabel, rightToggleLabel, logoInToggle, showLogo, showHandle, showMainContent = true, handleState, handleAnimationKey, headerBgColor, onClose, onToggle }) => {
|
|
11
11
|
const finalTheme = require_resolveTheme.resolveTheme(theme);
|
|
12
12
|
const logoVariant = require_useHeaderLogoSelector.useHeaderLogoSelector(logoLight, logoDark, variant);
|
|
13
13
|
const finalLogo = showLogo ? logoVariant : null;
|
|
14
14
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [showHandle && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index$1.ChatHeaderComponents.Handle, {
|
|
15
15
|
theme: finalTheme,
|
|
16
16
|
variant,
|
|
17
|
-
state: handleState
|
|
17
|
+
state: handleState,
|
|
18
|
+
animationKey: handleAnimationKey
|
|
18
19
|
}), showMainContent && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_index$1.ChatHeaderComponents.Layout, {
|
|
19
20
|
headerBgColor,
|
|
20
21
|
variant,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ChatHeaderProps } from "./types/index.cjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime29 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/ChatHeader/ChatHeader.d.ts
|
|
5
5
|
declare const ChatHeader: ({
|
|
@@ -17,9 +17,10 @@ declare const ChatHeader: ({
|
|
|
17
17
|
showHandle,
|
|
18
18
|
showMainContent,
|
|
19
19
|
handleState,
|
|
20
|
+
handleAnimationKey,
|
|
20
21
|
headerBgColor,
|
|
21
22
|
onClose,
|
|
22
23
|
onToggle
|
|
23
|
-
}: ChatHeaderProps) =>
|
|
24
|
+
}: ChatHeaderProps) => react_jsx_runtime29.JSX.Element;
|
|
24
25
|
//#endregion
|
|
25
26
|
export { ChatHeader };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ChatHeaderProps } from "./types/index.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/ChatHeader/ChatHeader.d.ts
|
|
5
5
|
declare const ChatHeader: ({
|
|
@@ -17,9 +17,10 @@ declare const ChatHeader: ({
|
|
|
17
17
|
showHandle,
|
|
18
18
|
showMainContent,
|
|
19
19
|
handleState,
|
|
20
|
+
handleAnimationKey,
|
|
20
21
|
headerBgColor,
|
|
21
22
|
onClose,
|
|
22
23
|
onToggle
|
|
23
|
-
}: ChatHeaderProps) =>
|
|
24
|
+
}: ChatHeaderProps) => react_jsx_runtime0.JSX.Element;
|
|
24
25
|
//#endregion
|
|
25
26
|
export { ChatHeader };
|
|
@@ -6,14 +6,15 @@ import { useHeaderLogoSelector } from "./hooks/useHeaderLogoSelector.js";
|
|
|
6
6
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
|
|
8
8
|
//#region src/components/ChatHeader/ChatHeader.tsx
|
|
9
|
-
const ChatHeader = ({ theme = Theme.GLOBAL_CUSTOM, variant = ChatHeaderVariant.LIGHT, logoLight, logoDark, centralizeCXToggle = true, showCXToggle, selectedOption = ChatHeaderOptions.ASSISTANT, leftToggleLabel, rightToggleLabel, logoInToggle, showLogo, showHandle, showMainContent = true, handleState, headerBgColor, onClose, onToggle }) => {
|
|
9
|
+
const ChatHeader = ({ theme = Theme.GLOBAL_CUSTOM, variant = ChatHeaderVariant.LIGHT, logoLight, logoDark, centralizeCXToggle = true, showCXToggle, selectedOption = ChatHeaderOptions.ASSISTANT, leftToggleLabel, rightToggleLabel, logoInToggle, showLogo, showHandle, showMainContent = true, handleState, handleAnimationKey, headerBgColor, onClose, onToggle }) => {
|
|
10
10
|
const finalTheme = resolveTheme(theme);
|
|
11
11
|
const logoVariant = useHeaderLogoSelector(logoLight, logoDark, variant);
|
|
12
12
|
const finalLogo = showLogo ? logoVariant : null;
|
|
13
13
|
return /* @__PURE__ */ jsxs(Fragment, { children: [showHandle && /* @__PURE__ */ jsx(ChatHeaderComponents.Handle, {
|
|
14
14
|
theme: finalTheme,
|
|
15
15
|
variant,
|
|
16
|
-
state: handleState
|
|
16
|
+
state: handleState,
|
|
17
|
+
animationKey: handleAnimationKey
|
|
17
18
|
}), showMainContent && /* @__PURE__ */ jsxs(ChatHeaderComponents.Layout, {
|
|
18
19
|
headerBgColor,
|
|
19
20
|
variant,
|
|
@@ -5,10 +5,36 @@ const require_Container = require('../../Container/Container.cjs');
|
|
|
5
5
|
require('../../Container/index.cjs');
|
|
6
6
|
const require_useGetHandleProperties = require('../hooks/useGetHandleProperties.cjs');
|
|
7
7
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
8
|
+
let framer_motion = require("framer-motion");
|
|
8
9
|
|
|
9
10
|
//#region src/components/ChatHeader/components/Handle.tsx
|
|
10
|
-
const Handle = ({ theme, variant, state }) => {
|
|
11
|
+
const Handle = ({ theme, variant, state, animationKey }) => {
|
|
11
12
|
const { containerClasses, leftBar, rightBar } = require_useGetHandleProperties.useGetHandleProperties(theme, variant, state);
|
|
13
|
+
const snap43Percent = 57 / 100 * window.innerHeight;
|
|
14
|
+
const snap100Percent = 0;
|
|
15
|
+
const defaultAnimationKey = (0, framer_motion.useMotionValue)(0);
|
|
16
|
+
const activeAnimationKey = animationKey || defaultAnimationKey;
|
|
17
|
+
const leftRotation = (0, framer_motion.useTransform)(activeAnimationKey, [snap100Percent, snap43Percent], [0, -10]);
|
|
18
|
+
const rightRotation = (0, framer_motion.useTransform)(activeAnimationKey, [snap100Percent, snap43Percent], [0, 10]);
|
|
19
|
+
if (animationKey) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Container.Container, {
|
|
20
|
+
className: containerClasses,
|
|
21
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Stack.Stack, {
|
|
22
|
+
direction: "row",
|
|
23
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(framer_motion.motion.div, {
|
|
24
|
+
className: leftBar,
|
|
25
|
+
style: {
|
|
26
|
+
rotate: leftRotation,
|
|
27
|
+
x: 1
|
|
28
|
+
}
|
|
29
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(framer_motion.motion.div, {
|
|
30
|
+
className: rightBar,
|
|
31
|
+
style: {
|
|
32
|
+
rotate: rightRotation,
|
|
33
|
+
x: -1
|
|
34
|
+
}
|
|
35
|
+
})]
|
|
36
|
+
})
|
|
37
|
+
});
|
|
12
38
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Container.Container, {
|
|
13
39
|
className: containerClasses,
|
|
14
40
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Stack.Stack, {
|
|
@@ -4,10 +4,36 @@ import { Container } from "../../Container/Container.js";
|
|
|
4
4
|
import "../../Container/index.js";
|
|
5
5
|
import { useGetHandleProperties } from "../hooks/useGetHandleProperties.js";
|
|
6
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
|
+
import { motion, useMotionValue, useTransform } from "framer-motion";
|
|
7
8
|
|
|
8
9
|
//#region src/components/ChatHeader/components/Handle.tsx
|
|
9
|
-
const Handle = ({ theme, variant, state }) => {
|
|
10
|
+
const Handle = ({ theme, variant, state, animationKey }) => {
|
|
10
11
|
const { containerClasses, leftBar, rightBar } = useGetHandleProperties(theme, variant, state);
|
|
12
|
+
const snap43Percent = 57 / 100 * window.innerHeight;
|
|
13
|
+
const snap100Percent = 0;
|
|
14
|
+
const defaultAnimationKey = useMotionValue(0);
|
|
15
|
+
const activeAnimationKey = animationKey || defaultAnimationKey;
|
|
16
|
+
const leftRotation = useTransform(activeAnimationKey, [snap100Percent, snap43Percent], [0, -10]);
|
|
17
|
+
const rightRotation = useTransform(activeAnimationKey, [snap100Percent, snap43Percent], [0, 10]);
|
|
18
|
+
if (animationKey) return /* @__PURE__ */ jsx(Container, {
|
|
19
|
+
className: containerClasses,
|
|
20
|
+
children: /* @__PURE__ */ jsxs(Stack, {
|
|
21
|
+
direction: "row",
|
|
22
|
+
children: [/* @__PURE__ */ jsx(motion.div, {
|
|
23
|
+
className: leftBar,
|
|
24
|
+
style: {
|
|
25
|
+
rotate: leftRotation,
|
|
26
|
+
x: 1
|
|
27
|
+
}
|
|
28
|
+
}), /* @__PURE__ */ jsx(motion.div, {
|
|
29
|
+
className: rightBar,
|
|
30
|
+
style: {
|
|
31
|
+
rotate: rightRotation,
|
|
32
|
+
x: -1
|
|
33
|
+
}
|
|
34
|
+
})]
|
|
35
|
+
})
|
|
36
|
+
});
|
|
11
37
|
return /* @__PURE__ */ jsx(Container, {
|
|
12
38
|
className: containerClasses,
|
|
13
39
|
children: /* @__PURE__ */ jsxs(Stack, {
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { Theme } from "../../tokens/theme/theme.cjs";
|
|
2
2
|
import { ColorNames } from "../../src/models/colorsConfig.cjs";
|
|
3
3
|
import React from "react";
|
|
4
|
+
import { MotionValue } from "framer-motion";
|
|
4
5
|
|
|
5
6
|
//#region src/components/ChatHeader/types/index.d.ts
|
|
6
7
|
declare enum ChatHeaderVariant {
|
|
@@ -22,6 +23,7 @@ interface ChatHeaderProps extends ToggleProps, CloseButtonProps, Omit<LayoutProp
|
|
|
22
23
|
showHandle?: boolean;
|
|
23
24
|
showMainContent?: boolean;
|
|
24
25
|
handleState?: HandleState;
|
|
26
|
+
handleAnimationKey?: MotionValue;
|
|
25
27
|
}
|
|
26
28
|
interface LayoutProps {
|
|
27
29
|
theme: Theme;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { Theme } from "../../tokens/theme/theme.js";
|
|
2
2
|
import { ColorNames } from "../../src/models/colorsConfig.js";
|
|
3
3
|
import React from "react";
|
|
4
|
+
import { MotionValue } from "framer-motion";
|
|
4
5
|
|
|
5
6
|
//#region src/components/ChatHeader/types/index.d.ts
|
|
6
7
|
declare enum ChatHeaderVariant {
|
|
@@ -22,6 +23,7 @@ interface ChatHeaderProps extends ToggleProps, CloseButtonProps, Omit<LayoutProp
|
|
|
22
23
|
showHandle?: boolean;
|
|
23
24
|
showMainContent?: boolean;
|
|
24
25
|
handleState?: HandleState;
|
|
26
|
+
handleAnimationKey?: MotionValue;
|
|
25
27
|
}
|
|
26
28
|
interface LayoutProps {
|
|
27
29
|
theme: Theme;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ChatPreviewProps } from "./types/types.cjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime33 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/ChatPreview/ChatPreview.d.ts
|
|
5
5
|
declare const ChatPreview: ({
|
|
@@ -7,6 +7,6 @@ declare const ChatPreview: ({
|
|
|
7
7
|
widgetContentProps,
|
|
8
8
|
widgetStyleProps,
|
|
9
9
|
widgetEventProps
|
|
10
|
-
}: ChatPreviewProps) =>
|
|
10
|
+
}: ChatPreviewProps) => react_jsx_runtime33.JSX.Element;
|
|
11
11
|
//#endregion
|
|
12
12
|
export { ChatPreview };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ChatPreviewProps } from "./types/types.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime27 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/ChatPreview/ChatPreview.d.ts
|
|
5
5
|
declare const ChatPreview: ({
|
|
@@ -7,6 +7,6 @@ declare const ChatPreview: ({
|
|
|
7
7
|
widgetContentProps,
|
|
8
8
|
widgetStyleProps,
|
|
9
9
|
widgetEventProps
|
|
10
|
-
}: ChatPreviewProps) =>
|
|
10
|
+
}: ChatPreviewProps) => react_jsx_runtime27.JSX.Element;
|
|
11
11
|
//#endregion
|
|
12
12
|
export { ChatPreview };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ChatPreviewComparisonProps } from "./types/types.cjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime27 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/ChatPreviewComparison/ChatPreviewComparison.d.ts
|
|
5
5
|
declare const ChatPreviewComparison: ({
|
|
@@ -7,6 +7,6 @@ declare const ChatPreviewComparison: ({
|
|
|
7
7
|
widgetContentProps,
|
|
8
8
|
widgetStyleProps,
|
|
9
9
|
widgetEventProps
|
|
10
|
-
}: ChatPreviewComparisonProps) =>
|
|
10
|
+
}: ChatPreviewComparisonProps) => react_jsx_runtime27.JSX.Element;
|
|
11
11
|
//#endregion
|
|
12
12
|
export { ChatPreviewComparison };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ChatPreviewComparisonProps } from "./types/types.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime28 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/ChatPreviewComparison/ChatPreviewComparison.d.ts
|
|
5
5
|
declare const ChatPreviewComparison: ({
|
|
@@ -7,6 +7,6 @@ declare const ChatPreviewComparison: ({
|
|
|
7
7
|
widgetContentProps,
|
|
8
8
|
widgetStyleProps,
|
|
9
9
|
widgetEventProps
|
|
10
|
-
}: ChatPreviewComparisonProps) =>
|
|
10
|
+
}: ChatPreviewComparisonProps) => react_jsx_runtime28.JSX.Element;
|
|
11
11
|
//#endregion
|
|
12
12
|
export { ChatPreviewComparison };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ChatPreviewLoadingProps } from "./types/types.cjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime19 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/ChatPreviewLoading/ChatPreviewLoading.d.ts
|
|
5
5
|
declare const ChatPreviewLoading: ({
|
|
@@ -15,6 +15,6 @@ declare const ChatPreviewLoading: ({
|
|
|
15
15
|
hideLogo,
|
|
16
16
|
logoSrc,
|
|
17
17
|
titleLabel
|
|
18
|
-
}: ChatPreviewLoadingProps) =>
|
|
18
|
+
}: ChatPreviewLoadingProps) => react_jsx_runtime19.JSX.Element;
|
|
19
19
|
//#endregion
|
|
20
20
|
export { ChatPreviewLoading };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ChatPreviewLoadingProps } from "./types/types.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime21 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/ChatPreviewLoading/ChatPreviewLoading.d.ts
|
|
5
5
|
declare const ChatPreviewLoading: ({
|
|
@@ -15,6 +15,6 @@ declare const ChatPreviewLoading: ({
|
|
|
15
15
|
hideLogo,
|
|
16
16
|
logoSrc,
|
|
17
17
|
titleLabel
|
|
18
|
-
}: ChatPreviewLoadingProps) =>
|
|
18
|
+
}: ChatPreviewLoadingProps) => react_jsx_runtime21.JSX.Element;
|
|
19
19
|
//#endregion
|
|
20
20
|
export { ChatPreviewLoading };
|