@blocklet/pages-kit 0.2.328 → 0.2.329

package/lib/esm/builtin/async/ai-runtime/runtime-components/AutoForm/index.js

@@ -71,7 +71,7 @@ export default function AutoForm({ submitText, inlineLabel, autoFillLastForm = t
                                 var _a;
                                 return (_jsxs(Stack, { className: "form-item", children: [parameter.label && _jsx(FormLabel, { children: parameter.label }), _jsx(AgentInputField, { inputRef: field.ref, autoFocus: index === 0, size: "small", hiddenLabel: true, fullWidth: true, label: undefined, parameter: parameter, maxRows: !(parameter === null || parameter === void 0 ? void 0 : parameter.type) || (parameter === null || parameter === void 0 ? void 0 : parameter.type) === 'string' ? 5 : undefined, value: field.value || '', onChange: (value) => field.onChange({ target: { value } }), error: Boolean(fieldState.error), helperText: ((_a = fieldState.error) === null || _a === void 0 ? void 0 : _a.message) || (parameter === null || parameter === void 0 ? void 0 : parameter.helper), InputProps: parameter.key === 'question' && submitInQuestionField
                                                 ? {
-                                                    endAdornment: (_jsx(InputAdornment, { position: "end", sx: { py: 3, mr: -0.75, alignSelf: 'flex-end' }, children: _jsx(LoadingButton, { type: "submit", variant: "contained", loading: running, sx: { borderRadius: 100 }, children: submitText }) })),
+                                                    endAdornment: (_jsx(InputAdornment, { position: "end", sx: { py: 3, mr: -0.75, alignSelf: 'flex-end' }, children: _jsx(LoadingButton, { type: "submit", variant: "contained", loading: running, sx: { borderRadius: 1.5 }, children: submitText }) })),
                                                 }
                                                 : undefined })] }));
                             } }) }, parameter.id));

package/lib/esm/builtin/async/ai-runtime/runtime-components/GoogleSearch/GoogleSearchRelatedQuestionsView.js

@@ -40,7 +40,7 @@ export default function GoogleSearchRelatedView({ output, outputValue, onlyLastM
     }, [outputValue]);
     if ((!isLastMessage && onlyLastMessage) || !((_b = result === null || result === void 0 ? void 0 : result.related_questions) === null || _b === void 0 ? void 0 : _b.length))
         return null;
