@blocklet/pages-kit 0.2.369 → 0.2.371

package/lib/cjs/utils/builtin.js

@@ -63,6 +63,7 @@ exports.BuiltinModules = {
     // The following packages are lazy loading
     '@blocklet/pages-kit/builtin/async/react-scroll-to-bottom': reactScrollToBottom,
     // The following packages are ignored at server side
+    '@blocklet/pages-kit/builtin/components': {},
     '@blocklet/pages-kit/builtin/session': {},
     '@blocklet/pages-kit/builtin/locale': {},
     '@blocklet/pages-kit/builtin/page/header': {},

package/lib/cjs/utils/inject-global-components.js

@@ -34,6 +34,7 @@ const reactMarkdown = __importStar(require("../builtin/async/react-markdown"));
 const reactScrollToBottom = __importStar(require("../builtin/async/react-scroll-to-bottom"));
 const reactSyntaxHighlighter = __importStar(require("../builtin/async/react-syntax-highlighter"));
 const call = __importStar(require("../builtin/call"));
+const components = __importStar(require("../builtin/components"));
 const dayjs = __importStar(require("../builtin/dayjs"));
 const emotionCss = __importStar(require("../builtin/emotion/css"));
 const iconifyReact = __importStar(require("../builtin/iconify/react"));
@@ -79,6 +80,7 @@ function injectGlobalComponents() {
             '@blocklet/pages-kit/builtin/react-router-dom': reactRouterDOM,
             '@blocklet/pages-kit/builtin/arcblock/ux': arcblockUx,
             '@blocklet/pages-kit/builtin/page/header': pageHeader,
+            '@blocklet/pages-kit/builtin/components': components,
             // The following packages are lazy loading
             '@blocklet/pages-kit/builtin/async/react-scroll-to-bottom': reactScrollToBottom,
             '@blocklet/pages-kit/builtin/async/react-markdown': reactMarkdown,

package/lib/esm/builtin/async/ai-runtime/components/AgentInputField/LanguageField.js

@@ -9,45 +9,30 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx } from "react/jsx-runtime";
-import { MenuItem, TextField } from '@mui/material';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Autocomplete, ListItem, ListItemIcon, ListItemText, MenuItem, TextField } from '@mui/material';
 import { forwardRef } from 'react';
 import { useLocaleContext } from '../../../../locale';
+import { languages } from '../../utils/languages';
+const filter = (options, state) => {
+    return options.filter((o) => {
+        if (state.inputValue) {
+            return (o.en.toLowerCase().includes(state.inputValue.toLowerCase()) ||
+                o.name.toLowerCase().includes(state.inputValue.toLowerCase()));
+        }
+        return true;
+    });
+};
 const LanguageField = forwardRef((_a, ref) => {
     var { readOnly, parameter, onChange } = _a, props = __rest(_a, ["readOnly", "parameter", "onChange"]);
     const { locale } = useLocaleContext();
-    return (_jsx(TextField, Object.assign({ ref: ref, select: true, onChange: (e) => onChange(e.target.value) }, props, { InputProps: Object.assign(Object.assign({}, props.InputProps), { readOnly }), children: languages.map((option) => (_jsx(MenuItem, { value: option.en, children: locale === 'zh' ? option.cn : option.en }, option.en))) })));
+    const value = (props === null || props === void 0 ? void 0 : props.value) ? languages.find((o) => o.en === props.value) : null;
+    return (_jsx(Autocomplete, { size: "small", ref: ref, renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { inputRef: props.inputRef, required: parameter === null || parameter === void 0 ? void 0 : parameter.required, placeholder: parameter === null || parameter === void 0 ? void 0 : parameter.placeholder, helperText: parameter === null || parameter === void 0 ? void 0 : parameter.helper }))), options: languages, getOptionKey: (i) => i.en, getOptionLabel: (o) => {
+            return locale === 'zh' ? o.cn : o.en;
+        }, value: value, filterOptions: filter, onChange: (_e, newValue) => {
+            onChange === null || onChange === void 0 ? void 0 : onChange(newValue === null || newValue === void 0 ? void 0 : newValue.en);
+        }, renderOption: (props, option) => {
+            return (_jsx(MenuItem, Object.assign({}, props, { children: _jsxs(ListItem, { sx: { py: 0 }, children: [_jsx(ListItemIcon, { children: _jsx(option.flag, {}) }), _jsx(ListItemText, { primary: `${option.name} ${locale === 'zh' ? option.cn : option.en} (${option.abbr})` })] }) })));
+        } }));
 });
 export default LanguageField;
