@blocklet/pages-kit 0.2.328 → 0.2.329

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

@@ -76,7 +76,7 @@ function AutoForm({ submitText, inlineLabel, autoFillLastForm = true, submitInQu
                                 var _a;
                                 return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { className: "form-item", children: [parameter.label && (0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: parameter.label }), (0, jsx_runtime_1.jsx)(AgentInputField_1.default, { 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: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, { position: "end", sx: { py: 3, mr: -0.75, alignSelf: 'flex-end' }, children: (0, jsx_runtime_1.jsx)(LoadingButton_1.default, { type: "submit", variant: "contained", loading: running, sx: { borderRadius: 100 }, children: submitText }) })),
+                                                    endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, { position: "end", sx: { py: 3, mr: -0.75, alignSelf: 'flex-end' }, children: (0, jsx_runtime_1.jsx)(LoadingButton_1.default, { type: "submit", variant: "contained", loading: running, sx: { borderRadius: 1.5 }, children: submitText }) })),
                                                 }
                                                 : undefined })] }));
                             } }) }, parameter.id));

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

@@ -45,7 +45,7 @@ function GoogleSearchRelatedView({ output, outputValue, onlyLastMessage, }) {
     }, [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 ((0, jsx_runtime_1.jsx)(OutputFieldContainer_1.default, { output: output, children: (0, jsx_runtime_1.jsx)(material_1.List, { dense: true, disablePadding: true, children: result.related_questions.map((item) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemButton, { onClick: () => __awaiter(this, void 0, void 0, function* () {
+    return ((0, jsx_runtime_1.jsx)(OutputFieldContainer_1.default, { output: output, children: (0, jsx_runtime_1.jsx)(material_1.List, { dense: true, disablePadding: true, children: result.related_questions.map((item) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemButton, { sx: { py: 1, px: 2 }, onClick: () => __awaiter(this, void 0, void 0, function* () {
                             if (submitting)
                                 return;
                             setSubmitting(true);

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

@@ -7,6 +7,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const material_1 = require("@mui/material");
 const joi_1 = __importDefault(require("joi"));
 const react_1 = require("react");
+const react_transition_group_1 = require("react-transition-group");
 const OutputFieldContainer_1 = __importDefault(require("../../components/OutputFieldContainer"));
 const CurrentMessage_1 = require("../../contexts/CurrentMessage");
 const searchResultSchema = joi_1.default.object({
@@ -21,26 +22,39 @@ const searchResultSchema = joi_1.default.object({
 function GoogleSearchSourcesView({ output, outputValue }) {
     var _a;
     const { message } = (_a = (0, CurrentMessage_1.useCurrentMessage)({ optional: true })) !== null && _a !== void 0 ? _a : {};
+    const [showAll, setShowAll] = (0, react_1.useState)(false);
     const searchResult = (0, react_1.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 ((0, jsx_runtime_1.jsx)(OutputFieldContainer_1.default, { output: output, children: (0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, spacing: 1.5, children: [message.loading && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 4, sm: 3, md: 2, children: (0, jsx_runtime_1.jsx)(ItemSkeleton, {}) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 4, sm: 3, md: 2, children: (0, jsx_runtime_1.jsx)(ItemSkeleton, {}) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 4, sm: 3, md: 2, children: (0, jsx_runtime_1.jsx)(ItemSkeleton, {}) })] })), searchResult === null || searchResult === void 0 ? void 0 : searchResult.organic_results.map((item) => ((0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 4, sm: 3, md: 2, children: (0, jsx_runtime_1.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 ((0, jsx_runtime_1.jsx)(OutputFieldContainer_1.default, { output: output, children: (0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, spacing: 1.5, children: [message.loading && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 4, sm: 4, md: 4, children: (0, jsx_runtime_1.jsx)(ItemSkeleton, {}) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 4, sm: 4, md: 4, children: (0, jsx_runtime_1.jsx)(ItemSkeleton, {}) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 4, sm: 4, md: 4, children: (0, jsx_runtime_1.jsx)(ItemSkeleton, {}) })] })), (0, jsx_runtime_1.jsx)(react_transition_group_1.TransitionGroup, { component: null, children: itemsToShow.map((item) => ((0, jsx_runtime_1.jsx)(react_transition_group_1.CSSTransition, { timeout: 500, classNames: "item", children: (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 4, sm: 4, md: 4, children: (0, jsx_runtime_1.jsx)(ItemView, { item: item }) }) }, item.link))) }), !showAll && list.length > 3 && ((0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 4, sm: 4, md: 4, children: (0, jsx_runtime_1.jsx)(MoreItemView, { list: list, onMore: handleToggle }) }))] }) }));
 }
 exports.default = GoogleSearchSourcesView;
 function ItemView({ item }) {
     var _a;
     return ((0, jsx_runtime_1.jsx)(ItemContainer, { title: `${item.title} - ${item.source}`, favicon: (0, jsx_runtime_1.jsx)(material_1.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 ((0, jsx_runtime_1.jsx)(material_1.Card, { sx: { height: '100px', cursor: 'pointer' }, onClick: onMore, children: (0, jsx_runtime_1.jsxs)(material_1.Stack, { sx: { py: 1.5, px: 2, gap: 1, height: '100%' }, children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: { display: 'flex', flexWrap: 'wrap', gap: '7px', flexGrow: 1 }, children: current.map((item) => {
+                        var _a;
+                        return ((0, jsx_runtime_1.jsx)(material_1.Box, { width: 18, height: 18, children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { src: item.favicon, sx: { width: 18, height: 18 }, children: (_a = item.source) === null || _a === void 0 ? void 0 : _a.slice(0, 1) }) }));
+                    }) }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "caption", noWrap: true, sx: { width: 1, color: '#546C70', fontSize: 12, lineHeight: '18px' }, children: `View ${current.length} more` })] }) }));
+}
 function ItemSkeleton() {
     return ((0, jsx_runtime_1.jsx)(ItemContainer, { title: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { width: "100%" }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { width: "40%" })] }), favicon: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { width: 18, height: 18, variant: "circular" }), link: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { width: "70%" }) }));
 }
 function ItemContainer({ title, favicon, link }) {
-    return ((0, jsx_runtime_1.jsx)(material_1.Card, { sx: { height: '100%' }, children: (0, jsx_runtime_1.jsx)(material_1.CardActionArea, { component: "a", href: typeof link === 'string' ? link : undefined, target: "_blank", sx: { height: '100%' }, children: (0, jsx_runtime_1.jsxs)(material_1.Stack, { sx: { p: 1, gap: 1, height: '100%' }, children: [(0, jsx_runtime_1.jsx)(material_1.Box, { flexGrow: 1, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", sx: {
+    return ((0, jsx_runtime_1.jsx)(material_1.Card, { sx: { height: '100px' }, children: (0, jsx_runtime_1.jsx)(material_1.CardActionArea, { component: "a", href: typeof link === 'string' ? link : undefined, target: "_blank", sx: { height: '100%' }, children: (0, jsx_runtime_1.jsxs)(material_1.Stack, { sx: { py: 1.5, px: 2, gap: 1, height: '100%' }, children: [(0, jsx_runtime_1.jsx)(material_1.Box, { flexGrow: 1, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", sx: {
                                 display: '-webkit-box',
                                 WebkitBoxOrient: 'vertical',
                                 WebkitLineClamp: 2,

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

@@ -20,6 +20,16 @@ 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',
+            },
         } }));
 }
 exports.default = BackgroundImage;