@blocklet/pages-kit 0.2.316 → 0.2.318

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

@@ -426,7 +426,7 @@ export default function FormDemo() {
 import { Icon } from '@blocklet/pages-kit/builtin/iconify/react';
 
 export default function TablerSuccessIcon() {
-  return <Icon icon="tabler:check" />;
+  return <Icon icon="tabler:check" fontSize={24} color="rgba(75, 85, 99, 1)"/>;
 }
           `,
                 },

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

@@ -26,6 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
 const arcblockUx = __importStar(require("../builtin/arcblock/ux"));
 const aiRuntime = __importStar(require("../builtin/async/ai-runtime"));
 const imagePreview = __importStar(require("../builtin/async/image-preview"));
@@ -87,5 +88,6 @@ function injectGlobalComponents() {
             return win[builtin_1.BuiltinModulesGlobalVariableName].modules[module];
         },
     };
+    win.React = react_1.default;
 }
 injectGlobalComponents();

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

@@ -12,7 +12,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Icon } from '@iconify/react';
 import { Box, Stack, styled } from '@mui/material';
-import React from 'react';
+import React, { Suspense } from 'react';
 import Markdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
 import { useLocaleContext } from '../../../locale';
@@ -26,7 +26,7 @@ const MarkdownRenderer = styled((props) => (_jsx(Markdown, Object.assign({}, pro
             if (!children)
                 return null;
             const match = /language-(\w+)/.exec(className || '');
-            return !inline ? (_jsx(Box, Object.assign({ component: ReactSyntaxHighlighter, language: match === null || match === void 0 ? void 0 : match[1] }, props, { sx: { borderRadius: 1 }, children: String(children).replace(/\n$/, '') }))) : (_jsx(Box, Object.assign({ component: "code", className: className }, props, { children: children })));
+            return !inline ? (_jsx(Suspense, { children: _jsx(Box, Object.assign({ component: ReactSyntaxHighlighter, language: match === null || match === void 0 ? void 0 : match[1] }, props, { sx: { borderRadius: 1 }, children: String(children).replace(/\n$/, '') })) })) : (_jsx(Box, Object.assign({ component: "code", className: className }, props, { children: children })));
         },
         table: ({ className, children }) => {
             return (_jsx(Box, { sx: { overflow: 'auto', my: 1 }, children: _jsx("table", { className: className, children: children }) }));
@@ -80,6 +80,7 @@ const MarkdownRenderer = styled((props) => (_jsx(Markdown, Object.assign({}, pro
     }
   }
 
+  &.writing:empty,
   &.writing > *:last-child {
     &:after {
       content: '';

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

@@ -0,0 +1,19 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from '@iconify/react';
+import { Box, Stack, Typography } from '@mui/material';
+export default function OutputFieldContainer(_a) {
+    var _b;
+    var { output } = _a, props = __rest(_a, ["output"]);
+    return (_jsxs(Stack, Object.assign({ gap: 1 }, props, { children: [((_b = output.appearance) === null || _b === void 0 ? void 0 : _b.title) && (_jsxs(Typography, { component: "h6", noWrap: true, sx: { display: 'flex', alignItems: 'center', gap: 1, fontSize: 18, fontWeight: 500 }, children: [output.appearance.icon && _jsx(Box, { component: Icon, icon: output.appearance.icon }), _jsx(Box, { component: "span", sx: { flex: 1, textOverflow: 'hidden' }, children: output.appearance.title })] })), props.children] })));
+}

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

@@ -21,7 +21,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx } from "react/jsx-runtime";
 import { RuntimeOutputVariable } from '@blocklet/ai-runtime/types';
 import { Icon } from '@iconify/react';
-import { Stack, styled } from '@mui/material';
+import { Box, Stack, styled } from '@mui/material';
 import { saveAs } from 'file-saver';
 import { useMemo } from 'react';
 import { withQuery } from 'ufo';
@@ -44,7 +44,7 @@ export default function ShareActions(_a) {
         const C = ShareActionsMap[item.to];
         if (!C)
             return null;
-        return _jsx(C, {});
+        return (_jsx(Box, { children: _jsx(C, {}) }));
     }).filter((i) => !!i);
     if (!(items === null || items === void 0 ? void 0 : items.length))
         return null;

package/lib/esm/builtin/async/ai-runtime/constants.js

@@ -1,5 +1,34 @@
+import { RuntimeOutputVariable } from '@blocklet/ai-runtime/types';
 export const AI_STUDIO_DID = 'z8iZpog7mcgcgBZzTiXJCWESvmnRrQmnd3XBB';
 export const PAYMENT_KIT_DID = 'z2qaCNvKMv5GjouKdcDWexv6WqtHbpNPQDnAk';
-export const DEFAULT_PAGE_COMPONENT_ID = 'ctnxha29uu8cx4xv';
-export const DEFAULT_INPUT_COMPONENT_ID = '1wwtemqcdio6nqf0';
-export const DEFAULT_OUTPUT_COMPONENT_ID = 'q0ckknkxph4hfwas';
+export const DEFAULT_PAGE_COMPONENT_ID = 'ctnxha29uu8cx4xv'; // Simple Layout
+export const DEFAULT_INPUT_COMPONENT_ID = '1wwtemqcdio6nqf0'; // Auto Form
+export const DEFAULT_OUTPUT_COMPONENT_ID = 'q0ckknkxph4hfwas'; // Simple Output
+export const MARKDOWN_VIEW_ID = 'a4oldpoxv7bikvpj';
+export const SUGGESTED_QUESTIONS_VIEW_ID = '6u8m11ss7fvu8t7i';
+export const REFERENCED_LINKS_VIEW_ID = 'baqmaoccdntqwayc';
+export const SHARE_VIEW_ID = 'jfq3df9z8lkk9not';
+export const IMAGES_VIEW_ID = 'txirtdgx8h2bmo7s';
+export const DEFAULT_OUTPUT_COMPONENTS = {
+    [RuntimeOutputVariable.text]: {
+        componentId: MARKDOWN_VIEW_ID,
+    },
+    [RuntimeOutputVariable.images]: {
+        componentId: IMAGES_VIEW_ID,
+    },
+    [RuntimeOutputVariable.openingMessage]: {
+        componentId: MARKDOWN_VIEW_ID,
+    },
+    [RuntimeOutputVariable.suggestedQuestions]: {
+        componentId: SUGGESTED_QUESTIONS_VIEW_ID,
+    },
+    [RuntimeOutputVariable.referenceLinks]: {
+        componentId: REFERENCED_LINKS_VIEW_ID,
+    },
+    [RuntimeOutputVariable.share]: {
+        componentId: SHARE_VIEW_ID,
+    },
+};
+export function getDefaultOutputComponent(output) {
+    return DEFAULT_OUTPUT_COMPONENTS[output.name];
+}

package/lib/esm/builtin/async/ai-runtime/contexts/ActiveAgent.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { RuntimeOutputVariable } from '@blocklet/ai-runtime/types';
+import { createContext, useContext, useMemo, useState } from 'react';
+import { useRuntimeState } from '../state/runtime';
+import { getOutputVariableInitialValue } from '../utils/runtime-output-schema';
+const activeAgentContext = createContext(undefined);
+export function useActiveAgent() {
+    const context = useContext(activeAgentContext);
+    if (!context) {
+        throw new Error('No such activeAgentContext. You should use `useActiveAgent` within the `ActiveAgentProvider`');
+    }
+    return context;
+}
+export default function ActiveAgentProvider({ children }) {
+    const { agent } = useRuntimeState();
+    const childAgentId = useMemo(() => {
+        var _a, _b, _c, _d;
+        return (_d = (_c = (_b = (_a = getOutputVariableInitialValue(agent, RuntimeOutputVariable.children)) === null || _a === void 0 ? void 0 : _a.agents) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.id) !== null && _d !== void 0 ? _d : agent.id;
+    }, [agent]);
+    const [activeAgentId, setActiveAgentId] = useState(childAgentId);
+    const activeAgent = useMemo(() => ({ activeAgentId, setActiveAgentId }), [activeAgentId, setActiveAgentId]);
+    return _jsx(activeAgentContext.Provider, { value: activeAgent, children: children });
+}

package/lib/esm/builtin/async/ai-runtime/contexts/ComponentPreferences.js

@@ -0,0 +1,22 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useMemo } from 'react';
+const componentPreferencesContext = createContext(undefined);
+export function ComponentPreferencesProvider(_a) {
+    var { children } = _a, preferences = __rest(_a, ["children"]);
+    const value = useMemo(() => (Object.assign({}, preferences)), Object.values(preferences));
+    return _jsx(componentPreferencesContext.Provider, { value: value, children: children });
+}
+export function useComponentPreferences() {
+    return useContext(componentPreferencesContext);
+}

package/lib/esm/builtin/async/ai-runtime/contexts/CurrentMessage.js

@@ -5,9 +5,9 @@ export default function CurrentMessageProvider({ message, children }) {
     const state = useMemo(() => ({ message }), [message]);
     return _jsx(context.Provider, { value: state, children: children });
 }
-export function useCurrentMessage() {
+export function useCurrentMessage({ optional } = {}) {
     const current = useContext(context);
-    if (!current) {
+    if (!optional && !current) {
         throw new Error('No such message state. You should use `useCurrentMessage` within the `CurrentMessageProvider`');
     }
     return current;

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

@@ -10,14 +10,16 @@ export default function useAppearances(args) {
     const { agent: runtimeAgent } = useRuntimeState();
     const { agent } = useCurrentAgent(args);
     const appearancePage = useMemo(() => {
-        const appearance = getOutputVariableInitialValue(agent, RuntimeOutputVariable.appearancePage);
+        var _a, _b;
+        const appearance = (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === RuntimeOutputVariable.appearancePage)) === null || _b === void 0 ? void 0 : _b.appearance;
         return Object.assign(Object.assign({}, appearance), { componentId: (appearance === null || appearance === void 0 ? void 0 : appearance.componentId) || DEFAULT_PAGE_COMPONENT_ID });
     }, [agent]);
     const appearanceInput = useMemo(() => {
-        const appearance = getOutputVariableInitialValue(agent, RuntimeOutputVariable.appearanceInput);
+        var _a, _b, _c, _d;
+        const appearance = (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === RuntimeOutputVariable.appearanceInput)) === null || _b === void 0 ? void 0 : _b.appearance;
         if (appearance)
             return appearance;
-        const runtimeAppearance = getOutputVariableInitialValue(runtimeAgent, RuntimeOutputVariable.appearanceInput);
+        const runtimeAppearance = (_d = (_c = runtimeAgent.outputVariables) === null || _c === void 0 ? void 0 : _c.find((i) => i.name === RuntimeOutputVariable.appearanceInput)) === null || _d === void 0 ? void 0 : _d.appearance;
         if (runtimeAppearance)
             return runtimeAppearance;
         return {
@@ -25,10 +27,11 @@ export default function useAppearances(args) {
         };
     }, [agent, runtimeAgent]);
     const appearanceOutput = useMemo(() => {
-        const appearance = getOutputVariableInitialValue(agent, RuntimeOutputVariable.appearanceOutput);
+        var _a, _b, _c, _d;
+        const appearance = (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === RuntimeOutputVariable.appearanceOutput)) === null || _b === void 0 ? void 0 : _b.appearance;
         if (appearance === null || appearance === void 0 ? void 0 : appearance.componentId)
             return appearance;
-        const runtimeAppearance = getOutputVariableInitialValue(runtimeAgent, RuntimeOutputVariable.appearanceOutput);
+        const runtimeAppearance = (_d = (_c = runtimeAgent.outputVariables) === null || _c === void 0 ? void 0 : _c.find((i) => i.name === RuntimeOutputVariable.appearanceOutput)) === null || _d === void 0 ? void 0 : _d.appearance;
         if (runtimeAppearance)
             return runtimeAppearance;
         return {
@@ -61,6 +64,7 @@ export function useOpeningMessage(args) {
         const agentOpening = getOutputVariableInitialValue(agent, RuntimeOutputVariable.openingMessage);
         if (agentOpening === null || agentOpening === void 0 ? void 0 : agentOpening.message) {
             return {
+                agent,
                 message: agentOpening.message,
                 profile,
             };
@@ -68,6 +72,7 @@ export function useOpeningMessage(args) {
         const runtimeOpening = getOutputVariableInitialValue(runtimeAgent, RuntimeOutputVariable.openingMessage);
         if (runtimeOpening === null || runtimeOpening === void 0 ? void 0 : runtimeOpening.message) {
             return {
+                agent: runtimeAgent,
                 message: runtimeOpening.message,
                 profile: runtimeProfile,
             };

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

@@ -0,0 +1,32 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from '@iconify/react';
+import { IconButton, ListItemIcon } from '@mui/material';
+import { useLocaleContext } from '../../../locale';
+import { useHeader } from '../../../page/header';
+import PopperMenuButton from '../components/PopperMenuButton';
+import LoadingMenuItem from '../components/PopperMenuButton/LoadingMenuItem';
+import { useComponentPreferences } from '../contexts/ComponentPreferences';
+import { useSessionState } from '../state/session';
+export function useHeaderMenu() {
+    var _a;
+    const { t, locale } = useLocaleContext();
+    const { hideHeaderMenuButton } = (_a = useComponentPreferences()) !== null && _a !== void 0 ? _a : {};
+    const clearSession = useSessionState((s) => s.clearSession);
+    useHeader(() => hideHeaderMenuButton
+        ? {}
+        : {
+            addons: (...exists) => [
+                _jsx(PopperMenuButton, { component: IconButton, PopperProps: { placement: 'bottom-end', sx: { zIndex: 'appBar' } }, menus: _jsxs(LoadingMenuItem, { onClick: () => __awaiter(this, void 0, void 0, function* () { return clearSession(); }), children: [_jsx(ListItemIcon, { children: _jsx(Icon, { icon: "mingcute:broom-line" }) }), t('clearSession')] }), children: _jsx(Icon, { icon: "tabler:dots" }) }),
+                ...exists,
+            ],
+        }, [locale, hideHeaderMenuButton]);
+}

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

@@ -8,11 +8,18 @@ export { default as Runtime } from './runtime/Runtime';
 export { default as ChatBotButton } from './runtime/ChatBotButton';
 export { default as SimplePage } from './runtime-components/SimplePage';
 export { default as SimpleChat } from './runtime-components/SimpleChat';
-export { default as MultiAgentsChat } from './runtime-components/MultiAgentsChat';
 export { default as PhotoGallery } from './runtime-components/PhotoGallery';
 export { default as AutoForm } from './runtime-components/AutoForm';
 export { default as SimpleOutput } from './runtime-components/SimpleOutput';
 export { default as ChatOutput } from './runtime-components/ChatOutput';
 export { default as PhotoGalleryItem } from './runtime-components/PhotoGalleryItem';
+export { default as SuggestedQuestionsView } from './runtime-components/SuggestedQuestionsView';
+export { default as ReferencedLinksView } from './runtime-components/ReferencedLinksView';
+export { default as ShareView } from './runtime-components/ShareView';
+export { default as OpeningQuestionsView } from './runtime-components/OpeningQuestionsView';
+export { default as ImagesView } from './runtime-components/ImagesView';
+export { default as GoogleSearchRelatedQuestionsView } from './runtime-components/GoogleSearch/GoogleSearchRelatedQuestionsView';
+export { default as GoogleSearchSourcesView } from './runtime-components/GoogleSearch/GoogleSearchSourcesView';
+export { default as MarkdownView } from './runtime-components/MarkdownView';
 // only use to debug, should be removed when PR
 export * from './runtime-components/V0';

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

@@ -34,6 +34,7 @@ export const translations = {
         rename: 'Rename',
         delete: 'Delete',
         confirmDelete: 'Confirm Delete?',
+        confirm: 'Confirm',
         noData: 'No {data} yet',
         createObject: 'Create {object}',
         title: 'Title',
@@ -92,6 +93,18 @@ export const translations = {
         send: 'Send',
         session: 'Session',
         loadMore: 'Load More',
+        v0: {
+            title: 'AIGNE v0',
+            description: 'AIGNE v0 is an AI-based code tool that can help you generate code quickly.',
+            noData: 'No conversation information yet, click the button below to start generating!',
+            deleteSessionTitle: 'Delete Conversation Information',
+            deleteSessionTip: 'Are you sure you want to delete this Conversation Information?',
+            propertiesSetting: 'Properties Setting',
+            propertiesSettingTip: 'This function is used for debugging components and does not affect the final code',
+            cannotSetPropertiesTip: 'Failed to parse PROPERTIES_SCHEMA, this code cannot be set properties',
+            codePreview: 'Code Preview',
+            codePreviewTip: 'Here is the code preview, you can view the generated code, and editing is not supported yet.',
+        },
     },
     zh: {
         by: '作者',
@@ -128,6 +141,7 @@ export const translations = {
         rename: '重命名',
         delete: '删除',
         confirmDelete: '确定删除？',
+        confirm: '确定',
         noData: '暂无{data}',
         createObject: '创建{object}',
         title: '标题',
@@ -186,5 +200,17 @@ export const translations = {
         send: '发送',
         session: '会话',
         loadMore: '加载更多',
+        v0: {
+            title: 'AIGNE v0',
+            description: 'AIGNE v0 是一个基于人工智能的代码工具，可以帮助您快速生成代码。',
+            noData: '暂无生成记录，点击下方按钮开始生成吧！',
+            deleteSessionTitle: '删除生成记录',
+            deleteSessionTip: '确定要删除此生成记录吗？',
+            propertiesSetting: '属性设置',
+            propertiesSettingTip: '此功能用于调试组件，不影响最终代码',
+            cannotSetPropertiesTip: '解析 PROPERTIES_SCHEMA 失败，此代码无法进行属性设置',
+            codePreview: '代码预览',
+            codePreviewTip: '以下是代码预览，您可以查看生成的代码，目前还不支持编辑。',
+        },
     },
 };

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

@@ -20,12 +20,13 @@ import LoadingMenuItem from '../../components/PopperMenuButton/LoadingMenuItem';
 import RuntimeCommonProvider from '../../components/RuntimeCommonProvider';
 import ScrollView from '../../components/ScrollView';
 import { DEFAULT_PAGE_COMPONENT_ID } from '../../constants';
+import ActiveAgentProvider from '../../contexts/ActiveAgent';
 import RuntimeProvider from '../../contexts/Runtime';
 import useAppearances, { useProfile } from '../../hooks/use-appearances';
 import { useRuntimeState } from '../../state/runtime';
 import { useAutoLoadSessionState, useSessionState } from '../../state/session';
 export default function ChatBotButton({ aid, working }) {
-    return (_jsx(RuntimeProvider, { aid: aid, working: working, children: _jsx(RuntimeCommonProvider, { children: _jsx(ChatBotContent, {}) }) }));
+    return (_jsx(RuntimeCommonProvider, { children: _jsx(RuntimeProvider, { aid: aid, working: working, children: _jsx(ActiveAgentProvider, { children: _jsx(ChatBotContent, {}) }) }) }));
 }
 function ChatBotContent() {
     var _a, _b;
@@ -44,7 +45,7 @@ function ChatBotContent() {
                         '.aigne-layout': {
                             px: 2,
                         },
-                    }, children: _jsx(Suspense, { fallback: _jsx(Stack, { flexGrow: 1, alignItems: "center", justifyContent: "center", children: _jsx(CircularProgress, { size: 24 }) }), children: _jsx(CustomComponentRenderer, { componentId: componentId, properties: appearancePage === null || appearancePage === void 0 ? void 0 : appearancePage.componentProps, props: { scrollViewProps: { disabled: true }, hideHeaderMenuButton: true } }) }) }) }))] }));
+                    }, children: _jsx(Suspense, { fallback: _jsx(Stack, { flexGrow: 1, alignItems: "center", justifyContent: "center", children: _jsx(CircularProgress, { size: 24 }) }), children: _jsx(CustomComponentRenderer, { componentId: componentId, properties: appearancePage === null || appearancePage === void 0 ? void 0 : appearancePage.componentProperties, props: { scrollViewProps: { disabled: true }, hideHeaderMenuButton: true } }) }) }) }))] }));
 }
 function ResponsiveChatBotContainer({ open, anchorEl, children, onClose, }) {
     const theme = useTheme();

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

@@ -10,6 +10,7 @@ import { getComponentMountPoint } from '../../../../utils';
 import RuntimeCommonProvider, { RuntimeLocaleProvider } from '../../components/RuntimeCommonProvider';
 import SocialShare from '../../components/SocialShare';
 import { AI_STUDIO_DID, DEFAULT_PAGE_COMPONENT_ID } from '../../constants';
+import ActiveAgentProvider from '../../contexts/ActiveAgent';
 import RuntimeProvider, { RuntimeProviderFromUrl } from '../../contexts/Runtime';
 import useAppearances from '../../hooks/use-appearances';
 import { useRuntimeState } from '../../state/runtime';
@@ -19,11 +20,8 @@ function AgentCreatedBy({ did }) {
     return (_jsxs(_Fragment, { children: [t('by'), " ", _jsx(Box, { component: DID, did: did, copyable: false, responsive: true })] }));
 }
 export default function Runtime({ aid, working }) {
-    const children = (_jsx(RuntimeCommonProvider, { children: _jsx(RuntimeView, {}) }));
-    if (aid) {
-        return (_jsx(RuntimeProvider, { aid: aid, working: working, children: children }));
-    }
-    return _jsx(RuntimeProviderFromUrl, { children: children });
+    const children = (_jsx(ActiveAgentProvider, { children: _jsx(RuntimeView, {}) }));
+    return (_jsx(RuntimeCommonProvider, { children: aid ? (_jsx(RuntimeProvider, { aid: aid, working: working, children: children })) : (_jsx(RuntimeProviderFromUrl, { children: children })) }));
 }
 function RuntimeView() {
     var _a;
@@ -59,5 +57,5 @@ ${agent === null || agent === void 0 ? void 0 : agent.description}
         };
     }, [locale, isMobile, agent]);
     const componentId = (_a = appearancePage === null || appearancePage === void 0 ? void 0 : appearancePage.componentId) !== null && _a !== void 0 ? _a : DEFAULT_PAGE_COMPONENT_ID;
-    return (_jsxs(_Fragment, { children: [_jsxs(Helmet, { children: [agent.project.name && _jsx("title", { children: agent.project.name }), agent.project.description && _jsx("meta", { name: "description", content: agent.project.description })] }), _jsx(CustomComponentRenderer, { componentId: componentId, properties: appearancePage === null || appearancePage === void 0 ? void 0 : appearancePage.componentProps })] }));
+    return (_jsxs(_Fragment, { children: [_jsxs(Helmet, { children: [agent.project.name && _jsx("title", { children: agent.project.name }), agent.project.description && _jsx("meta", { name: "description", content: agent.project.description })] }), _jsx(CustomComponentRenderer, { componentId: componentId, properties: appearancePage === null || appearancePage === void 0 ? void 0 : appearancePage.componentProperties })] }));
 }

package/lib/esm/builtin/async/ai-runtime/runtime-components/ChatOutput/MessageErrorView.js

@@ -2,12 +2,12 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Alert, Box } from '@mui/material';
 import { useLocaleContext } from '../../../../locale';
 import MarkdownRenderer from '../../components/MarkdownRenderer';
-export default function MessageErrorView({ error }) {
+export default function MessageErrorView({ error, sx }) {
     const { t } = useLocaleContext();
     if (!error)
         return null;
     if (error.status === 401) {
         return (_jsx(Box, { className: "ai-chat-message-error", children: _jsx(Box, { className: "message-response", children: _jsx(MarkdownRenderer, { children: t('requireLogin') }) }) }));
     }
-    return (_jsx(Alert, { className: "ai-chat-message-error", severity: "error", sx: { mr: 5 }, children: error.message }));
+    return (_jsx(Alert, { className: "ai-chat-message-error", severity: "error", sx: Object.assign({ mr: 5 }, sx), children: error.message }));
 }

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

@@ -0,0 +1,54 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Divider, List, ListItemButton } from '@mui/material';
+import Joi from 'joi';
+import { useMemo, useState } from 'react';
+import OutputFieldContainer from '../../components/OutputFieldContainer';
+import { useCurrentAgent } from '../../contexts/CurrentAgent';
+import { useCurrentMessage } from '../../contexts/CurrentMessage';
+import { useRuntimeState } from '../../state/runtime';
+import { useCurrentSessionState } from '../../state/session';
+const searchResultSchema = Joi.object({
+    related_questions: Joi.array().items(Joi.object({
+        question: Joi.string().required(),
+        link: Joi.string().required(),
+        snippet: Joi.string().empty([null, '']),
+        title: Joi.string().required(),
+    })),
+});
+export default function GoogleSearchRelatedView({ output, outputValue, onlyLastMessage, }) {
+    var _a, _b;
+    const { aid } = useCurrentAgent();
+    const { message } = (_a = useCurrentMessage({ optional: true })) !== null && _a !== void 0 ? _a : {};
+    const lastMessage = useCurrentSessionState((s) => { var _a; return (_a = s === null || s === void 0 ? void 0 : s.messages) === null || _a === void 0 ? void 0 : _a.at(-1); });
+    const isLastMessage = !!message && (message === null || message === void 0 ? void 0 : message.taskId) === (lastMessage === null || lastMessage === void 0 ? void 0 : lastMessage.taskId);
+    const [submitting, setSubmitting] = useState(false);
+    const { execute } = useRuntimeState();
+    const result = useMemo(() => {
+        const result = searchResultSchema.validate(outputValue, { allowUnknown: true });
+        if (result.error)
+            return undefined;
+        return result.value;
+    }, [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* () {
+                            if (submitting)
+                                return;
+                            setSubmitting(true);
+                            try {
+                                yield execute({ aid, parameters: { question: item.question } });
+                            }
+                            finally {
+                                setSubmitting(false);
+                            }
+                        }), children: item.question }, item.title), _jsx(Divider, {})] }))) }) }));
+}

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

@@ -0,0 +1,44 @@
+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 OutputFieldContainer from '../../components/OutputFieldContainer';
+import { useCurrentMessage } from '../../contexts/CurrentMessage';
+const searchResultSchema = Joi.object({
+    organic_results: Joi.array().items(Joi.object({
+        title: Joi.string().required(),
+        link: Joi.string().required(),
+        snippet: Joi.string().required(),
+        favicon: Joi.string().empty([null, '']),
+        source: Joi.string().empty([null, '']),
+    })),
+});
+export default function GoogleSearchSourcesView({ output, outputValue }) {
+    var _a;
+    const { message } = (_a = useCurrentMessage({ optional: true })) !== null && _a !== void 0 ? _a : {};
+    const searchResult = useMemo(() => {
+        const result = searchResultSchema.validate(outputValue, { allowUnknown: true });
+        if (result.error)
+            return undefined;
+        return result.value;
+    }, [outputValue]);
+    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)))] }) }));
+}
+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 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: {
+                                display: '-webkit-box',
+                                WebkitBoxOrient: 'vertical',
+                                WebkitLineClamp: 2,
+                                overflow: 'hidden',
+                                fontWeight: 500,
+                            }, children: title }) }), _jsxs(Stack, { flexDirection: "row", alignItems: "center", gap: 1, overflow: "hidden", children: [_jsx(Box, { width: 18, height: 18, children: favicon }), _jsx(Typography, { variant: "caption", noWrap: true, sx: { flex: 1, width: 1 }, children: link })] })] }) }) }));
+}

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

@@ -0,0 +1,24 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import ImagePreview from '@blocklet/ai-kit/components/image-preview';
+import { Skeleton } from '@mui/material';
+import Joi from 'joi';
+import { useMemo } from 'react';
+import OutputFieldContainer from '../../components/OutputFieldContainer';
+import { useCurrentMessage } from '../../contexts/CurrentMessage';
+const imagesSchema = Joi.array().items(Joi.object({
+    url: Joi.string().required(),
+}));
+export default function ImagesView({ output, outputValue }) {
+    var _a;
+    const { message } = (_a = useCurrentMessage({ optional: true })) !== null && _a !== void 0 ? _a : {};
+    const images = useMemo(() => {
+        var _a;
+        const result = imagesSchema.validate(outputValue, { allowUnknown: true });
+        if (result.error)
+            return undefined;
+        return (_a = result.value) === null || _a === void 0 ? void 0 : _a.map((i) => ({ src: i.url }));
+    }, [outputValue]);
+    if (!(images === null || images === void 0 ? void 0 : images.length) && !(message === null || message === void 0 ? void 0 : message.loading))
+        return null;
+    return (_jsx(OutputFieldContainer, { output: output, sx: { '.lazy-image-wrapper': { borderRadius: 1, img: { borderRadius: 1 } } }, children: (images === null || images === void 0 ? void 0 : images.length) ? (_jsx(ImagePreview, { dataSource: images, itemWidth: 200, spacing: 1 })) : (message === null || message === void 0 ? void 0 : message.loading) ? (_jsx(Skeleton, { width: 200, height: 200, variant: "rounded" })) : null }));
+}

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

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cx } from '@emotion/css';
+import MarkdownRenderer from '../../components/MarkdownRenderer';
+import OutputFieldContainer from '../../components/OutputFieldContainer';
+export default function MarkdownView({ output, outputValue, fontSize, writing, }) {
+    return (_jsx(OutputFieldContainer, { output: output, children: _jsx(MarkdownRenderer, { className: cx(writing && 'writing'), sx: { fontSize: typeof fontSize === 'string' && /^\d+$/.test(fontSize) ? Number(fontSize) : fontSize }, children: outputValue }) }));
+}

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

@@ -0,0 +1,40 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { List, ListItemButton, listItemButtonClasses } from '@mui/material';
+import { useState } from 'react';
+import OutputFieldContainer from '../../components/OutputFieldContainer';
+import { useCurrentAgent } from '../../contexts/CurrentAgent';
+import { useOpeningQuestions } from '../../hooks/use-appearances';
+import { useRuntimeState } from '../../state/runtime';
+export default function OpeningQuestionsView({ output }) {
+    const { aid } = useCurrentAgent();
+    const { execute } = useRuntimeState();
+    const opening = useOpeningQuestions();
+    const [submitting, setSubmitting] = useState(false);
+    if (!(opening === null || opening === void 0 ? void 0 : opening.questions.length))
+        return null;
+    return (_jsx(OutputFieldContainer, { output: output, children: _jsx(List, { disablePadding: true, sx: { [`.${listItemButtonClasses.root}`]: { border: 1, borderColor: 'grey.200', borderRadius: 1, my: 1 } }, children: opening.questions.map((item) => {
+                return (_jsx(ListItemButton, { onClick: () => __awaiter(this, void 0, void 0, function* () {
+                        if (submitting)
+                            return;
+                        try {
+                            setSubmitting(true);
+                            yield execute({
+                                aid,
+                                parameters: Object.assign(Object.assign({}, item.parameters), { question: item.parameters.question || item.title }),
+                            });
+                        }
+                        finally {
+                            setSubmitting(false);
+                        }
+                    }), children: item.title }, item.id));
+            }) }) }));
+}

package/lib/esm/builtin/async/ai-runtime/runtime-components/OutputFieldView/type.js

@@ -0,0 +1 @@
+export {};