-const languages = [
-    { en: 'English', cn: '英语' },
-    { en: 'Simplified Chinese', cn: '中文-简体' },
-    { en: 'Traditional Chinese', cn: '中文-繁体' },
-    { en: 'Spanish', cn: '西班牙语' },
-    { en: 'French', cn: '法语' },
-    { en: 'German', cn: '德语' },
-    { en: 'Italian', cn: '意大利语' },
-    { en: 'Portuguese', cn: '葡萄牙语' },
-    { en: 'Japanese', cn: '日语' },
-    { en: 'Korean', cn: '韩语' },
-    { en: 'Russian', cn: '俄语' },
-    { en: 'Polish', cn: '波兰语' },
-    { en: 'Arabic', cn: '阿拉伯语' },
-    { en: 'Dutch', cn: '荷兰语' },
-    { en: 'Swedish', cn: '瑞典语' },
-    { en: 'Finnish', cn: '芬兰语' },
-    { en: 'Czech', cn: '捷克语' },
-    { en: 'Danish', cn: '丹麦语' },
-    { en: 'Greek', cn: '希腊语' },
-    { en: 'Romanian', cn: '罗马尼亚语' },
-    { en: 'Hungarian', cn: '匈牙利语' },
-    { en: 'Bulgarian', cn: '保加利亚语' },
-    { en: 'Slovak', cn: '斯洛伐克语' },
-    { en: 'Norwegian', cn: '挪威语' },
-    { en: 'Hebrew', cn: '希伯来语' },
-    { en: 'Turkish', cn: '土耳其语' },
-    { en: 'Thai', cn: '泰语' },
-    { en: 'Indonesian', cn: '印尼语' },
-    { en: 'Vietnamese', cn: '越南语' },
-    { en: 'Hindi', cn: '印地语' },
-];

package/lib/esm/builtin/async/ai-runtime/hooks/use-header-menu.js

@@ -33,11 +33,11 @@ export function useHeaderMenu() {
         ? {}
         : {
             addons: (exists) => [
-                _jsx(PopperMenuButton, { component: IconButton, PopperProps: { placement: 'bottom-end', sx: { zIndex: 'appBar' } }, menus: [
+                _jsx(PopperMenuButton, { "data-testid": "aigne-runtime-header-menu-button", component: IconButton, PopperProps: { placement: 'bottom-end', sx: { zIndex: 'appBar' } }, menus: [
                         hasSettings && isAdmin && (_jsxs(MenuItem, { onClick: () => settingsDialogState.getState().open(), children: [_jsx(ListItemIcon, { children: _jsx(Icon, { icon: "tabler:settings" }) }), t('settings')] }, "settings")),
                         _jsxs(LoadingMenuItem, { onClick: () => __awaiter(this, void 0, void 0, function* () { return clearSession(); }), children: [_jsx(ListItemIcon, { children: _jsx(Icon, { icon: "mingcute:broom-line" }) }), t('clearSession')] }, "clearSession"),
                     ], children: _jsx(Icon, { icon: "tabler:dots" }) }),
-                _jsx(SocialShare, { content: shareContent }),
+                _jsx(SocialShare, { "data-testid": "aigen-runtime-header-share-button", content: shareContent }),
                 ...exists,
             ],
         }, [locale, hideHeaderMenuButton]);

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

@@ -82,11 +82,15 @@ export default function AutoForm({ submitText, inlineLabel, autoFillLastForm = t
                                 : undefined,
                         }, render: ({ field, fieldState }) => {
                             var _a;
-                            return (_jsxs(Stack, { className: "form-item", children: [parameter.label && _jsx(FormLabel, { children: parameter.label }), _jsx(AgentInputField, { inputProps: { 'data-testid': `runtime-input-${key}` }, 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
+                            return (_jsxs(Stack, { className: "form-item", children: [parameter.label && _jsx(FormLabel, { children: parameter.label }), _jsx(AgentInputField
+                                    // inputProps={{ 'data-testid': `runtime-input-${key}` }}
+                                    , { 
+                                        // inputProps={{ 'data-testid': `runtime-input-${key}` }}
+                                        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: Object.assign(Object.assign({}, (parameter.key === 'question' && submitInQuestionField
                                             ? {
                                                 endAdornment: (_jsx(InputAdornment, { position: "end", sx: { py: 3, mr: -0.75, alignSelf: 'flex-end' }, children: _jsx(LoadingButton, { "data-testid": "runtime-submit-button", ref: submitRef, type: "submit", variant: "contained", loading: running, disabled: submitDisabled, sx: { borderRadius: 1.5 }, children: submitText }) })),
                                             }
-                                            : undefined })] }));
+                                            : {})), ({ 'data-testid': `runtime-input-${key}` } || {})) })] }));
                         } }) }, parameter.id));
             }), !(submitInQuestionField && (parameters === null || parameters === void 0 ? void 0 : parameters.some((i) => i.key === 'question'))) && (_jsx(LoadingButton, { "data-testid": "runtime-submit-button", ref: submitRef, type: "submit", variant: "contained", loading: running, disabled: submitDisabled, sx: { height: 40 }, children: submitText || t('generate') }))] }));
 }

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

