@yext/chat-ui-react 0.12.1 → 0.12.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.
- package/package.json +14 -3
- package/lib/bundle.css +0 -1
- package/lib/commonjs/package.json.js +0 -6
- package/lib/commonjs/package.json.js.map +0 -1
- package/lib/commonjs/src/components/ChatHeader.d.ts +0 -53
- package/lib/commonjs/src/components/ChatHeader.d.ts.map +0 -1
- package/lib/commonjs/src/components/ChatHeader.js +0 -52
- package/lib/commonjs/src/components/ChatHeader.js.map +0 -1
- package/lib/commonjs/src/components/ChatInput.d.ts +0 -60
- package/lib/commonjs/src/components/ChatInput.d.ts.map +0 -1
- package/lib/commonjs/src/components/ChatInput.js +0 -76
- package/lib/commonjs/src/components/ChatInput.js.map +0 -1
- package/lib/commonjs/src/components/ChatPanel.d.ts +0 -74
- package/lib/commonjs/src/components/ChatPanel.d.ts.map +0 -1
- package/lib/commonjs/src/components/ChatPanel.js +0 -178
- package/lib/commonjs/src/components/ChatPanel.js.map +0 -1
- package/lib/commonjs/src/components/ChatPopUp.d.ts +0 -76
- package/lib/commonjs/src/components/ChatPopUp.d.ts.map +0 -1
- package/lib/commonjs/src/components/ChatPopUp.js +0 -160
- package/lib/commonjs/src/components/ChatPopUp.js.map +0 -1
- package/lib/commonjs/src/components/FeedbackButtons.d.ts +0 -35
- package/lib/commonjs/src/components/FeedbackButtons.d.ts.map +0 -1
- package/lib/commonjs/src/components/FeedbackButtons.js +0 -59
- package/lib/commonjs/src/components/FeedbackButtons.js.map +0 -1
- package/lib/commonjs/src/components/InitialMessagePopUp.d.ts +0 -33
- package/lib/commonjs/src/components/InitialMessagePopUp.d.ts.map +0 -1
- package/lib/commonjs/src/components/InitialMessagePopUp.js +0 -44
- package/lib/commonjs/src/components/InitialMessagePopUp.js.map +0 -1
- package/lib/commonjs/src/components/LoadingDots.d.ts +0 -10
- package/lib/commonjs/src/components/LoadingDots.d.ts.map +0 -1
- package/lib/commonjs/src/components/LoadingDots.js +0 -23
- package/lib/commonjs/src/components/LoadingDots.js.map +0 -1
- package/lib/commonjs/src/components/Markdown.d.ts +0 -39
- package/lib/commonjs/src/components/Markdown.d.ts.map +0 -1
- package/lib/commonjs/src/components/Markdown.js +0 -72
- package/lib/commonjs/src/components/Markdown.js.map +0 -1
- package/lib/commonjs/src/components/MessageBubble.d.ts +0 -64
- package/lib/commonjs/src/components/MessageBubble.d.ts.map +0 -1
- package/lib/commonjs/src/components/MessageBubble.js +0 -77
- package/lib/commonjs/src/components/MessageBubble.js.map +0 -1
- package/lib/commonjs/src/components/MessageSuggestions.d.ts +0 -37
- package/lib/commonjs/src/components/MessageSuggestions.d.ts.map +0 -1
- package/lib/commonjs/src/components/MessageSuggestions.js +0 -55
- package/lib/commonjs/src/components/MessageSuggestions.js.map +0 -1
- package/lib/commonjs/src/components/index.d.ts +0 -14
- package/lib/commonjs/src/components/index.d.ts.map +0 -1
- package/lib/commonjs/src/hooks/index.d.ts +0 -3
- package/lib/commonjs/src/hooks/index.d.ts.map +0 -1
- package/lib/commonjs/src/hooks/useComposedCssClasses.d.ts +0 -30
- package/lib/commonjs/src/hooks/useComposedCssClasses.d.ts.map +0 -1
- package/lib/commonjs/src/hooks/useComposedCssClasses.js +0 -61
- package/lib/commonjs/src/hooks/useComposedCssClasses.js.map +0 -1
- package/lib/commonjs/src/hooks/useDefaultHandleApiError.d.ts +0 -8
- package/lib/commonjs/src/hooks/useDefaultHandleApiError.d.ts.map +0 -1
- package/lib/commonjs/src/hooks/useDefaultHandleApiError.js +0 -25
- package/lib/commonjs/src/hooks/useDefaultHandleApiError.js.map +0 -1
- package/lib/commonjs/src/hooks/useFetchInitialMessage.d.ts +0 -13
- package/lib/commonjs/src/hooks/useFetchInitialMessage.d.ts.map +0 -1
- package/lib/commonjs/src/hooks/useFetchInitialMessage.js +0 -41
- package/lib/commonjs/src/hooks/useFetchInitialMessage.js.map +0 -1
- package/lib/commonjs/src/hooks/useReportAnalyticsEvent.d.ts +0 -8
- package/lib/commonjs/src/hooks/useReportAnalyticsEvent.d.ts.map +0 -1
- package/lib/commonjs/src/hooks/useReportAnalyticsEvent.js +0 -21
- package/lib/commonjs/src/hooks/useReportAnalyticsEvent.js.map +0 -1
- package/lib/commonjs/src/hooks/useSendMessageWithRetries.d.ts +0 -17
- package/lib/commonjs/src/hooks/useSendMessageWithRetries.d.ts.map +0 -1
- package/lib/commonjs/src/hooks/useSendMessageWithRetries.js +0 -54
- package/lib/commonjs/src/hooks/useSendMessageWithRetries.js.map +0 -1
- package/lib/commonjs/src/icons/Arrow.d.ts +0 -3
- package/lib/commonjs/src/icons/Arrow.d.ts.map +0 -1
- package/lib/commonjs/src/icons/Arrow.js +0 -16
- package/lib/commonjs/src/icons/Arrow.js.map +0 -1
- package/lib/commonjs/src/icons/Chat.d.ts +0 -5
- package/lib/commonjs/src/icons/Chat.d.ts.map +0 -1
- package/lib/commonjs/src/icons/Chat.js +0 -20
- package/lib/commonjs/src/icons/Chat.js.map +0 -1
- package/lib/commonjs/src/icons/Cross.d.ts +0 -5
- package/lib/commonjs/src/icons/Cross.d.ts.map +0 -1
- package/lib/commonjs/src/icons/Cross.js +0 -16
- package/lib/commonjs/src/icons/Cross.js.map +0 -1
- package/lib/commonjs/src/icons/DualSync.d.ts +0 -5
- package/lib/commonjs/src/icons/DualSync.d.ts.map +0 -1
- package/lib/commonjs/src/icons/DualSync.js +0 -16
- package/lib/commonjs/src/icons/DualSync.js.map +0 -1
- package/lib/commonjs/src/icons/ThumbsDown.d.ts +0 -5
- package/lib/commonjs/src/icons/ThumbsDown.d.ts.map +0 -1
- package/lib/commonjs/src/icons/ThumbsDown.js +0 -15
- package/lib/commonjs/src/icons/ThumbsDown.js.map +0 -1
- package/lib/commonjs/src/icons/ThumbsDownFill.d.ts +0 -5
- package/lib/commonjs/src/icons/ThumbsDownFill.d.ts.map +0 -1
- package/lib/commonjs/src/icons/ThumbsDownFill.js +0 -15
- package/lib/commonjs/src/icons/ThumbsDownFill.js.map +0 -1
- package/lib/commonjs/src/icons/ThumbsUp.d.ts +0 -5
- package/lib/commonjs/src/icons/ThumbsUp.d.ts.map +0 -1
- package/lib/commonjs/src/icons/ThumbsUp.js +0 -15
- package/lib/commonjs/src/icons/ThumbsUp.js.map +0 -1
- package/lib/commonjs/src/icons/ThumbsUpFill.d.ts +0 -5
- package/lib/commonjs/src/icons/ThumbsUpFill.d.ts.map +0 -1
- package/lib/commonjs/src/icons/ThumbsUpFill.js +0 -15
- package/lib/commonjs/src/icons/ThumbsUpFill.js.map +0 -1
- package/lib/commonjs/src/index.d.ts +0 -3
- package/lib/commonjs/src/index.d.ts.map +0 -1
- package/lib/commonjs/src/index.js +0 -20
- package/lib/commonjs/src/index.js.map +0 -1
- package/lib/commonjs/src/tsdoc-metadata.json +0 -11
- package/lib/commonjs/src/utils/withStylelessCssClasses.d.ts +0 -17
- package/lib/commonjs/src/utils/withStylelessCssClasses.d.ts.map +0 -1
- package/lib/commonjs/src/utils/withStylelessCssClasses.js +0 -30
- package/lib/commonjs/src/utils/withStylelessCssClasses.js.map +0 -1
- package/lib/esm/index.d.ts +0 -411
- package/lib/esm/package.json.mjs +0 -4
- package/lib/esm/package.json.mjs.map +0 -1
- package/lib/esm/src/components/ChatHeader.d.ts +0 -53
- package/lib/esm/src/components/ChatHeader.d.ts.map +0 -1
- package/lib/esm/src/components/ChatHeader.mjs +0 -46
- package/lib/esm/src/components/ChatHeader.mjs.map +0 -1
- package/lib/esm/src/components/ChatInput.d.ts +0 -60
- package/lib/esm/src/components/ChatInput.d.ts.map +0 -1
- package/lib/esm/src/components/ChatInput.mjs +0 -69
- package/lib/esm/src/components/ChatInput.mjs.map +0 -1
- package/lib/esm/src/components/ChatPanel.d.ts +0 -74
- package/lib/esm/src/components/ChatPanel.d.ts.map +0 -1
- package/lib/esm/src/components/ChatPanel.mjs +0 -169
- package/lib/esm/src/components/ChatPanel.mjs.map +0 -1
- package/lib/esm/src/components/ChatPopUp.d.ts +0 -76
- package/lib/esm/src/components/ChatPopUp.d.ts.map +0 -1
- package/lib/esm/src/components/ChatPopUp.mjs +0 -154
- package/lib/esm/src/components/ChatPopUp.mjs.map +0 -1
- package/lib/esm/src/components/FeedbackButtons.d.ts +0 -35
- package/lib/esm/src/components/FeedbackButtons.d.ts.map +0 -1
- package/lib/esm/src/components/FeedbackButtons.mjs +0 -53
- package/lib/esm/src/components/FeedbackButtons.mjs.map +0 -1
- package/lib/esm/src/components/InitialMessagePopUp.d.ts +0 -33
- package/lib/esm/src/components/InitialMessagePopUp.d.ts.map +0 -1
- package/lib/esm/src/components/InitialMessagePopUp.mjs +0 -38
- package/lib/esm/src/components/InitialMessagePopUp.mjs.map +0 -1
- package/lib/esm/src/components/LoadingDots.d.ts +0 -10
- package/lib/esm/src/components/LoadingDots.d.ts.map +0 -1
- package/lib/esm/src/components/LoadingDots.mjs +0 -17
- package/lib/esm/src/components/LoadingDots.mjs.map +0 -1
- package/lib/esm/src/components/Markdown.d.ts +0 -39
- package/lib/esm/src/components/Markdown.d.ts.map +0 -1
- package/lib/esm/src/components/Markdown.mjs +0 -62
- package/lib/esm/src/components/Markdown.mjs.map +0 -1
- package/lib/esm/src/components/MessageBubble.d.ts +0 -64
- package/lib/esm/src/components/MessageBubble.d.ts.map +0 -1
- package/lib/esm/src/components/MessageBubble.mjs +0 -71
- package/lib/esm/src/components/MessageBubble.mjs.map +0 -1
- package/lib/esm/src/components/MessageSuggestions.d.ts +0 -37
- package/lib/esm/src/components/MessageSuggestions.d.ts.map +0 -1
- package/lib/esm/src/components/MessageSuggestions.mjs +0 -49
- package/lib/esm/src/components/MessageSuggestions.mjs.map +0 -1
- package/lib/esm/src/components/index.d.ts +0 -14
- package/lib/esm/src/components/index.d.ts.map +0 -1
- package/lib/esm/src/hooks/index.d.ts +0 -3
- package/lib/esm/src/hooks/index.d.ts.map +0 -1
- package/lib/esm/src/hooks/useComposedCssClasses.d.ts +0 -30
- package/lib/esm/src/hooks/useComposedCssClasses.d.ts.map +0 -1
- package/lib/esm/src/hooks/useComposedCssClasses.mjs +0 -59
- package/lib/esm/src/hooks/useComposedCssClasses.mjs.map +0 -1
- package/lib/esm/src/hooks/useDefaultHandleApiError.d.ts +0 -8
- package/lib/esm/src/hooks/useDefaultHandleApiError.d.ts.map +0 -1
- package/lib/esm/src/hooks/useDefaultHandleApiError.mjs +0 -23
- package/lib/esm/src/hooks/useDefaultHandleApiError.mjs.map +0 -1
- package/lib/esm/src/hooks/useFetchInitialMessage.d.ts +0 -13
- package/lib/esm/src/hooks/useFetchInitialMessage.d.ts.map +0 -1
- package/lib/esm/src/hooks/useFetchInitialMessage.mjs +0 -39
- package/lib/esm/src/hooks/useFetchInitialMessage.mjs.map +0 -1
- package/lib/esm/src/hooks/useReportAnalyticsEvent.d.ts +0 -8
- package/lib/esm/src/hooks/useReportAnalyticsEvent.d.ts.map +0 -1
- package/lib/esm/src/hooks/useReportAnalyticsEvent.mjs +0 -19
- package/lib/esm/src/hooks/useReportAnalyticsEvent.mjs.map +0 -1
- package/lib/esm/src/hooks/useSendMessageWithRetries.d.ts +0 -17
- package/lib/esm/src/hooks/useSendMessageWithRetries.d.ts.map +0 -1
- package/lib/esm/src/hooks/useSendMessageWithRetries.mjs +0 -52
- package/lib/esm/src/hooks/useSendMessageWithRetries.mjs.map +0 -1
- package/lib/esm/src/icons/Arrow.d.ts +0 -3
- package/lib/esm/src/icons/Arrow.d.ts.map +0 -1
- package/lib/esm/src/icons/Arrow.mjs +0 -10
- package/lib/esm/src/icons/Arrow.mjs.map +0 -1
- package/lib/esm/src/icons/Chat.d.ts +0 -5
- package/lib/esm/src/icons/Chat.d.ts.map +0 -1
- package/lib/esm/src/icons/Chat.mjs +0 -14
- package/lib/esm/src/icons/Chat.mjs.map +0 -1
- package/lib/esm/src/icons/Cross.d.ts +0 -5
- package/lib/esm/src/icons/Cross.d.ts.map +0 -1
- package/lib/esm/src/icons/Cross.mjs +0 -10
- package/lib/esm/src/icons/Cross.mjs.map +0 -1
- package/lib/esm/src/icons/DualSync.d.ts +0 -5
- package/lib/esm/src/icons/DualSync.d.ts.map +0 -1
- package/lib/esm/src/icons/DualSync.mjs +0 -10
- package/lib/esm/src/icons/DualSync.mjs.map +0 -1
- package/lib/esm/src/icons/ThumbsDown.d.ts +0 -5
- package/lib/esm/src/icons/ThumbsDown.d.ts.map +0 -1
- package/lib/esm/src/icons/ThumbsDown.mjs +0 -9
- package/lib/esm/src/icons/ThumbsDown.mjs.map +0 -1
- package/lib/esm/src/icons/ThumbsDownFill.d.ts +0 -5
- package/lib/esm/src/icons/ThumbsDownFill.d.ts.map +0 -1
- package/lib/esm/src/icons/ThumbsDownFill.mjs +0 -9
- package/lib/esm/src/icons/ThumbsDownFill.mjs.map +0 -1
- package/lib/esm/src/icons/ThumbsUp.d.ts +0 -5
- package/lib/esm/src/icons/ThumbsUp.d.ts.map +0 -1
- package/lib/esm/src/icons/ThumbsUp.mjs +0 -9
- package/lib/esm/src/icons/ThumbsUp.mjs.map +0 -1
- package/lib/esm/src/icons/ThumbsUpFill.d.ts +0 -5
- package/lib/esm/src/icons/ThumbsUpFill.d.ts.map +0 -1
- package/lib/esm/src/icons/ThumbsUpFill.mjs +0 -9
- package/lib/esm/src/icons/ThumbsUpFill.mjs.map +0 -1
- package/lib/esm/src/index.d.ts +0 -3
- package/lib/esm/src/index.d.ts.map +0 -1
- package/lib/esm/src/index.mjs +0 -8
- package/lib/esm/src/index.mjs.map +0 -1
- package/lib/esm/src/utils/withStylelessCssClasses.d.ts +0 -17
- package/lib/esm/src/utils/withStylelessCssClasses.d.ts.map +0 -1
- package/lib/esm/src/utils/withStylelessCssClasses.mjs +0 -28
- package/lib/esm/src/utils/withStylelessCssClasses.mjs.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ThumbsUpFill.js","sources":["../../../../src/icons/ThumbsUpFill.tsx"],"sourcesContent":["import React from \"react\";\n\nexport function ThumbsUpFillIcon({\n className,\n}: {\n className?: string;\n}): JSX.Element {\n return (\n <svg\n width=\"100%\"\n height=\"100%\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n className={className}\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M14.059 10.5061C14.5293 11.8877 13.2864 12.5128 13.2864 12.5128C13.5887 13.7299 12.4802 14.322 12.4802 14.322C12.413 16.0655 10.8006 15.9997 10.8006 15.9997C9.89359 15.9997 8.85223 15.9997 8.85223 15.9997C7.91166 15.901 7.27341 15.5391 7.27341 15.5391C6.29924 15.0457 5.79536 14.5852 5.52663 14.2233C5.52663 14.2233 4.51887 11.6904 5.29148 8.89426C5.33673 8.73052 5.35867 8.69688 5.39226 8.63109C5.45944 8.43372 5.52663 8.36793 5.52663 8.36793C6.0641 8.00608 6.73594 7.18369 6.73594 7.18369C7.27341 6.69026 7.7437 5.27576 7.7437 5.27576C8.07962 4.12442 8.88583 4.02573 8.88583 4.02573C11.0357 3.76257 11.0021 5.60471 11.0021 5.60471C11.0021 6.32841 10.4982 7.41396 10.4982 7.41396H13.5215C15.0668 7.71002 14.9996 9.05873 14.9996 9.05873C14.9996 10.1772 14.0254 10.539 14.0254 10.539L14.059 10.5061Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\n"],"names":["React"],"mappings":";;;;;;;;AAEgB,SAAA,gBAAgB,CAAC,EAC/B,SAAS,GAGV,EAAA;IACC,QACEA,sBACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,SAAS,EACpB,KAAK,EAAC,4BAA4B,EAAA;QAElCA,sBACE,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,gyBAAgyB,EAClyB,IAAI,EAAC,cAAc,EAAA,CACnB,CACE,EACN;AACJ;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC"}
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var ChatInput = require('./components/ChatInput.js');
|
|
4
|
-
var ChatHeader = require('./components/ChatHeader.js');
|
|
5
|
-
var MessageBubble = require('./components/MessageBubble.js');
|
|
6
|
-
var ChatPanel = require('./components/ChatPanel.js');
|
|
7
|
-
var ChatPopUp = require('./components/ChatPopUp.js');
|
|
8
|
-
var useComposedCssClasses = require('./hooks/useComposedCssClasses.js');
|
|
9
|
-
var useReportAnalyticsEvent = require('./hooks/useReportAnalyticsEvent.js');
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
exports.ChatInput = ChatInput.ChatInput;
|
|
14
|
-
exports.ChatHeader = ChatHeader.ChatHeader;
|
|
15
|
-
exports.MessageBubble = MessageBubble.MessageBubble;
|
|
16
|
-
exports.ChatPanel = ChatPanel.ChatPanel;
|
|
17
|
-
exports.ChatPopUp = ChatPopUp.ChatPopUp;
|
|
18
|
-
exports.useComposedCssClasses = useComposedCssClasses.useComposedCssClasses;
|
|
19
|
-
exports.useReportAnalyticsEvent = useReportAnalyticsEvent.useReportAnalyticsEvent;
|
|
20
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
// This file is read by tools that parse documentation comments conforming to the TSDoc standard.
|
|
2
|
-
// It should be published with your NPM package. It should not be tracked by Git.
|
|
3
|
-
{
|
|
4
|
-
"tsdocVersion": "0.12",
|
|
5
|
-
"toolPackages": [
|
|
6
|
-
{
|
|
7
|
-
"packageName": "@microsoft/api-extractor",
|
|
8
|
-
"packageVersion": "7.35.1"
|
|
9
|
-
}
|
|
10
|
-
]
|
|
11
|
-
}
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Append styleless css classnames that user can target to add custom styling to components.
|
|
3
|
-
* The classes follows a format of "yext-chat-component-name__css-interface-field-name".
|
|
4
|
-
*
|
|
5
|
-
* @example
|
|
6
|
-
* the styleless css class name for {@link MessageBubble}'s "message__bot" field defined
|
|
7
|
-
* in its {@link MessageBubbleCssClasses} interface is "yext-chat-message-bubble__message__bot"
|
|
8
|
-
*
|
|
9
|
-
* @internal
|
|
10
|
-
*
|
|
11
|
-
* @param componentName - the component name
|
|
12
|
-
* @param builtInClasses - built in css classnames of the component
|
|
13
|
-
*
|
|
14
|
-
* @returns builtInClasses with styleless css classnames
|
|
15
|
-
*/
|
|
16
|
-
export declare function withStylelessCssClasses<ClassInterface extends Partial<Record<keyof ClassInterface, string | object>>>(componentName: string, builtInClasses: Readonly<Required<ClassInterface>>): ClassInterface;
|
|
17
|
-
//# sourceMappingURL=withStylelessCssClasses.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"withStylelessCssClasses.d.ts","sourceRoot":"","sources":["../../../../src/utils/withStylelessCssClasses.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,uBAAuB,CACrC,cAAc,SAAS,OAAO,CAAC,MAAM,CAAC,MAAM,cAAc,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC,EAE7E,aAAa,EAAE,MAAM,EACrB,cAAc,EAAE,QAAQ,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC,GACjD,cAAc,CAYhB"}
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* Append styleless css classnames that user can target to add custom styling to components.
|
|
5
|
-
* The classes follows a format of "yext-chat-component-name__css-interface-field-name".
|
|
6
|
-
*
|
|
7
|
-
* @example
|
|
8
|
-
* the styleless css class name for {@link MessageBubble}'s "message__bot" field defined
|
|
9
|
-
* in its {@link MessageBubbleCssClasses} interface is "yext-chat-message-bubble__message__bot"
|
|
10
|
-
*
|
|
11
|
-
* @internal
|
|
12
|
-
*
|
|
13
|
-
* @param componentName - the component name
|
|
14
|
-
* @param builtInClasses - built in css classnames of the component
|
|
15
|
-
*
|
|
16
|
-
* @returns builtInClasses with styleless css classnames
|
|
17
|
-
*/
|
|
18
|
-
function withStylelessCssClasses(componentName, builtInClasses) {
|
|
19
|
-
const formatString = (str) => str.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);
|
|
20
|
-
const classes = { ...builtInClasses };
|
|
21
|
-
Object.keys(builtInClasses).forEach((key) => {
|
|
22
|
-
if (typeof classes[key] === "string") {
|
|
23
|
-
classes[key] = `${classes[key]} yext-chat${formatString(componentName)}__${formatString(key)}`;
|
|
24
|
-
}
|
|
25
|
-
});
|
|
26
|
-
return classes;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
exports.withStylelessCssClasses = withStylelessCssClasses;
|
|
30
|
-
//# sourceMappingURL=withStylelessCssClasses.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"withStylelessCssClasses.js","sources":["../../../../src/utils/withStylelessCssClasses.ts"],"sourcesContent":["/**\n * Append styleless css classnames that user can target to add custom styling to components.\n * The classes follows a format of \"yext-chat-component-name__css-interface-field-name\".\n *\n * @example\n * the styleless css class name for {@link MessageBubble}'s \"message__bot\" field defined\n * in its {@link MessageBubbleCssClasses} interface is \"yext-chat-message-bubble__message__bot\"\n *\n * @internal\n *\n * @param componentName - the component name\n * @param builtInClasses - built in css classnames of the component\n *\n * @returns builtInClasses with styleless css classnames\n */\nexport function withStylelessCssClasses<\n ClassInterface extends Partial<Record<keyof ClassInterface, string | object>>\n>(\n componentName: string,\n builtInClasses: Readonly<Required<ClassInterface>>\n): ClassInterface {\n const formatString = (str: string) =>\n str.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);\n const classes = { ...builtInClasses };\n Object.keys(builtInClasses).forEach((key) => {\n if (typeof classes[key] === \"string\") {\n classes[key] = `${classes[key]} yext-chat${formatString(\n componentName\n )}__${formatString(key)}`;\n }\n });\n return classes;\n}\n"],"names":[],"mappings":";;AAAA;;;;;;;;;;;;;;AAcG;AACa,SAAA,uBAAuB,CAGrC,aAAqB,EACrB,cAAkD,EAAA;IAElD,MAAM,YAAY,GAAG,CAAC,GAAW,KAC/B,GAAG,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,KAAK,KAAK,CAAA,CAAA,EAAI,KAAK,CAAC,WAAW,EAAE,CAAE,CAAA,CAAC,CAAC;AAC9D,IAAA,MAAM,OAAO,GAAG,EAAE,GAAG,cAAc,EAAE,CAAC;IACtC,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,KAAI;AAC1C,QAAA,IAAI,OAAO,OAAO,CAAC,GAAG,CAAC,KAAK,QAAQ,EAAE;YACpC,OAAO,CAAC,GAAG,CAAC,GAAG,GAAG,OAAO,CAAC,GAAG,CAAC,CAAA,UAAA,EAAa,YAAY,CACrD,aAAa,CACd,CAAK,EAAA,EAAA,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC;AAC3B,SAAA;AACH,KAAC,CAAC,CAAC;AACH,IAAA,OAAO,OAAO,CAAC;AACjB;;;;"}
|
package/lib/esm/index.d.ts
DELETED
|
@@ -1,411 +0,0 @@
|
|
|
1
|
-
import { ChatHeadless } from '@yext/chat-headless-react';
|
|
2
|
-
import { Message } from '@yext/chat-headless-react';
|
|
3
|
-
import { default as React_2 } from 'react';
|
|
4
|
-
import { ReactNode } from 'react';
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* A component that renders the header of a chat bot panel,
|
|
8
|
-
* including the title and a button to reset the conversation.
|
|
9
|
-
*
|
|
10
|
-
* @public
|
|
11
|
-
*
|
|
12
|
-
* @param props - {@link ChatHeaderProps}
|
|
13
|
-
*/
|
|
14
|
-
export declare function ChatHeader({ title, showRestartButton, restartButtonIcon, showCloseButton, closeButtonIcon, onClose, customCssClasses, }: ChatHeaderProps): React_2.JSX.Element;
|
|
15
|
-
|
|
16
|
-
/**
|
|
17
|
-
* The CSS class interface for the {@link ChatHeader} component.
|
|
18
|
-
*
|
|
19
|
-
* @public
|
|
20
|
-
*/
|
|
21
|
-
export declare interface ChatHeaderCssClasses {
|
|
22
|
-
container?: string;
|
|
23
|
-
title?: string;
|
|
24
|
-
restartButton?: string;
|
|
25
|
-
restartButtonIcon?: string;
|
|
26
|
-
closeButton?: string;
|
|
27
|
-
closeButtonIcon?: string;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
/**
|
|
31
|
-
* The props for the {@link ChatHeader} component.
|
|
32
|
-
*
|
|
33
|
-
* @public
|
|
34
|
-
*/
|
|
35
|
-
export declare interface ChatHeaderProps {
|
|
36
|
-
/**
|
|
37
|
-
* The headers's title text, essentially how the chat window identifies itself to the user.
|
|
38
|
-
*/
|
|
39
|
-
title: string;
|
|
40
|
-
/**
|
|
41
|
-
* Displays a restart button which allows the user to restart the conversation.
|
|
42
|
-
* Defaults to false.
|
|
43
|
-
*/
|
|
44
|
-
showRestartButton?: boolean;
|
|
45
|
-
/**
|
|
46
|
-
* Displays a close button which will invoke {@link ChatHeaderProps.onClose} on click.
|
|
47
|
-
* Default to false.
|
|
48
|
-
*/
|
|
49
|
-
showCloseButton?: boolean;
|
|
50
|
-
/** A function which is called when the close button is clicked. */
|
|
51
|
-
onClose?: () => void;
|
|
52
|
-
/** Custom icon for for restart button. */
|
|
53
|
-
restartButtonIcon?: JSX.Element;
|
|
54
|
-
/** Custom icon for for close button. */
|
|
55
|
-
closeButtonIcon?: JSX.Element;
|
|
56
|
-
/** CSS classes for customizing the component styling. */
|
|
57
|
-
customCssClasses?: ChatHeaderCssClasses;
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
/**
|
|
61
|
-
* A component that allows user to input message and send to Chat API.
|
|
62
|
-
*
|
|
63
|
-
* @remarks
|
|
64
|
-
* Pressing "Enter" key will send the current message.
|
|
65
|
-
* To add a newline, press "Shift" and "Enter".
|
|
66
|
-
*
|
|
67
|
-
* @public
|
|
68
|
-
*
|
|
69
|
-
* @param props - {@link ChatInputProps}
|
|
70
|
-
*/
|
|
71
|
-
export declare function ChatInput({ placeholder, stream, inputAutoFocus, handleError, sendButtonIcon, customCssClasses, onSend, onRetry, }: ChatInputProps): React_2.JSX.Element;
|
|
72
|
-
|
|
73
|
-
/**
|
|
74
|
-
* The CSS class interface for the {@link ChatInput} component.
|
|
75
|
-
*
|
|
76
|
-
* @public
|
|
77
|
-
*/
|
|
78
|
-
export declare interface ChatInputCssClasses {
|
|
79
|
-
container?: string;
|
|
80
|
-
textArea?: string;
|
|
81
|
-
sendButton?: string;
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
/**
|
|
85
|
-
* The props for the {@link ChatInput} component.
|
|
86
|
-
*
|
|
87
|
-
* @public
|
|
88
|
-
*/
|
|
89
|
-
export declare interface ChatInputProps {
|
|
90
|
-
/**
|
|
91
|
-
* The input's placeholder text when no text has been entered by the user.
|
|
92
|
-
* Defaults to "Type a message...".
|
|
93
|
-
*/
|
|
94
|
-
placeholder?: string;
|
|
95
|
-
/**
|
|
96
|
-
* Enable streaming behavior by making a request to Chat Streaming API.
|
|
97
|
-
* This feature is experimental, and is subject to change.
|
|
98
|
-
* Defaults to false.
|
|
99
|
-
*/
|
|
100
|
-
stream?: boolean;
|
|
101
|
-
/** Enable auto focus for the input box. Defaults to false. */
|
|
102
|
-
inputAutoFocus?: boolean;
|
|
103
|
-
/**
|
|
104
|
-
* A function which is called when an error occurs from Chat API while processing the user's message.
|
|
105
|
-
* By default, the error is logged to the console and an error message is added to state.
|
|
106
|
-
*/
|
|
107
|
-
handleError?: (e: unknown) => void;
|
|
108
|
-
/** Custom icon for the send button. */
|
|
109
|
-
sendButtonIcon?: JSX.Element;
|
|
110
|
-
/** CSS classes for customizing the component styling. */
|
|
111
|
-
customCssClasses?: ChatInputCssClasses;
|
|
112
|
-
/** A callback which is called when user sends a message. */
|
|
113
|
-
onSend?: (message: string) => void;
|
|
114
|
-
/**
|
|
115
|
-
* A function which is called when a retryable error occurs from
|
|
116
|
-
* Chat API while processing the user's message.
|
|
117
|
-
*/
|
|
118
|
-
onRetry?: (e: unknown) => void;
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
/**
|
|
122
|
-
* A component that renders a full panel for chat bot interactions. This includes
|
|
123
|
-
* the message bubbles for the conversation, input box with send button, and header
|
|
124
|
-
* (if provided).
|
|
125
|
-
*
|
|
126
|
-
* @public
|
|
127
|
-
*
|
|
128
|
-
* @param props - {@link ChatPanelProps}
|
|
129
|
-
*/
|
|
130
|
-
export declare function ChatPanel(props: ChatPanelProps): React_2.JSX.Element;
|
|
131
|
-
|
|
132
|
-
/**
|
|
133
|
-
* The CSS class interface for the {@link ChatPanel} component.
|
|
134
|
-
*
|
|
135
|
-
* @public
|
|
136
|
-
*/
|
|
137
|
-
export declare interface ChatPanelCssClasses {
|
|
138
|
-
container?: string;
|
|
139
|
-
messagesContainer?: string;
|
|
140
|
-
messagesScrollContainer?: string;
|
|
141
|
-
inputContainer?: string;
|
|
142
|
-
inputCssClasses?: ChatInputCssClasses;
|
|
143
|
-
messageBubbleCssClasses?: MessageBubbleCssClasses;
|
|
144
|
-
messageSuggestionClasses?: MessageSuggestionCssClasses;
|
|
145
|
-
footer?: string;
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
/**
|
|
149
|
-
* The props for the {@link ChatPanel} component.
|
|
150
|
-
*
|
|
151
|
-
* @public
|
|
152
|
-
*/
|
|
153
|
-
export declare interface ChatPanelProps extends Omit<MessageBubbleProps, "customCssClasses" | "message">, Omit<ChatInputProps, "customCssClasses"> {
|
|
154
|
-
/** A header to render at the top of the panel. */
|
|
155
|
-
header?: ReactNode;
|
|
156
|
-
/** A footer markdown string to render at the bottom of the panel. */
|
|
157
|
-
footer?: string;
|
|
158
|
-
/**
|
|
159
|
-
* CSS classes for customizing the component styling.
|
|
160
|
-
*/
|
|
161
|
-
customCssClasses?: ChatPanelCssClasses;
|
|
162
|
-
/**
|
|
163
|
-
* A set of pre-written initial messages that the user
|
|
164
|
-
* can click on instead of typing their own.
|
|
165
|
-
*/
|
|
166
|
-
messageSuggestions?: string[];
|
|
167
|
-
/** Link target open behavior on click.
|
|
168
|
-
* Defaults to "_blank".
|
|
169
|
-
*/
|
|
170
|
-
linkTarget?: string;
|
|
171
|
-
/** A callback which is called when user clicks a link. */
|
|
172
|
-
onLinkClick?: (href?: string) => void;
|
|
173
|
-
/**
|
|
174
|
-
* Text to display when retrying.
|
|
175
|
-
* Defaults to "Error occurred. Retrying".
|
|
176
|
-
*/
|
|
177
|
-
retryText?: string;
|
|
178
|
-
}
|
|
179
|
-
|
|
180
|
-
/**
|
|
181
|
-
* A component that renders a popup button that displays and hides
|
|
182
|
-
* a panel for chat bot interactions.
|
|
183
|
-
*
|
|
184
|
-
* @public
|
|
185
|
-
*
|
|
186
|
-
* @param props - {@link ChatPanelProps}
|
|
187
|
-
*/
|
|
188
|
-
export declare function ChatPopUp(props: ChatPopUpProps): React_2.JSX.Element;
|
|
189
|
-
|
|
190
|
-
/**
|
|
191
|
-
* The CSS class interface for the {@link ChatPopUp} component.
|
|
192
|
-
*
|
|
193
|
-
* @public
|
|
194
|
-
*/
|
|
195
|
-
export declare interface ChatPopUpCssClasses {
|
|
196
|
-
container?: string;
|
|
197
|
-
panel?: string;
|
|
198
|
-
panel__display?: string;
|
|
199
|
-
panel__hidden?: string;
|
|
200
|
-
button?: string;
|
|
201
|
-
buttonIcon?: string;
|
|
202
|
-
ctaLabelContainer?: string;
|
|
203
|
-
ctaLabel?: string;
|
|
204
|
-
notification?: string;
|
|
205
|
-
closedPopupContainer?: string;
|
|
206
|
-
closedPopupContainer__display?: string;
|
|
207
|
-
closedPopupContainer__hidden?: string;
|
|
208
|
-
headerCssClasses?: ChatHeaderCssClasses;
|
|
209
|
-
panelCssClasses?: ChatPanelCssClasses;
|
|
210
|
-
initialMessagePopUpCssClasses?: InitialMessagePopUpCssClasses;
|
|
211
|
-
}
|
|
212
|
-
|
|
213
|
-
/**
|
|
214
|
-
* The props for the {@link ChatPopUp} component.
|
|
215
|
-
*
|
|
216
|
-
* @public
|
|
217
|
-
*/
|
|
218
|
-
export declare interface ChatPopUpProps extends Omit<ChatHeaderProps, "showCloseButton" | "customCssClasses">, Omit<ChatPanelProps, "header" | "customCssClasses"> {
|
|
219
|
-
/** Custom icon for the popup button to open the panel. */
|
|
220
|
-
openPanelButtonIcon?: JSX.Element;
|
|
221
|
-
/** CSS classes for customizing the component styling. */
|
|
222
|
-
customCssClasses?: ChatPopUpCssClasses;
|
|
223
|
-
/** Whether to show the panel on load. Defaults to false. */
|
|
224
|
-
openOnLoad?: boolean;
|
|
225
|
-
/**
|
|
226
|
-
* Whether to show the initial message popup when the panel is hidden on load.
|
|
227
|
-
* Defaults to false.
|
|
228
|
-
*/
|
|
229
|
-
showInitialMessagePopUp?: boolean;
|
|
230
|
-
/**
|
|
231
|
-
* Whether to show a heartbeat animation on the popup button when the panel is hidden.
|
|
232
|
-
* Defaults to false.
|
|
233
|
-
*/
|
|
234
|
-
showHeartBeatAnimation?: boolean;
|
|
235
|
-
/**
|
|
236
|
-
* Whether to show notification showing number of unread messages.
|
|
237
|
-
* Defaults to false.
|
|
238
|
-
*/
|
|
239
|
-
showUnreadNotification?: boolean;
|
|
240
|
-
/**
|
|
241
|
-
* The "Call to Action" label to be displayed next to the popup button.
|
|
242
|
-
* By default, the CTA is not shown.
|
|
243
|
-
* This prop will override the "showInitialMessagePopUp" prop, if specified.
|
|
244
|
-
*/
|
|
245
|
-
ctaLabel?: string;
|
|
246
|
-
/**
|
|
247
|
-
* A controlled prop to open or close the panel. If provided, the prop
|
|
248
|
-
* will override the openOnLoad prop and the panel will be controlled
|
|
249
|
-
* by the parent component.
|
|
250
|
-
*/
|
|
251
|
-
isOpen?: boolean;
|
|
252
|
-
}
|
|
253
|
-
|
|
254
|
-
/**
|
|
255
|
-
* The CSS class interface for the FeedbackButtons component.
|
|
256
|
-
*
|
|
257
|
-
* @public
|
|
258
|
-
*/
|
|
259
|
-
export declare interface FeedbackButtonsCssClasses {
|
|
260
|
-
container?: string;
|
|
261
|
-
thumbsUpButton?: string;
|
|
262
|
-
thumbsUpIcon?: string;
|
|
263
|
-
thumbsUpFillIcon?: string;
|
|
264
|
-
thumbsDownButton?: string;
|
|
265
|
-
thumbsDownIcon?: string;
|
|
266
|
-
thumbsDownFillIcon?: string;
|
|
267
|
-
}
|
|
268
|
-
|
|
269
|
-
/**
|
|
270
|
-
* The CSS class interface for the InitialMessagePopUp component.
|
|
271
|
-
*
|
|
272
|
-
* @public
|
|
273
|
-
*/
|
|
274
|
-
export declare interface InitialMessagePopUpCssClasses {
|
|
275
|
-
container?: string;
|
|
276
|
-
closeButton?: string;
|
|
277
|
-
closeButtonIcon?: string;
|
|
278
|
-
message?: string;
|
|
279
|
-
}
|
|
280
|
-
|
|
281
|
-
/**
|
|
282
|
-
* A component that displays the provided message.
|
|
283
|
-
*
|
|
284
|
-
* @public
|
|
285
|
-
*
|
|
286
|
-
* @param props - {@link MessageBubbleProps}
|
|
287
|
-
*/
|
|
288
|
-
export declare function MessageBubble({ message, showFeedbackButtons, showTimestamp, customCssClasses, formatTimestamp, linkTarget, onLinkClick, }: MessageBubbleProps): React_2.JSX.Element;
|
|
289
|
-
|
|
290
|
-
/**
|
|
291
|
-
* The CSS class interface for the {@link MessageBubble} component.
|
|
292
|
-
*
|
|
293
|
-
* @public
|
|
294
|
-
*/
|
|
295
|
-
export declare interface MessageBubbleCssClasses {
|
|
296
|
-
topContainer?: string;
|
|
297
|
-
subContainer?: string;
|
|
298
|
-
subContainer__bot?: string;
|
|
299
|
-
subContainer__user?: string;
|
|
300
|
-
bubble?: string;
|
|
301
|
-
bubble__bot?: string;
|
|
302
|
-
bubble__user?: string;
|
|
303
|
-
text?: string;
|
|
304
|
-
text__bot?: string;
|
|
305
|
-
text__user?: string;
|
|
306
|
-
timestamp?: string;
|
|
307
|
-
timestamp__bot?: string;
|
|
308
|
-
timestamp__user?: string;
|
|
309
|
-
feedbackButtonsCssClasses?: FeedbackButtonsCssClasses;
|
|
310
|
-
}
|
|
311
|
-
|
|
312
|
-
/**
|
|
313
|
-
* The props for the {@link MessageBubble} component.
|
|
314
|
-
*
|
|
315
|
-
* @public
|
|
316
|
-
*/
|
|
317
|
-
export declare interface MessageBubbleProps {
|
|
318
|
-
/** The message to display. */
|
|
319
|
-
message: Message;
|
|
320
|
-
/**
|
|
321
|
-
* Whether to show the feedback buttons on the message bubble.
|
|
322
|
-
* Defaults to true.
|
|
323
|
-
*/
|
|
324
|
-
showFeedbackButtons?: boolean;
|
|
325
|
-
/**
|
|
326
|
-
* Whether to show the timestamp of the message with the message bubble.
|
|
327
|
-
* Defaults to true.
|
|
328
|
-
*/
|
|
329
|
-
showTimestamp?: boolean;
|
|
330
|
-
/**
|
|
331
|
-
* A function which is called to format the message's timestamp given in
|
|
332
|
-
* ISO format (e.g. "2023-05-18T19:33:34.553Z").
|
|
333
|
-
* Defaults to "HH:MM A" (e.g. "7:33 PM").
|
|
334
|
-
*/
|
|
335
|
-
formatTimestamp?: (timestamp: string) => string;
|
|
336
|
-
/** CSS classes for customizing the component styling. */
|
|
337
|
-
customCssClasses?: MessageBubbleCssClasses;
|
|
338
|
-
/** Link target open behavior on click. */
|
|
339
|
-
linkTarget?: string;
|
|
340
|
-
/** A callback which is called when user clicks a link. */
|
|
341
|
-
onLinkClick?: (href?: string) => void;
|
|
342
|
-
}
|
|
343
|
-
|
|
344
|
-
/**
|
|
345
|
-
* The CSS class interface for the MessageSuggestion component.
|
|
346
|
-
*
|
|
347
|
-
* @public
|
|
348
|
-
*/
|
|
349
|
-
export declare interface MessageSuggestionCssClasses {
|
|
350
|
-
container?: string;
|
|
351
|
-
suggestion?: string;
|
|
352
|
-
}
|
|
353
|
-
|
|
354
|
-
/**
|
|
355
|
-
* The props for the MessageSuggestions component.
|
|
356
|
-
*
|
|
357
|
-
* @public
|
|
358
|
-
*/
|
|
359
|
-
export declare interface MessageSuggestionsProps {
|
|
360
|
-
/** List of clickable message suggestions to render. */
|
|
361
|
-
suggestions: string[];
|
|
362
|
-
/** {@inheritdoc ChatInputProps.handleError} */
|
|
363
|
-
handleError?: (e: unknown) => void;
|
|
364
|
-
/** CSS classes for customizing the component styling. */
|
|
365
|
-
customCssClasses?: MessageSuggestionCssClasses;
|
|
366
|
-
/** {@inheritdoc ChatInputProps.stream} */
|
|
367
|
-
stream?: boolean;
|
|
368
|
-
/** {@inheritdoc ChatInputProps.onSend} */
|
|
369
|
-
onSend?: (message: string) => void;
|
|
370
|
-
/** {@inheritdoc ChatInputProps.onRetry} */
|
|
371
|
-
onRetry?: (e: unknown) => void;
|
|
372
|
-
}
|
|
373
|
-
|
|
374
|
-
/**
|
|
375
|
-
* useComposedCssClasses merges a component's built-in tailwind classes with custom tailwind classes.
|
|
376
|
-
*
|
|
377
|
-
* @remarks
|
|
378
|
-
* Tailwind classes will be merged without conflict, with custom classes having higher priority
|
|
379
|
-
* than built-in ones.
|
|
380
|
-
*
|
|
381
|
-
* @example
|
|
382
|
-
* Suppose a component has built-in classes of `{ container: 'px-4 text-slate-700' }`.
|
|
383
|
-
*
|
|
384
|
-
* Passing in the custom classes:
|
|
385
|
-
*
|
|
386
|
-
* ```ts
|
|
387
|
-
* { container: 'text-red-200 mb-3' }
|
|
388
|
-
* ```
|
|
389
|
-
*
|
|
390
|
-
* results in the merged classes of:
|
|
391
|
-
*
|
|
392
|
-
* ```ts
|
|
393
|
-
* { container: 'px-4 text-red-200 mb-3' }
|
|
394
|
-
* ```
|
|
395
|
-
*
|
|
396
|
-
* @public
|
|
397
|
-
*
|
|
398
|
-
* @param builtInClasses - The component's built-in tailwind classes
|
|
399
|
-
* @param customClasses - The custom tailwind classes to merge with the built-in ones
|
|
400
|
-
* @returns The composed CSS classes
|
|
401
|
-
*/
|
|
402
|
-
export declare function useComposedCssClasses<ClassInterface extends Partial<Record<keyof ClassInterface, string | object>>>(builtInClasses: Readonly<ClassInterface>, customClasses?: Partial<ClassInterface>): ClassInterface;
|
|
403
|
-
|
|
404
|
-
/**
|
|
405
|
-
* Returns a function to send requests to Yext Analytics API.
|
|
406
|
-
*
|
|
407
|
-
* @public
|
|
408
|
-
*/
|
|
409
|
-
export declare function useReportAnalyticsEvent(): ChatHeadless["report"];
|
|
410
|
-
|
|
411
|
-
export { }
|
package/lib/esm/package.json.mjs
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"package.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
/**
|
|
3
|
-
* The CSS class interface for the {@link ChatHeader} component.
|
|
4
|
-
*
|
|
5
|
-
* @public
|
|
6
|
-
*/
|
|
7
|
-
export interface ChatHeaderCssClasses {
|
|
8
|
-
container?: string;
|
|
9
|
-
title?: string;
|
|
10
|
-
restartButton?: string;
|
|
11
|
-
restartButtonIcon?: string;
|
|
12
|
-
closeButton?: string;
|
|
13
|
-
closeButtonIcon?: string;
|
|
14
|
-
}
|
|
15
|
-
/**
|
|
16
|
-
* The props for the {@link ChatHeader} component.
|
|
17
|
-
*
|
|
18
|
-
* @public
|
|
19
|
-
*/
|
|
20
|
-
export interface ChatHeaderProps {
|
|
21
|
-
/**
|
|
22
|
-
* The headers's title text, essentially how the chat window identifies itself to the user.
|
|
23
|
-
*/
|
|
24
|
-
title: string;
|
|
25
|
-
/**
|
|
26
|
-
* Displays a restart button which allows the user to restart the conversation.
|
|
27
|
-
* Defaults to false.
|
|
28
|
-
*/
|
|
29
|
-
showRestartButton?: boolean;
|
|
30
|
-
/**
|
|
31
|
-
* Displays a close button which will invoke {@link ChatHeaderProps.onClose} on click.
|
|
32
|
-
* Default to false.
|
|
33
|
-
*/
|
|
34
|
-
showCloseButton?: boolean;
|
|
35
|
-
/** A function which is called when the close button is clicked. */
|
|
36
|
-
onClose?: () => void;
|
|
37
|
-
/** Custom icon for for restart button. */
|
|
38
|
-
restartButtonIcon?: JSX.Element;
|
|
39
|
-
/** Custom icon for for close button. */
|
|
40
|
-
closeButtonIcon?: JSX.Element;
|
|
41
|
-
/** CSS classes for customizing the component styling. */
|
|
42
|
-
customCssClasses?: ChatHeaderCssClasses;
|
|
43
|
-
}
|
|
44
|
-
/**
|
|
45
|
-
* A component that renders the header of a chat bot panel,
|
|
46
|
-
* including the title and a button to reset the conversation.
|
|
47
|
-
*
|
|
48
|
-
* @public
|
|
49
|
-
*
|
|
50
|
-
* @param props - {@link ChatHeaderProps}
|
|
51
|
-
*/
|
|
52
|
-
export declare function ChatHeader({ title, showRestartButton, restartButtonIcon, showCloseButton, closeButtonIcon, onClose, customCssClasses, }: ChatHeaderProps): React.JSX.Element;
|
|
53
|
-
//# sourceMappingURL=ChatHeader.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ChatHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/ChatHeader.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAK7D;;;;GAIG;AACH,MAAM,WAAW,oBAAoB;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAcD;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAC9B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,oEAAoE;IACpE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,2CAA2C;IAC3C,iBAAiB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAChC,yCAAyC;IACzC,eAAe,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAC9B,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,oBAAoB,CAAC;CACzC;AAED;;;;;;;GAOG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,OAAO,EACP,gBAAgB,GACjB,EAAE,eAAe,qBAgDjB"}
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import { useChatActions } from '@yext/chat-headless-react';
|
|
2
|
-
import { DualSyncIcon } from '../icons/DualSync.mjs';
|
|
3
|
-
import { useComposedCssClasses } from '../hooks/useComposedCssClasses.mjs';
|
|
4
|
-
import React, { useState, useRef, useCallback } from 'react';
|
|
5
|
-
import { twMerge } from 'tailwind-merge';
|
|
6
|
-
import { CrossIcon } from '../icons/Cross.mjs';
|
|
7
|
-
import { withStylelessCssClasses } from '../utils/withStylelessCssClasses.mjs';
|
|
8
|
-
|
|
9
|
-
const builtInCssClasses = withStylelessCssClasses("Header", {
|
|
10
|
-
container: "w-full pl-4 pr-3 py-3 flex justify-between bg-gradient-to-tr from-blue-600 to-blue-800",
|
|
11
|
-
title: "text-white text-xl font-medium truncate pr-1",
|
|
12
|
-
restartButton: "w-8 h-8 ml-auto shrink-0 flex justify-center items-center",
|
|
13
|
-
restartButtonIcon: "text-white stroke-[0.2] w-[26px] h-[26px]",
|
|
14
|
-
closeButton: "w-8 h-8 hover:scale-110 shrink-0 flex justify-center items-center",
|
|
15
|
-
closeButtonIcon: "text-white w-[26px] h-[26px]",
|
|
16
|
-
});
|
|
17
|
-
/**
|
|
18
|
-
* A component that renders the header of a chat bot panel,
|
|
19
|
-
* including the title and a button to reset the conversation.
|
|
20
|
-
*
|
|
21
|
-
* @public
|
|
22
|
-
*
|
|
23
|
-
* @param props - {@link ChatHeaderProps}
|
|
24
|
-
*/
|
|
25
|
-
function ChatHeader({ title, showRestartButton, restartButtonIcon, showCloseButton, closeButtonIcon, onClose, customCssClasses, }) {
|
|
26
|
-
const chat = useChatActions();
|
|
27
|
-
const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);
|
|
28
|
-
const [isSpinning, setIsSpinning] = useState(false);
|
|
29
|
-
const restartButtonCssClasses = twMerge(cssClasses.restartButton, isSpinning ? "animate-[spin_0.3s_linear]" : "hover:scale-110");
|
|
30
|
-
const clearTimerRef = useRef();
|
|
31
|
-
const onRestart = useCallback(async () => {
|
|
32
|
-
clearTimeout(clearTimerRef.current);
|
|
33
|
-
setIsSpinning(true);
|
|
34
|
-
clearTimerRef.current = setTimeout(() => {
|
|
35
|
-
setIsSpinning(false);
|
|
36
|
-
}, 1000);
|
|
37
|
-
chat.restartConversation();
|
|
38
|
-
}, [chat]);
|
|
39
|
-
return (React.createElement("div", { className: cssClasses.container },
|
|
40
|
-
React.createElement("h1", { className: cssClasses.title }, title),
|
|
41
|
-
showRestartButton && (React.createElement("button", { "aria-label": "Restart Conversation", onClick: onRestart, className: restartButtonCssClasses }, restartButtonIcon ?? (React.createElement(DualSyncIcon, { className: cssClasses.restartButtonIcon })))),
|
|
42
|
-
showCloseButton && (React.createElement("button", { "aria-label": "Close Chat", onClick: onClose, className: cssClasses.closeButton }, closeButtonIcon ?? (React.createElement(CrossIcon, { className: cssClasses.closeButtonIcon }))))));
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
export { ChatHeader };
|
|
46
|
-
//# sourceMappingURL=ChatHeader.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ChatHeader.mjs","sources":["../../../../src/components/ChatHeader.tsx"],"sourcesContent":["import { useChatActions } from \"@yext/chat-headless-react\";\nimport { DualSyncIcon } from \"../icons/DualSync\";\nimport { useComposedCssClasses } from \"../hooks/useComposedCssClasses\";\nimport React, { useCallback, useRef, useState } from \"react\";\nimport { twMerge } from \"tailwind-merge\";\nimport { CrossIcon } from \"../icons/Cross\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\n\n/**\n * The CSS class interface for the {@link ChatHeader} component.\n *\n * @public\n */\nexport interface ChatHeaderCssClasses {\n container?: string;\n title?: string;\n restartButton?: string;\n restartButtonIcon?: string;\n closeButton?: string;\n closeButtonIcon?: string;\n}\n\nconst builtInCssClasses: Readonly<ChatHeaderCssClasses> =\n withStylelessCssClasses(\"Header\", {\n container:\n \"w-full pl-4 pr-3 py-3 flex justify-between bg-gradient-to-tr from-blue-600 to-blue-800\",\n title: \"text-white text-xl font-medium truncate pr-1\",\n restartButton: \"w-8 h-8 ml-auto shrink-0 flex justify-center items-center\",\n restartButtonIcon: \"text-white stroke-[0.2] w-[26px] h-[26px]\",\n closeButton:\n \"w-8 h-8 hover:scale-110 shrink-0 flex justify-center items-center\",\n closeButtonIcon: \"text-white w-[26px] h-[26px]\",\n });\n\n/**\n * The props for the {@link ChatHeader} component.\n *\n * @public\n */\nexport interface ChatHeaderProps {\n /**\n * The headers's title text, essentially how the chat window identifies itself to the user.\n */\n title: string;\n /**\n * Displays a restart button which allows the user to restart the conversation.\n * Defaults to false.\n */\n showRestartButton?: boolean;\n /**\n * Displays a close button which will invoke {@link ChatHeaderProps.onClose} on click.\n * Default to false.\n */\n showCloseButton?: boolean;\n /** A function which is called when the close button is clicked. */\n onClose?: () => void;\n /** Custom icon for for restart button. */\n restartButtonIcon?: JSX.Element;\n /** Custom icon for for close button. */\n closeButtonIcon?: JSX.Element;\n /** CSS classes for customizing the component styling. */\n customCssClasses?: ChatHeaderCssClasses;\n}\n\n/**\n * A component that renders the header of a chat bot panel,\n * including the title and a button to reset the conversation.\n *\n * @public\n *\n * @param props - {@link ChatHeaderProps}\n */\nexport function ChatHeader({\n title,\n showRestartButton,\n restartButtonIcon,\n showCloseButton,\n closeButtonIcon,\n onClose,\n customCssClasses,\n}: ChatHeaderProps) {\n const chat = useChatActions();\n\n const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n\n const [isSpinning, setIsSpinning] = useState(false);\n const restartButtonCssClasses = twMerge(\n cssClasses.restartButton,\n isSpinning ? \"animate-[spin_0.3s_linear]\" : \"hover:scale-110\"\n );\n\n const clearTimerRef = useRef<ReturnType<typeof setTimeout>>();\n const onRestart = useCallback(async () => {\n clearTimeout(clearTimerRef.current);\n setIsSpinning(true);\n clearTimerRef.current = setTimeout(() => {\n setIsSpinning(false);\n }, 1000);\n chat.restartConversation();\n }, [chat]);\n\n return (\n <div className={cssClasses.container}>\n <h1 className={cssClasses.title}>{title}</h1>\n {showRestartButton && (\n <button\n aria-label=\"Restart Conversation\"\n onClick={onRestart}\n className={restartButtonCssClasses}\n >\n {restartButtonIcon ?? (\n <DualSyncIcon className={cssClasses.restartButtonIcon} />\n )}\n </button>\n )}\n {showCloseButton && (\n <button\n aria-label=\"Close Chat\"\n onClick={onClose}\n className={cssClasses.closeButton}\n >\n {closeButtonIcon ?? (\n <CrossIcon className={cssClasses.closeButtonIcon} />\n )}\n </button>\n )}\n </div>\n );\n}\n"],"names":[],"mappings":";;;;;;;;AAsBA,MAAM,iBAAiB,GACrB,uBAAuB,CAAC,QAAQ,EAAE;AAChC,IAAA,SAAS,EACP,wFAAwF;AAC1F,IAAA,KAAK,EAAE,8CAA8C;AACrD,IAAA,aAAa,EAAE,2DAA2D;AAC1E,IAAA,iBAAiB,EAAE,2CAA2C;AAC9D,IAAA,WAAW,EACT,mEAAmE;AACrE,IAAA,eAAe,EAAE,8BAA8B;AAChD,CAAA,CAAC,CAAC;AAgCL;;;;;;;AAOG;SACa,UAAU,CAAC,EACzB,KAAK,EACL,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,OAAO,EACP,gBAAgB,GACA,EAAA;AAChB,IAAA,MAAM,IAAI,GAAG,cAAc,EAAE,CAAC;IAE9B,MAAM,UAAU,GAAG,qBAAqB,CAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;IAE9E,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AACpD,IAAA,MAAM,uBAAuB,GAAG,OAAO,CACrC,UAAU,CAAC,aAAa,EACxB,UAAU,GAAG,4BAA4B,GAAG,iBAAiB,CAC9D,CAAC;AAEF,IAAA,MAAM,aAAa,GAAG,MAAM,EAAiC,CAAC;AAC9D,IAAA,MAAM,SAAS,GAAG,WAAW,CAAC,YAAW;AACvC,QAAA,YAAY,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QACpC,aAAa,CAAC,IAAI,CAAC,CAAC;AACpB,QAAA,aAAa,CAAC,OAAO,GAAG,UAAU,CAAC,MAAK;YACtC,aAAa,CAAC,KAAK,CAAC,CAAC;SACtB,EAAE,IAAI,CAAC,CAAC;QACT,IAAI,CAAC,mBAAmB,EAAE,CAAC;AAC7B,KAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;AAEX,IAAA,QACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,SAAS,EAAA;AAClC,QAAA,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAE,UAAU,CAAC,KAAK,EAAA,EAAG,KAAK,CAAM;QAC5C,iBAAiB,KAChB,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,YAAA,EACa,sBAAsB,EACjC,OAAO,EAAE,SAAS,EAClB,SAAS,EAAE,uBAAuB,EAAA,EAEjC,iBAAiB,KAChB,KAAA,CAAA,aAAA,CAAC,YAAY,EAAA,EAAC,SAAS,EAAE,UAAU,CAAC,iBAAiB,EAAA,CAAI,CAC1D,CACM,CACV;AACA,QAAA,eAAe,KACd,KACa,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,YAAA,EAAA,YAAY,EACvB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,UAAU,CAAC,WAAW,EAEhC,EAAA,eAAe,KACd,KAAC,CAAA,aAAA,CAAA,SAAS,EAAC,EAAA,SAAS,EAAE,UAAU,CAAC,eAAe,EAAA,CAAI,CACrD,CACM,CACV,CACG,EACN;AACJ;;;;"}
|