-    return (_jsx(OutputFieldContainer, { output: output, children: _jsx(List, { dense: true, disablePadding: true, children: result.related_questions.map((item) => (_jsxs(_Fragment, { children: [_jsx(ListItemButton, { onClick: () => __awaiter(this, void 0, void 0, function* () {
+    return (_jsx(OutputFieldContainer, { output: output, children: _jsx(List, { dense: true, disablePadding: true, children: result.related_questions.map((item) => (_jsxs(_Fragment, { children: [_jsx(ListItemButton, { sx: { py: 1, px: 2 }, onClick: () => __awaiter(this, void 0, void 0, function* () {
                             if (submitting)
                                 return;
                             setSubmitting(true);

package/lib/esm/builtin/async/ai-runtime/runtime-components/GoogleSearch/GoogleSearchSourcesView.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { Avatar, Box, Card, CardActionArea, Grid, Skeleton, Stack, Typography } from '@mui/material';
 import Joi from 'joi';
-import { useMemo } from 'react';
+import { useMemo, useState } from 'react';
+import { CSSTransition, TransitionGroup } from 'react-transition-group';
 import OutputFieldContainer from '../../components/OutputFieldContainer';
 import { useCurrentMessage } from '../../contexts/CurrentMessage';
 const searchResultSchema = Joi.object({
@@ -16,25 +17,38 @@ const searchResultSchema = Joi.object({
 export default function GoogleSearchSourcesView({ output, outputValue }) {
     var _a;
     const { message } = (_a = useCurrentMessage({ optional: true })) !== null && _a !== void 0 ? _a : {};
+    const [showAll, setShowAll] = useState(false);
     const searchResult = useMemo(() => {
         const result = searchResultSchema.validate(outputValue, { allowUnknown: true });
         if (result.error)
             return undefined;
         return result.value;
     }, [outputValue]);
+    const handleToggle = () => setShowAll(!showAll);
     if (!message || (!(searchResult === null || searchResult === void 0 ? void 0 : searchResult.organic_results.length) && !message.loading))
         return null;
-    return (_jsx(OutputFieldContainer, { output: output, children: _jsxs(Grid, { container: true, spacing: 1.5, children: [message.loading && (_jsxs(_Fragment, { children: [_jsx(Grid, { item: true, xs: 4, sm: 3, md: 2, children: _jsx(ItemSkeleton, {}) }), _jsx(Grid, { item: true, xs: 4, sm: 3, md: 2, children: _jsx(ItemSkeleton, {}) }), _jsx(Grid, { item: true, xs: 4, sm: 3, md: 2, children: _jsx(ItemSkeleton, {}) })] })), searchResult === null || searchResult === void 0 ? void 0 : searchResult.organic_results.map((item) => (_jsx(Grid, { item: true, xs: 4, sm: 3, md: 2, children: _jsx(ItemView, { item: item }) }, item.link)))] }) }));
+    const list = [...((searchResult === null || searchResult === void 0 ? void 0 : searchResult.organic_results) || [])];
+    const itemsToShow = showAll
+        ? [...((searchResult === null || searchResult === void 0 ? void 0 : searchResult.organic_results) || [])]
+        : [...((searchResult === null || searchResult === void 0 ? void 0 : searchResult.organic_results) || [])].slice(0, (list === null || list === void 0 ? void 0 : list.length) > 3 ? 2 : 3);
+    return (_jsx(OutputFieldContainer, { output: output, children: _jsxs(Grid, { container: true, spacing: 1.5, children: [message.loading && (_jsxs(_Fragment, { children: [_jsx(Grid, { item: true, xs: 4, sm: 4, md: 4, children: _jsx(ItemSkeleton, {}) }), _jsx(Grid, { item: true, xs: 4, sm: 4, md: 4, children: _jsx(ItemSkeleton, {}) }), _jsx(Grid, { item: true, xs: 4, sm: 4, md: 4, children: _jsx(ItemSkeleton, {}) })] })), _jsx(TransitionGroup, { component: null, children: itemsToShow.map((item) => (_jsx(CSSTransition, { timeout: 500, classNames: "item", children: _jsx(Grid, { item: true, xs: 4, sm: 4, md: 4, children: _jsx(ItemView, { item: item }) }) }, item.link))) }), !showAll && list.length > 3 && (_jsx(Grid, { item: true, xs: 4, sm: 4, md: 4, children: _jsx(MoreItemView, { list: list, onMore: handleToggle }) }))] }) }));
 }
 function ItemView({ item }) {
     var _a;
     return (_jsx(ItemContainer, { title: `${item.title} - ${item.source}`, favicon: _jsx(Avatar, { src: item.favicon, sx: { width: 18, height: 18 }, children: (_a = item.source) === null || _a === void 0 ? void 0 : _a.slice(0, 1) }), link: item.link }));
 }
+function MoreItemView({ list, onMore }) {
+    const current = list.splice(2);
+    return (_jsx(Card, { sx: { height: '100px', cursor: 'pointer' }, onClick: onMore, children: _jsxs(Stack, { sx: { py: 1.5, px: 2, gap: 1, height: '100%' }, children: [_jsx(Box, { sx: { display: 'flex', flexWrap: 'wrap', gap: '7px', flexGrow: 1 }, children: current.map((item) => {
+                        var _a;
+                        return (_jsx(Box, { width: 18, height: 18, children: _jsx(Avatar, { src: item.favicon, sx: { width: 18, height: 18 }, children: (_a = item.source) === null || _a === void 0 ? void 0 : _a.slice(0, 1) }) }));
+                    }) }), _jsx(Typography, { variant: "caption", noWrap: true, sx: { width: 1, color: '#546C70', fontSize: 12, lineHeight: '18px' }, children: `View ${current.length} more` })] }) }));
+}
 function ItemSkeleton() {
     return (_jsx(ItemContainer, { title: _jsxs(_Fragment, { children: [_jsx(Skeleton, { width: "100%" }), _jsx(Skeleton, { width: "40%" })] }), favicon: _jsx(Skeleton, { width: 18, height: 18, variant: "circular" }), link: _jsx(Skeleton, { width: "70%" }) }));
 }
 function ItemContainer({ title, favicon, link }) {
-    return (_jsx(Card, { sx: { height: '100%' }, children: _jsx(CardActionArea, { component: "a", href: typeof link === 'string' ? link : undefined, target: "_blank", sx: { height: '100%' }, children: _jsxs(Stack, { sx: { p: 1, gap: 1, height: '100%' }, children: [_jsx(Box, { flexGrow: 1, children: _jsx(Typography, { variant: "body2", sx: {
+    return (_jsx(Card, { sx: { height: '100px' }, children: _jsx(CardActionArea, { component: "a", href: typeof link === 'string' ? link : undefined, target: "_blank", sx: { height: '100%' }, children: _jsxs(Stack, { sx: { py: 1.5, px: 2, gap: 1, height: '100%' }, children: [_jsx(Box, { flexGrow: 1, children: _jsx(Typography, { variant: "body2", sx: {
                                 display: '-webkit-box',
                                 WebkitBoxOrient: 'vertical',
                                 WebkitLineClamp: 2,

package/lib/esm/builtin/async/ai-runtime/runtime-components/SimpleChat/BackgroundImage.js

@@ -18,5 +18,15 @@ export default function BackgroundImage() {
             backgroundPosition: 'center',
             pointerEvents: 'none',
             zIndex: -1,
+            '&::after': {
+                content: '""',
+                position: 'absolute',
+                top: 0,
+                left: 0,
+                right: 0,
+                bottom: 0,
+                backgroundColor: 'rgba(0, 0, 0, 0.12)',
+                pointerEvents: 'none',
+            },
         } }));
 }