@redocly/theme 0.44.8 → 0.44.9
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.
|
@@ -21,7 +21,7 @@ function SearchAiResponse(props) {
|
|
|
21
21
|
isGeneratingResponse ? (react_1.default.createElement(Spinner_1.Spinner, { size: "20px", color: "--search-ai-spinner-icon-color" })) : (react_1.default.createElement(CheckmarkFilledIcon_1.CheckmarkFilledIcon, { size: "20px", color: "--search-ai-checkmark-icon-color" })),
|
|
22
22
|
react_1.default.createElement(Question, null, question)),
|
|
23
23
|
react_1.default.createElement(ResponseBody, null,
|
|
24
|
-
react_1.default.createElement(ResponseText, { "data-translation-key":
|
|
24
|
+
response ? (react_1.default.createElement(ResponseText, null, response)) : (react_1.default.createElement(ThinkingResponseText, { "data-translation-key": "search.ai.thinkingText" }, translate('search.ai.thinkingText', 'Thinking...'))),
|
|
25
25
|
resources.length && !isGeneratingResponse ? (react_1.default.createElement(Resources, null,
|
|
26
26
|
react_1.default.createElement(ResourcesTitle, { "data-translation-key": "search.ai.resourcesFound" },
|
|
27
27
|
resources.length,
|
|
@@ -65,6 +65,21 @@ const ResponseText = styled_components_1.default.pre `
|
|
|
65
65
|
font-family: inherit;
|
|
66
66
|
white-space: break-spaces;
|
|
67
67
|
`;
|
|
68
|
+
const ThinkingResponseText = (0, styled_components_1.default)(ResponseText) `
|
|
69
|
+
animation: fadeIn 2s ease-in-out infinite;
|
|
70
|
+
|
|
71
|
+
@keyframes fadeIn {
|
|
72
|
+
0% {
|
|
73
|
+
opacity: 1;
|
|
74
|
+
}
|
|
75
|
+
50% {
|
|
76
|
+
opacity: 0.3;
|
|
77
|
+
}
|
|
78
|
+
100% {
|
|
79
|
+
opacity: 1;
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
`;
|
|
68
83
|
const Resources = styled_components_1.default.div `
|
|
69
84
|
gap: var(--search-ai-resources-gap);
|
|
70
85
|
display: flex;
|
package/package.json
CHANGED
|
@@ -35,9 +35,13 @@ export function SearchAiResponse(props: SearchAiResponseProps): JSX.Element {
|
|
|
35
35
|
<Question>{question}</Question>
|
|
36
36
|
</ResponseHeader>
|
|
37
37
|
<ResponseBody>
|
|
38
|
-
|
|
39
|
-
{response
|
|
40
|
-
|
|
38
|
+
{response ? (
|
|
39
|
+
<ResponseText>{response}</ResponseText>
|
|
40
|
+
) : (
|
|
41
|
+
<ThinkingResponseText data-translation-key="search.ai.thinkingText">
|
|
42
|
+
{translate('search.ai.thinkingText', 'Thinking...')}
|
|
43
|
+
</ThinkingResponseText>
|
|
44
|
+
)}
|
|
41
45
|
{resources.length && !isGeneratingResponse ? (
|
|
42
46
|
<Resources>
|
|
43
47
|
<ResourcesTitle data-translation-key="search.ai.resourcesFound">
|
|
@@ -102,6 +106,22 @@ const ResponseText = styled.pre`
|
|
|
102
106
|
white-space: break-spaces;
|
|
103
107
|
`;
|
|
104
108
|
|
|
109
|
+
const ThinkingResponseText = styled(ResponseText)`
|
|
110
|
+
animation: fadeIn 2s ease-in-out infinite;
|
|
111
|
+
|
|
112
|
+
@keyframes fadeIn {
|
|
113
|
+
0% {
|
|
114
|
+
opacity: 1;
|
|
115
|
+
}
|
|
116
|
+
50% {
|
|
117
|
+
opacity: 0.3;
|
|
118
|
+
}
|
|
119
|
+
100% {
|
|
120
|
+
opacity: 1;
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
`;
|
|
124
|
+
|
|
105
125
|
const Resources = styled.div`
|
|
106
126
|
gap: var(--search-ai-resources-gap);
|
|
107
127
|
display: flex;
|