@@ -10,6 +10,7 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cx } from '@emotion/css';
 import { Box, Stack } from '@mui/material';
 import { Suspense, memo } from 'react';
 import CustomComponentRenderer from '../../../../../components/CustomComponentRenderer';
@@ -35,7 +36,7 @@ const MessageView = memo(({ message }) => {
     if (!(appearanceOutput === null || appearanceOutput === void 0 ? void 0 : appearanceOutput.componentId))
         return null;
     const agentMessage = (_jsx(MessageBodyContainer, { messageRole: "assistant", children: _jsx(Suspense, { children: _jsx(CustomComponentRenderer, { componentId: appearanceOutput.componentId, properties: appearanceOutput.componentProperties, fallbackRender: AgentErrorView }, message.id) }) }));
-    return (_jsx(CurrentAgentProvider, { agentId: message.agentId, children: _jsx(CurrentMessageProvider, { message: message, children: _jsxs(Stack, { gap: 2, children: [!hideUserInputs && (_jsx(Box, { children: _jsx(UserInfo, { name: (_c = authSession.user) === null || _c === void 0 ? void 0 : _c.fullName, did: (_d = authSession.user) === null || _d === void 0 ? void 0 : _d.did, avatar: getAssetUrl({ filename: (_e = authSession.user) === null || _e === void 0 ? void 0 : _e.avatar, preset: 'avatar' }), time: message.createdAt, reverse: true, alignItems: "flex-start", UserNameProps: { sx: { color: hasBg ? 'white' : undefined } }, children: _jsx(Stack, { sx: { alignItems: 'flex-end' }, children: _jsx(MessageBodyContainer, { messageRole: "user", children: _jsx(AgentErrorBoundary, { children: _jsx(Suspense, { children: _jsx(UserMessageView, {}) }) }) }) }) }) })), _jsx(Box, { children: !hideAgentAvatar ? (_jsx(UserInfo, { name: profile.name, did: (_f = globalThis.blocklet) === null || _f === void 0 ? void 0 : _f.appId, avatar: getAssetUrl({ blockletDid, aid, filename: profile.avatar, preset: 'avatar' }), time: message.createdAt, alignItems: "flex-start", UserNameProps: { sx: { color: hasBg ? 'white' : undefined } }, children: agentMessage })) : (agentMessage) })] }) }) }));
+    return (_jsx(CurrentAgentProvider, { agentId: message.agentId, children: _jsx(CurrentMessageProvider, { message: message, children: _jsxs(Stack, { gap: 2, className: "message-item", "data-testid": `message-${message.id}`, children: [!hideUserInputs && (_jsx(Box, { children: _jsx(UserInfo, { name: (_c = authSession.user) === null || _c === void 0 ? void 0 : _c.fullName, did: (_d = authSession.user) === null || _d === void 0 ? void 0 : _d.did, avatar: getAssetUrl({ filename: (_e = authSession.user) === null || _e === void 0 ? void 0 : _e.avatar, preset: 'avatar' }), time: message.createdAt, reverse: true, alignItems: "flex-start", UserNameProps: { sx: { color: hasBg ? 'white' : undefined } }, children: _jsx(Stack, { sx: { alignItems: 'flex-end' }, children: _jsx(MessageBodyContainer, { messageRole: "user", children: _jsx(AgentErrorBoundary, { children: _jsx(Suspense, { children: _jsx(UserMessageView, {}) }) }) }) }) }) })), _jsx(Box, { children: !hideAgentAvatar ? (_jsx(UserInfo, { name: profile.name, did: (_f = globalThis.blocklet) === null || _f === void 0 ? void 0 : _f.appId, avatar: getAssetUrl({ blockletDid, aid, filename: profile.avatar, preset: 'avatar' }), time: message.createdAt, alignItems: "flex-start", UserNameProps: { sx: { color: hasBg ? 'white' : undefined } }, children: agentMessage })) : (agentMessage) })] }) }) }));
 });
 export default MessageView;
 export function MessageBodyContainer(_a) {
@@ -44,6 +45,6 @@ export function MessageBodyContainer(_a) {
     const preferences = useComponentPreferences();
     const hasBg = !!((_b = preferences === null || preferences === void 0 ? void 0 : preferences.backgroundImage) === null || _b === void 0 ? void 0 : _b.url);
     const hideUserMessage = preferences === null || preferences === void 0 ? void 0 : preferences.hideUserInputs;
-    return (_jsx(Box, Object.assign({}, props, { sx: hasBg
+    return (_jsx(Box, Object.assign({}, props, { className: cx(props.className, 'message-content', `${messageRole}-message-content`), sx: hasBg
             ? Object.assign({ borderRadius: 1, borderTopRightRadius: messageRole === 'user' ? 2 : undefined, borderTopLeftRadius: messageRole !== 'user' ? 2 : undefined, px: 2, py: 1, marginTop: 0.5, maxWidth: hideUserMessage ? 'unset' : 'calc(100% - 40px)', bgcolor: 'rgba(255, 255, 255, 0.8)', backdropFilter: 'blur(16px)' }, props.sx) : Object.assign({}, props.sx) })));
 }

package/lib/esm/builtin/async/ai-runtime/utils/languages.js

@@ -0,0 +1,33 @@
+import { Bg, Cn, Cz, De, Dk, Es, Fi, Fr, Gb, Gr, Hu, Id, Il, In, It, Jp, Kr, Nl, No, Pl, Pt, Ro, Ru, Sa, Se, Sk, Th, Tr, Tw, Vn, } from 'react-flags-select';
+export const languages = [
+    { en: 'English', name: 'English', abbr: 'GB', flag: Gb, cn: '英语' },
+    { en: 'Simplified Chinese', name: '简体中文', abbr: 'CN', flag: Cn, cn: '简体中文' },
+    { en: 'Traditional Chinese', name: '繁体中文', abbr: 'ZH-TW', flag: Tw, cn: '繁体中文' },
+    { en: 'Spanish', name: 'Español', abbr: 'ES', flag: Es, cn: '西班牙语' },
+    { en: 'French', name: 'Français', abbr: 'FR', flag: Fr, cn: '法语' },
+    { en: 'German', name: 'Deutsch', abbr: 'DE', flag: De, cn: '德语' },
+    { en: 'Italian', name: 'Italiano', abbr: 'IT', flag: It, cn: '意大利语' },
+    { en: 'Portuguese', name: 'Português', abbr: 'PT', flag: Pt, cn: '葡萄牙语' },
+    { en: 'Japanese', name: '日本語', abbr: 'JP', flag: Jp, cn: '日语' },
+    { en: 'Korean', name: '한국어', abbr: 'KR', flag: Kr, cn: '韩语' },
+    { en: 'Russian', name: 'Русский', abbr: 'RU', flag: Ru, cn: '俄语' },
+    { en: 'Polish', name: 'Polski', abbr: 'PL', flag: Pl, cn: '波兰语' },
+    { en: 'Arabic', name: 'العربية', abbr: 'SA', flag: Sa, cn: '阿拉伯语' },
+    { en: 'Dutch', name: 'Nederlands', abbr: 'NL', flag: Nl, cn: '荷兰语' },
+    { en: 'Swedish', name: 'Svenska', abbr: 'SE', flag: Se, cn: '瑞典语' },
+    { en: 'Finnish', name: 'Suomi', abbr: 'FI', flag: Fi, cn: '芬兰语' },
+    { en: 'Czech', name: 'Čeština', abbr: 'CZ', flag: Cz, cn: '捷克语' },
+    { en: 'Danish', name: 'Dansk', abbr: 'DK', flag: Dk, cn: '丹麦语' },
+    { en: 'Greek', name: 'Ελληνικά', abbr: 'GR', flag: Gr, cn: '希腊语' },
+    { en: 'Romanian', name: 'Română', abbr: 'RO', flag: Ro, cn: '罗马尼亚语' },
+    { en: 'Hungarian', name: 'Magyar', abbr: 'HU', flag: Hu, cn: '匈牙利语' },
+    { en: 'Bulgarian', name: 'Български', abbr: 'BG', flag: Bg, cn: '保加利亚语' },
+    { en: 'Slovak', name: 'Slovenčina', abbr: 'SK', flag: Sk, cn: '斯洛伐克语' },
+    { en: 'Norwegian', name: 'Norsk', abbr: 'NO', flag: No, cn: '挪威语' },
+    { en: 'Hebrew', name: 'עברית', abbr: 'IL', flag: Il, cn: '希伯来语' },
+    { en: 'Turkish', name: 'Türkçe', abbr: 'TR', flag: Tr, cn: '土耳其语' },
+    { en: 'Thai', name: 'ไทย', abbr: 'TH', flag: Th, cn: '泰语' },
+    { en: 'Indonesian', name: 'Bahasa Indonesia', abbr: 'ID', flag: Id, cn: '印尼语' },
+    { en: 'Vietnamese', name: 'Tiếng Việt', abbr: 'VN', flag: Vn, cn: '越南语' },
+    { en: 'Hindi', name: 'हिन्दी', abbr: 'IN', flag: In, cn: '印地语' },
+];

package/lib/esm/builtin/components.js

@@ -0,0 +1 @@
+export { default as LanguageField } from './async/ai-runtime/components/AgentInputField/LanguageField';

package/lib/esm/builtin/mui/material.js

@@ -1 +1 @@
-export { Checkbox, ListItemText, Alert, AlertTitle, Autocomplete, Avatar, Box, Button, IconButton, ButtonGroup, Card, CardActionArea, CardActions, CardContent, CardHeader, CardMedia, CircularProgress, ClickAwayListener, Collapse, Container, Dialog, DialogActions, DialogContent, DialogTitle, Divider, Fade, GlobalStyles, Grid, Grow, LinearProgress, Link, List, ListItem, ListItemAvatar, ListItemButton, ListItemIcon, ListItemSecondaryAction, ListSubheader, Menu, MenuItem, MenuList, Paper, Popper, Slide, Stack, Switch, TextField, ThemeProvider, Tooltip, Typography, Zoom, alpha, createTheme, styled, useMediaQuery, useTheme, } from '@mui/material';
+export { Checkbox, ListItemText, Alert, AlertTitle, Autocomplete, Avatar, Box, Button, IconButton, ButtonGroup, Card, CardActionArea, CardActions, CardContent, CardHeader, CardMedia, CircularProgress, ClickAwayListener, Collapse, Container, Dialog, DialogActions, DialogContent, DialogTitle, Divider, Fade, GlobalStyles, Grid, Grow, LinearProgress, Link, List, ListItem, ListItemAvatar, ListItemButton, ListItemIcon, ListItemSecondaryAction, ListSubheader, Menu, MenuItem, MenuList, Paper, Popper, Select, Slide, Stack, Switch, TextField, ThemeProvider, Tooltip, Typography, Zoom, alpha, createTheme, styled, useMediaQuery, useTheme, } from '@mui/material';